Designtrends 2014

Wir haben die neusten Designtrends 2014 zusammen gefasst. Bereits im letzten Jahr tauchten einige Designtrends auf unseren Bildschirmen auf. Dazu zählen folgende Designtrends: Flatdesign, Horizontal Scrolling, Parallax Scrolling, Videos als Hintergrund, One Pager, Off Canvas, Webtypografie, Photographic Web, Mobile First und auch das Responsive Webdesign bleibt weiter ein wichtiger Bereich.

FLATDESIGN

Smartphone, vor allem iPhone Besitzer, sehen es täglich mehrere Male. Und auch die Nutzer von Windows 8 kommen nicht drum herum: Flatdesign.
Hierbei handelt es sich um Design ohne Schatten und Tiefe. Elemente werden nicht möglichst realitätsnah dargestellt, es wird auf „flache“ zumeist einfarbige Farbflächen gesetzt mit besonderem Augenmerk auf Proportionen, Typografie und Lesbarkeit.
Und auch beim Programmieren wird dank CSS3 das Umsetzen von Flatdesigns einfacher, denn durch viele Einstellungen, die zuvor nur mit Grafikeinbindung zu lösen waren, kann man nun direkt im Code einbauen.

HORIZONTAL SCROLLING

Wie der Name schon sagt ist ein weiterer Trend das horizontale Scrollen. Bisher ist der Standard das vertikale Scrollen, immer häufiger findet man die Option horizontal zu scrollen. Dazu sollte man aber einen besonderen Augenmerk auf seine Zielgruppe richten und sich die Frage stellen: Wie geht meine Zielgruppe online? Mit dem alt bekannten Desktop Computer oder doch eher mit dem Mobiltelefon oder Tablet PC? Denn was lange Zeit im Webdesign vermieden wurde, liegt nun voll im Trend. Rund 50% der Internetnutzer sind mit ihrem Smartphone oder dem Tablet online unterwegs. Besonders im Querformat ist das horizontale Scrollen nicht nur einfach und bequem für den mobilen Anwender, sondern auch – besonders für Nutzer des Tablet – sehr benutzerfreundlich und effizient.

PARALLAX SCROLLING

Parallax bedeutet soviel wie hin- und herbewegen. Im Zusammenhang mit Webdesign bezeichnet man das parallaxe Scrollen als visuelle Änderung der Position eines Objektes. Der Besucher der Webseite verändert somit seine Position durch das Scrollen oder Klicken auf der Webseite. Es macht die Seite lebendiger.

VIDEOS ALS HINTERGRUND

Es gibt kein Medium, das Emotionen so stark zum User transportiert wie das Video. Dank HTML5 wurde uns ein Weg geebnet, interaktive und spannende Webseiten ohne die Nutzung von Flash zu erstellen, wo der klassische Hintergrund einem Video weicht. Solch ein Videohintergrund ändert das komplette Erlebnis des Users auf einer Website. Es gibt dem Projekt eine neue emotionale Tiefe.

PHOTOGRAPHIC WEB

Ein ungebrochener Trend ist das Photographic Web. Besonders in der Mode- und Designbranche ist dieser Stil sehr beliebt. Darunter versteht man überproportionale, hochauflösende Bilder im Vollformat mit denen man die Besucher der Webseite auf eine emotionalisierende Weise ansprechen kann. Dies funktioniert besser als mit sehr viel Text.
Und genau an dieser Stelle liegt auch die Gefahr: Während der Internetnutzer heutzutage nicht mehr viel Lesen möchte, möchte Google dies jedoch sehr wohl. Daher sollte man darauf achten, dass bei der Nutzung von Photographic Web die Suchmaschinenoptimierung nicht zu kurz kommt.

ONE PAGER

Ein sehr beliebter Stil ist der One Pager oder auch bekannt als Single Page Design. Das bedeutet: Alle Inhalte einer Webseite befinden sich auf nur einer Seite. Durch das Klicken auf einen Menüpunkt „scrollt“ die Webseite automatisch zu dem Inhalt, wo das Thema beginnt oder der User scrollt sich selbstständig durch die Inhalte.
Ein guter Einsatzbereich der One Pager ist eine Webseite mit wenig Content, also als Web-Visitenkarte oder auch als Landing Page. Jedoch ist es wichtig darauf zu achten, dass auf die Navigation bei jedem Punkt zugreifbar ist, sonst wird das besondere Nutzererlebnis bei solch einer Website durch viel scrollen und lange Wege schnell zum Horrortrip.

OFF CANVAS

Sie denken: „Das sagt mir nichts?“ Wir wagen hiermit zu behaupten: „Doch, das kennen Sie bestimmt!“ Haben Sie ein Profil bei Facebook und nutzen auch die dazugehörige App auf Ihrem Smartphone? Dann sind Sie mit dem so genannten Off Canvas schon öfters in Berührung gekommen, als Sie annehmen.
Die Facebook-App nutzt diese Funktion schon seit langem. Hierbei handelt es sich um Inhalte, die sich außerhalb des sichtbaren Bereiches befinden und durch einen Klick auf ein Icon (sei es mit dem Mauszeiger oder dem Finger) erst sichtbar werden. Am häufigsten wird diese Funktion bei Apps genutzt, was Sinn macht, denn so können Inhalte ohne Probleme einwandfrei dargestellt werden. Aber auch bei herkömmlichen Seiten kann Off Canvas eine Bereicherung sein und lässt sich auch wunderbar in Kombination mit Responsive Webdesign einsetzen, indem die Inhalte abhängig von der Bildschirmgröße anders dargestellt werden können.

WEBTYPOGRAFIE

Standardschriften wie Arial, Tahoma oder Verdana waren gestern. Ein weiterer Trend der sich auch in diesem Jahr fortsetzen wird sind die Webfonts. Texte mit besonderer Auszeichnung brauchen in Zeiten von HTML5 und CSS3 nicht mehr in Grafiken umgewandelt werden, sondern bleiben reiner Text. Dies wirkt sich auch wiederum positiv auf die Suchmaschinenoptimierung aus, denn Google liest gern Text und kann Texte, die als Grafik auf die Webseite eingepflegt wurden, gar nichts anfangen.
So können Sie Ihre Webseite nun individuell auch mit Ihrer Hausschrift gestalten – vorausgesetzt Ihnen liegen die entsprechenden Lizenzen vor.

MOBILE FIRST

Wenn eine Agentur den Auftrag bekommt eine Webseite zu gestalten, ist es in der Regel so, dass nach der Konzeption und Abstimmung mit dem Kunden erste Entwürfe eines Layouts für den Desktop Browser entworfen werden und diese Webseite bei der Umsetzung dann „responsive“ gemacht wird, also auf kleinere Bildschirmgrößen angepasst wird. Bei Mobile First ist es genau anders herum.
Wie bereits zuvor im Bereich Hoizontal Scrolling erwähnt, gehen mittlerweile mehr als 50% der User mit einem Smartphone ins Internet. Bei Mobile First wird genau darauf das Augenmerk gelegt. Die Gestaltung beginnt mit der mobilen Version der Webseite, es ist quasi das Grundgerüst woraufhin die Versionen für größere Bildschirmauflösungen aufbaut. Je größer der Bildschirm wird, umso mehr Ressourcen können hinzugeladen werden.

RESPONSIVE WEBDESIGN

Womit wir nun auch direkt beim Thema Responsive Webdesign wären. Responsive Webdesign oder auch Responsive Design genannt ist eine Gestaltungsstruktur, die sich je nach Bildschirmgröße automatisch anpasst. So ist keine eigenständige Version für das Mobilgerät oder Tablet notwendig.
Bisher waren Webseiten meist tabellarisch aufgebaut und jede Spalte wurde eine fixe Größe zugeordnet. Sie war statisch und passte sich nicht den Bildschirmauflösungen an, da die Anzahl der unterschiedlichen Monitorgrößen überschaubar war. Mit Responsive Webdesign ist es heute möglich, die einst statische Webseite flexibel zu machen, so dass sie auch auf kleineren Bildschirmauflösungen gut nutzbar ist.
Somit ist das Responsive Webdesign eine kostengünstige Möglichkeit, die eigene Website auch mobil nutzbar zu machen.