Neun Webdesign-Trends, die Agenturen 2014 neue Aufträge bescheren

Es gibt immer einen Grund, die Marken-Website mal wieder zu entstauben. Denn während man sich bei Transaktions-orientierten Internetseiten wie Onlineshops inzwischen von Relaunch-Gedanken verabschiedet hat (siehe iBusiness: Relaunch-Lüge), ist es bei Markenseiten Pflicht, ihnen regelmäßig einen Neuanstrich zu geben. Neun Webdesign-Trends zeigen, welches die persönlichen Gestaltungs-Favoriten von Designexperten sind und 2014 das Netz bestimmen werden.

Unter den Webdesign-Trends für 2014, die Interaktivagenturen, Webprogrammierer und Designer ab sofort ins Portfolio integrieren sollten, kristallisieren sich zwei übergeordnete Tendenzen heraus:

1. Technik und Design verschmelzen:
   Um den Besucher noch stärker emotional in den Bann zu ziehen, werden Webseiten noch interaktiver, noch bewegter. Inhalt und technische wie visuelle Gestaltung verschmelzen mehr und mehr zu einem Ganzen, weshalb es für Webdesigner immer wichtiger wird, dass sie Programmierung und Gestaltung beherrschen. "Die Interessen des Nutzers und sein Erlebnis beim Konsumieren von Inhalten werden im kommenden Jahr den nächsten evolutionären Schritt machen", fasst Christoph Köhler , User Experience Designer von D&B Interactive   aus Frankfurt, die Trends zusammen. "Das bedingt Design, Technik, aber auch Business-Ziele."
   
   
2. Responsive bestimmt das Webdesign:
   Gleichzeitig steht die Webgestaltung 2014 im Zeichen des Responsive Designs. Zum einen wird es endlich so weit sein, dass sich Responsive Design auch praktisch in der breiten Masse durchsetzt. Gleichzeitig vereinfachen viele der gestalterischen Trends die sich 2014 durchsetzen werden, die Optimierung der Internetseite für verschiedene Endgeräte. Das spart nicht nur Zeit, sondern vor allem auch Geld - und ist außerdem ein weiteres Argument, das den Kunden vom Relaunch überzeugen dürfte.

Die folgenden neun Trends zeigen, wie das Webdesign von 2014 aussehen wird:

Trend 1: Storytelling

Storytelling ist das Marketing-Schlagwort schlechthin. 2014 wird sich das Geschichtenerzählen auch gestalterisch und technisch in immer mehr Webseiten wiederfinden. Ziel ist es, sich von der Masse abzuheben, den Nutzer durch Botschaft, Klickerlebnis und Interaktion emotional in den Bann zu ziehen und zu begeistern. "Und dies bedeutet, dass eine Geschichte angeboten werden muss, die intelligent über unterschiedliche Plattformen, Kanäle und Devices erzählt werden kann", rät Hansjörg Fuhrken, Executive Creative Director der Agentur Wunderman  .

Von der gestalterischen Seite her bedeutet das, dass Bewegtbilder und Animationen dezent in die Website integriert sind, die dem Besucher schnell einen Eindruck von der zu erzählenden Geschichte vermitteln. Dabei kann zum Beispiel das Scrollen den Verlauf der Geschichte erzählen, indem sich nicht nur die Seite verschiebt, sondern sich neue Fenster öffnen, Videos starten oder Ähnliches. Dieses Scrollerlebnis nennt sich auf Parallax-Design. Außerdem sind soziale Elemente Teil des Storytelling-Konzepts.

Die Verbindung aus Videos, interaktiven Grafiken, Audio und Animationen und herkömmlichen HTML-Texten schaffen Webdesigner mittels CSS-Animationen, HTML5, Canvas und SVG, erläutert der selbstständige Webdesigner und Autor des Buchs Der erfolgreiche Webdesigner  , Nils Pooker  . "Der Erfolg dieses Trends wird jedoch davon abhängen, wie solche interaktiven Sites performanceoptimiert für mobile Endgeräte mit begrenzten Bandbreiten aufbereitet werden", gibt er zu bedenken.

Bild: Screenshot Greenpeace	Bild: Screenshot New York Times	Bild: Screenshot Dangers of Fracking
Greenpeace	New York Times	Dangers of Fracking

Trend 2: One-Page-Design

Noch vor Kurzem war das Scrollen auf Websites verpönt, weil der Nutzer angeblich lieber weiterklicke als scrolle. Jetzt geht der Trend in die entgegengesetzte Richtung: "2014 wird sich One-Page-Design verstärkt durchsetzen, wobei alle Inhalte in einer logischen Reihenfolge untereinander auf einer einzigen Seite angeordnet sind", ist sich Daniela Köppl, Head of Product Development von Blue Summit Media  , sicher. Damit geht Infinite Scrolling einher, wie man es von Facebook   oder Flickr   kennt: Beim Herunterscrollen laden sich automatisch immer mehr Inhalte nach. One-Page-Design eignet sich besonders für Marken-Webseiten, die mehr auf Image und weniger auf detaillierte Produktbeschreibungen setzen.

Ein großer Vorteil des One-Page-Designs ist, dass es sich gut für Responsive Design eignet. Denn die Inhalte sehen nach entsprechender Optimierung auf allen Endgeräten gleich aus.

Bild: Screenshot Social App	Bild: Screenshot Hello James Hsu	Bild: Screeshot Tailormade
Social App	Hello James Hsu	Tailormade

Trend 3: Flatdesign

Flatdesign ist ein weiterer Webdesign-Trend, der sich gut in Responsive Design umsetzen lässt. Flatdesign wird durch einfache Formen und Kontraste sowie durch Übersichtlichkeit und ein aufgeräumtes Design geprägt. Beim Flatdesign gehen die Gestalter davon aus, dass zu viel Information die Nutzer verwirrt, und dass die Umsetzung von komplexen Designs in ein Responsive Design zu aufwändig und teuer ist. "Deshalb reduziert man 'unwichtige' Bildinformation wie Verläufe in Schatten, 3D-Effekte, schwere Texturen, Überschneidungen von Gestaltungselementen und sonstigen Schnick-Schnack", erläutert Tobias Ackermann, Geschäftsführer von Workinteractive  . "Das Auge soll Halt finden in einfachen Strukturen und auf den verschiedenen Medien-Plattformen einheitlich aussehen."

Nils Pooker stimmt zu: "Der aktuelle Trend von Flatdesign wird dabei gerade bei der schlanken und performanceabhängigen Darstellung auf mobilen Geräten eine zunehmend wichtige Rolle spielen, während in der Desktop-Variante Web-Typografie, grafikintensives Design und bekannte CSS3-Spielereien im Vordergrund stehen können."

Bild: Screenshot Iconwerk	Bild: Screenshot Microsoft	Bild: Screenshot Der Prinz
Iconwerk	Microsoft	Der Prinz

Trend 4: Minimalismus

Immer mehr Webdesigner setzen auf minimalistische Designs, die noch einen Schritt weiter gehen und noch reduzierter sind als das Flatdesign. Die nackten Inhalte stehen hierbei im Vordergrund und nichts lenkt von ihnen ab. "Nach Jahren des Schwelgens in Glossy, Gradients und Kernschatten- und Spiegelungssimulationen setzt sich der Gedanke des europäischen Designs durch", freut sich Hansjörg Fuhrken. "Gezielter Einsatz von Gestaltungsmitteln, ein flächiger Einsatz von Farben und schlichte, aber intelligente Navigationskonzepte werden die kommenden Jahre noch deutlich stärker bestimmen."

Es wundert nicht, dass auch dieser Trend mit Responsive Design einhergeht. Denn die einfach aufgebauten Webseiten lassen sich einfach für mobil anpassen und öffnen sich zudem auf mobilen Endgeräten schneller, weil kaum Bilder, Animationen und Videos geladen werden müssen.

Bild: Screenshot Pollen	Bild: Screenshot Roberta di Camerino	Bild: Screenshot Esther Perbandt
Pollen	Roberta di Camerino	Esther Perbandt

Trend 5: Suche als Navigation

Die Suchfunktion einer Website wird in Zukunft immer häufiger aus der oberen Ecke von Webseiten hervor kommen und einen prominenten Platz auf der Seite einnehmen. "Suchfunktionen haben durch heutige technische Möglichkeiten wie Facettensuche und Promting das Potenzial, ihr Schattendasein in der Meta-Navigation zu verlassen", berichtet Daniel Rothaug. Er ist Professor für Interfacegestaltung für Netzmedien an der Fakultät Gestaltung der Hochschule Augsburg   sowie Kreativdirektor und Mitgründer des Designbüros Zum Kuckuck  . Damit halten Suchfunktionen, die auf der Google-Such-Technologie basieren, Einzug in die Webseiten und Onlineshops - und können die Navigation ergänzen und vielleicht sogar ersetzen.

Bild: Screenshot Audi USA

Audi USA

Trend 6: Interaktive Bildkonzepte

Während der Trend auf der einen Seite zu "Weniger ist mehr" hingeht, werden auf der anderen Seite Animationen, interaktive Videos und Bilder immer mehr. Daniel Swoboda, Art Director Interactive von D&B Interactive, erläutert einen der Gründe: "Videos werden vermehrt durch Interaktion erfahr- und bedienbar werden, um einen größeren Informationsgehalt zu transportieren."

Hansjörg Fuhrken geht noch einen Schritt weiter: "Die Informationen müssen sich an den Kunden anpassen. So sind gute Infografiken nicht nur farbenfroh, sondern bieten die Option an, die Dinge anzeigen zu lassen, die mich interessieren." Schließlich würden einen CSU-Wähler im Voralpenland bei der Bundestagswahl vermutlich andere Dinge interessieren als einen Grünen-Wähler in Bremen. "Webseiten entwickeln sich von reinen Informations-Bereithaltungsangeboten hin zu personalisierten, anpassbaren Informationen, Angeboten und Tools."

Dabei ist auch hier der Aspekt Responsive wichtig: "Durch die technischen Vorgaben der unterschiedlichen Endgeräte müssen Webdesigner die Bild- und Videoboxen maximal nutzen und Bildkonzepte nicht statisch sondern flexibel konzipieren und dann für unterschiedliche Medien zu produzieren."

Bild: Screenshot Apple	Bild: Screenshots Spiegel	Bild: Screenshot Life of Pi
Apple	Spiegel	Life of Pi

Trend 7: Emotionalisierung durch Hintergrundbilder und -videos

Immer mehr Webseiten nutzen große Bilder oder Videos als flächenfüllende Hintergrundbilder - und 2014 werden auch kleinere Webseitenbetreiber nachziehen und sich ein solches Design wünschen. Mit den überproportionalen Bildern, die statt Text und Informationen im Fokus stehen, wollen sie den Besucher auf eine viel emotionalisierendere Weise ansprechen. Ein weiterer Vorteil neben der Emotionalisierung ist, dass die Website durch die flächigen Hintergründe eine unverwechselbare Gestaltung erhält.

Der Nachteil der großen Hintergrundbilder und -videos ist jedoch, dass sich die Ladezeiten der Seite verlängern - besonders bei Videos. Dies verschlechtert vor allem die Usability bei der mobilen Nutzung und eignet sich deshalb nicht ohne weiteres für alle Internetseiten. Es sei denn die Webseite wird mit Fokus auf die Bilder und Videos und gleichzeitig auf die Usability an die mobile Nutzung angepasst.

Bild: Screenshot Adidas	Bild: Screenshot Valentino	Bild: Screenshot LG
Adidas	Valentino	LG

Trend 8: Responsive Erscheinungsbilder

2014 wird Responsive Design perfektioniert. Das bedeutet unter anderem, dass alle die oben genannten Trends fit für Responsive gemacht werden. Zum Beispiel die bildschirmfüllenden Hintergrundgrafiken oder Slideshows in die Desktop-Versionen von Websites: "Hier ist mit weiteren Bibliotheken, Codeschnipseln oder komplexeren Online-Tools zur Integration in den Code zu rechnen", sagt Nils Pooker.

Aber gleichzeitig werden die Desktopseiten selbst flexibler: Zum Beispiel nutzen sie immer häufiger den gesamten Platz aus, den ein Bildschirm bietet. Gleichzeitig schrumpfen sie zusammen, wenn sich der Bildschirm oder das Fenster verkleinert. Trotzdem sollen bei jedem Design alle wichtigen Informationen so wie auch das unverwechselbare Webseiten-Design erhalten bleiben. "Dies erfordert ein hochmodulares Design, das möglichst viele Bildschirme mit den unterschiedlichsten Informationen bespielen kann", bestätigt Hansjörg Fuhrken.

Bild: Screenshot Whitney Museum	Bild: Screenshot Whitney Museum
Whitney Museum

Trend 9: Demokratisierung des Webdesigns

Der Designanspruch an Webseiten steigt weiter an. Ein Grund dafür ist, dass Webdesign-Templates, die von Kunden mit ihren Bildern und Texten gefüllt werden können, immer professioneller werden. Dies ermöglicht es auch kleinen und mittleren Unternehmen, mit einem überschaubaren Investment attraktive und moderne Webseiten zu erstellen und sogar modernste Effekte zu integrieren.

"Als Designer begrüße ich diese Möglichkeit und das deutlich angestiegene Ästhetik-Niveau im Web", sagt Hansjörg Fuhrken. "Zugleich steigt dadurch der Anspruch an Webdesigner und Digitalagenturen. Das kann nur im Sinne der Kunden sein." Interaktivagenturen werden sich also in Zukunft professioneller aufstellen müssen. Webdesign-Lösungen Out-of-the-Box können sie niemandem mehr verkaufen; individuelle Webdesigns sind gefragt.