Welche Webdesign Trends präsentieren eine Website zeitgemäß?

Welche Webdesign Trends präsentieren eine Website zeitgemäß?

Wer eine Marke, ein Produkt oder ein Unternehmen launchen möchte, kommt um ein Medium nicht umhin: Eine ansehnliche Website. Diese ist heutzutage die unabdingbare Präsenz des zu bewerbenden Objekts. Es ist die Schnittschnelle zwischen Schaufenster und Kontaktbasis für die Öffentlichkeit. Eine Website hält den Blick des Kunden gefangen, indem sie mit ästhetischen Layouts überzeugt und die aktuellsten Webdesign Trends umsetzt.

Welche Trends Websiten im letzten Jahr so erfolgreich und einprägsam machten, sind beispielsweise das sogenannte Hamburger Menü, das UI-Element, das eine Menüleiste auf der Seite darstellt.

Minimalistisch und modern, hier umgesetzt bei der Zalando Mobile Ansicht.

Durch die platzsparende Umsetzung bietet sich mehr Platz für ein einprägsames Bild, ein Video oder auch ein GIF. Bildliche Darstellungen führen in den Webdesign Trends der letzten Jahre.
Die Struktur der Websites kriegt somit einen neuen Gesamteindruck, der moderner und übersichtlicher wirkt, da der Betrachter nicht von zu vielen Optionsleisten auf einmal überrannt wird – die zahlreichen Klickmöglichkeiten sind aber dennoch vorhanden.

Ein weiterer Gestaltungstrend, der zur strukturierten Übersicht der Websites dient, ist das Card-Design. Eine Gestaltungsoption mit der man beispielsweise Themenblöcke durch verschiedenen Abgrenzungen darstellen kann. Beim Abgrenzen oder Hervorheben ist der Kreativität keine Grenze gesetzt. Durch Bilder, einfache Hintergrundfarben oder Umrahmungen kann im „Kartenstil“ eine Overview über verschiedene Unterpunkte gegeben werden.

Bekannte Vorreiter sind beispielsweise Pinterest und Spotifiy.

Das Card-Design ist deshalb so erfolgreich, weil es sich in Kombination mit Bildern gut gestalten lässt und für das Auge des Betrachters die wichtigsten Punkte schnell zu erfassen sind. Themen werden so auf den ersten Blick stichpunktartig aufgenommen.

Webdesign Trends von 2016 haben sich auf minimalistischere Präsenzen festgelegt. Dafür sind schnellere Ladezeiten und ausdrucksvolle Bildsprache wichtiger geworden. Die Benutzung soll einfacher, schneller, unkomplizierter werden – die Technik von heute macht es möglich. In 2017 sind diese Trends dabei sich detaillierter weiterzuentwickeln. Was man bereits beobachten kann, ist der weiter anhaltende Fokus auf Bildlichkeit, um auf diese Weise die Kernpunkte des zu bewerbenden Inhalts einprägsam rüberzubringen. Die Entwicklung von Bild zu Video Nutzung auf Homepages ist ein aktueller Trend, der ebenfalls zur Contentstrategie und Vermarktung genutzt wird. Storytelling ist eine beliebte und effektive Kundenbindung, die durch die Nutzung der Video-Medien greifbarer gemacht wird.

Um der so beliebten Bildsprache den nächsten Feinschliff zu verpassen ist das Parallax-Design der nächste Trend, der stark im Kommen ist. Durch mehrere Bildebenen wird das Bild oder das GIF plastischer, greifbarer – schöner. Dabei handelt es sich beispielsweise einfach nur um ein Bild mit klarem Vorder- und Hintergrund oder sichtbaren 3D Effekt.

Auch die Anknüpfung an das Card-Design wird weiter ausgeführt:
Der Screen-Split wird immer beliebter und reiht sich in die Konzeptidee des minimalistisch Klaren ein.

Selbstverständlich behalten wir weiterhin alle aktuellen Webdesign Trends sowie ihre Weiterentwicklungen im Auge, um unsere Kunden modern und wettbewerbsfähig zu präsentieren. Kontaktieren Sie uns gerne, wenn Sie die Trends auch für Ihre Marke, Ihr Produkt oder Ihr Unternehmen realisiert wissen wollen. we {code} it ist Ihr Partner, um Sie digital in Ihrer Agilität zu unterstützen und mit der Zeit gehen zu lassen.

So wird die Firmenwebsite zum Erfolg

So wird die Firmenwebsite zum Erfolg

Um Kunden anzulocken, ist eine attraktive Website heutzutage unverzichtbar. Sie wird nicht umsonst als das Aushängeschild des Unternehmens gesehen. Aber warum genau ist sie so wichtig, und was gehört alles zu einer gut gelungenen Website?

Der erste Eindruck zählt
Der erste Kontakt mit einem Unternehmen findet mittlerweile oft über dessen Website statt, denn immer mehr Menschen kaufen oder informieren sich online. Und man weiß ja: Der erste Eindruck zählt. Ist die Website also total veraltet, nicht auf die Zielgruppe ausgerichtet, oder es gibt erst gar keine, dann macht das einen schlechten Eindruck auf den Kunden. Mit einer modernen und ansprechenden Online-Präsenz lässt sich dieses Worst Case Szenario ganz einfach vermeiden.

Für eine gelungene Website gibt es zwar kein Standardrezept, aber einige unverzichtbare Elemente und Methoden sorgen dafür, dass Kunden begeistert sein werden:

Eine kreative Landing Page dient als Eyecatcher und stellt das Produkt oder die Dienstleistung des Unternehmens einprägsam vor. Beispielsweise macht ein hochauflösendes Foto das Produkt direkt attraktiv (man denke an Apple). Eine Übersicht besonders gelungener Landing Pages gibt es hier.

Relevante und auf den Punkt gebrachte Inhalte überzeugen. Die Seite sollte nicht durch zu viele Informationen überladen sein, sondern das Unternehmen und seine Produkte oder Dienstleistungen prägnant vorstellen. Besonders wichtige Informationen, wie zum Beispiel Leistungen oder Öffnungszeiten, sollten direkt sichtbar oder sehr leicht zu finden sein. Außerdem sollten die Inhalte immer auf dem aktuellsten Stand gehalten werden.

Ein modernes und auf die Zielgruppe ausgerichtetes Design ist nicht nur ästhetisch ansprechend, sondern zeigt auch einen Sinn für aktuelle Trends. Eine intuitive Navigation macht dem Nutzer den Besuch der Seite zur Freude.

Interaktive Elemente wie Buttons oder Chatfenster involvieren den Nutzer und regen ihn an, die Inhalte der Seite zu entdecken. Auch eingebettete Videos bringen Abwechslung und können eine große Menge an Informationen anschaulich vermitteln. Übertreiben sollte man es dabei aber auch nicht, denn das überfordert die Nutzer.

Ein Online-Shop, sofern relevant und möglich, macht dem Kunden das Leben leicht. So können Produkte bequem nach Hause bestellt werden.

Mobilgerätefreundlichkeit ist heutzutage unvermeidbar. Immer mehr Menschen sind mobil auf Websites unterwegs und shoppen online. Lädt die Seite dabei ewig, springen viele Nutzer direkt wieder ab. Accelerated Mobile Pages schaffen hier Abhilfe. Wichtig ist außerdem auch Responsive Design, damit sich die Website auf jedem Endgerät von ihrer besten Seite zeigt.

Mehrwert bieten zahlt sich aus. Wer dem Kunden schon vor dem Kauf etwas anbietet – zum Beispiel nützliche Informationen, Videos, Newsletter, etc. – der erzeugt ein Bedürfnis, die Leistungen des Unternehmens wahrzunehmen.

Möglichst einzigartig sein ist nicht nur für Unternehmen an sich wichtig. Auch eine Website sollte sich von der der Konkurrenz abheben, und nicht einfach nur kopiert sein. So bleibt sie dem Kunden auch in Erinnerung.

Es gibt quasi unendliche Möglichkeiten, eine Website zu gestalten. Der Kreativität sind hier keine Grenzen gesetzt. Wer dabei auf die genannten Punkte achtet, stellt sicher, dass sie ein voller Erfolg wird.

Progressive Web Apps & Object Oriented CSS

Progressive Web Apps & Object Oriented CSS

Heute gehen wir weiter auf euer Leser-Feedback ein und setzen unsere Übersicht zu den von euch gewünschten Themen fort. Im Folgenden geben wir euch einen kurzen Überblick über PWAs und OOCSS:

PWAs

Bei Progressive Web Apps handelt es sich um eine relativ neue Mischform aus Website und nativer App. PWAs lassen sich wie eine native App verwenden, benötigen dafür jedoch keine standardmäßige Installation. Stattdessen können über den Webbrowser auf dem Homescreen Verknüpfungen hinterlegt werden, die dann die entsprechende Website aufrufen. Für Nutzer bringt dies den Vorteil, dass sie keine App aus dem AppStore laden und dafür Speicherplatz freigeben müssen. Für die Betreiber entstehen durch das Umgehen des AppStores weniger Kosten bei vergleichbarer Kundenbindung.

PWAs lassen sich auch bei geringer Bandbreite nutzen und sind mit Hilfe von Service Workers offline verwendbar. Dadurch unterstützen PWAs das Offline First-Konzept und ermöglichen es dem Nutzer, Inhalte jederzeit und überall unabhängig von einer Internetverbindung abrufen zu können (mehr zu Offline First erfahrt ihr in unserem Blogbeitrag). Neue Inhalte laden dann entsprechend bei bestehender Internetverbindung. Außerdem werden auch Push Notifications unterstützt.

Realisierbar sind PWAs unter anderem mit HTML5, CSS3, JavaScript und Service Worker. Bisher besteht allerdings nur bei Chrome und Firefox ein vollständiger Support für Service Worker; weitere Browser wie Safari und Opera sollen jedoch folgen.

OOCSS

Object Oriented CSS ist eine Methode, um CSS modulär und objektorientiert zu gestalten. Diese besteht zum einen daraus, die Struktur eines Objekts (z.B. Höhe, Breite) von seinem Design (z.B. Schriftart, Farbe) zu trennen. Dadurch können Komponente problemlos innerhalb des Layouts verschoben werden. Außerdem geht es bei OOCSS auch darum, Inhalt und Container zu trennen, sodass jedes Objekt sich an einen beliebigen Inhalt anpasst. Folgendes Beispiel verdeutlicht dieses Prinzip und seine Vorteile:

In der obigen Form wird das Gesamterscheinungsbild der Objekte jeweils einzeln definiert. Es findet keine Unterscheidung zwischen Objektstruktur und Objektbeschichtung statt. Der Nachteil daran ist, dass sich die Designeigenschaften für jedes Objekt wiederholen müssen, obwohl sie in diesem Fall identisch sind. Das kostet zum einen viel Zeit, zum anderen ist es fehleranfällig, da durch Flüchtigkeitsfehler schnell Abweichungen entstehen können. Deren Behebung ist wiederum mit viel Zeitaufwand verbunden. OOCSS dagegen vermeidet diese Wiederholungen und die damit verbundenen Probleme auf folgende Weise:

 

Hier ist eine Trennung von Objekt und Beschichtung vorhanden. Letztere wird lediglich einmal definiert und dann mit den Elementen verknüpft, für welche das entsprechende Design gewünscht ist. Dadurch gestaltet sich der Code deutlich kürzer und einfacher, sowie flexibler und vor allem wiederverwendbar. Mit OOCSS lässt sich also durch das Vermeiden von Wiederholungen deutlich schneller und fehlerfreier arbeiten.

Für mehr Informationen zu OOCSS empfehlen wir euch diesen Blogbeitrag (auf Englisch).

Wir hoffen, euch mit diesem Beitrag eine hilfreiche Übersicht gegeben zu haben. Über weiteres Feedback und Anregungen in den Kommentaren freuen wir uns sehr!

 

Unsere Projekterfolge

Unsere Projekterfolge

Heute wollen wir euch etwas mehr Einblick in unsere Projektarbeiten geben, die wir bereits erfolgreich abschließen konnten.

Da wir uns auf Software-Dienstleistungen jeglicher Art spezialisieren, konnten wir verschiedene Bereiche mit unseren Kunden abdecken und Ihnen das Lächeln ins Gesicht zaubern, das wir nach einem abgeschlossenen Projekt sehen wollen.

Im Bereich Programmierung durften wir für Fayo – Faszien Yoga, Freiskript und dem Ausstellungszentrum Braak behilflich sein und alles coden und digitalisieren, um die Webseiten zum Laufen zu bringen. Zudem haben wir die Prozesse der Webseitenbearbeitung des Unternehmens Ausstellungszentrum Braak maßgeblich optimiert. Hier konnten wir unserem Motto, jedem Unternehmen ihren Arbeitsalltag durch Digitalisierung zu erleichtern, voll und ganz nachkommen.

Eines unserer aktuellsten Projekte im Bereich App-Entwicklung umfasst die kürzlich gelaunchte Swapper-App für die Swapper GmbH.

Für unseren Kunden Gundlach Nutzfahrzeuge GmbH modernisierten wir seine Web-Präsenz und brachten diese somit auf den neuesten Stand. Weitere kreative Updates Richtung Konzept, Gestaltung und schlussendlicher Digitalisierung der Ideen folgen noch.

Zusammenfassend können wir somit erste Referenzen für Webdesign und -development, Programmierung, Software-Optimierung und App-Entwicklung verbuchen, die wir hier mit euch teilen. Parallel laufen eine Vielzahl von Projekten, über die wir noch Verschwiegenheit wahren müssen, doch wir freuen uns jetzt schon sehr auf die spannenden Ergebnisse, die wir liefern und mitgestalten!