Menü

Webdesign Trends für 2018

Wohin geht die Reise?

Webdesign unterliegt, wie jeder anderer Bereich in dem gestaltet wird, Trends und neuen Einflüssen. Trends entwickeln sich zu Standards, bestehende Standards werden durch neue Trends erweitert oder verschwinden.

Eine Webseite ist ein lebender Organismus, er wächst, entwickelt sich und sammelt Erfahrungen. Wer wichtige Trends verpasst, läuft Gefahr als altmodisch und angestaubt zu gelten, insbesondere wenn man im Wettbewerb steht.

Also, wer mit seiner Webseite aktuell und frisch erscheinen möchte, sollte die wichtigen Trends nicht verpassen und umsetzten.

Übersicht Design-Trends 2018

Flat Design am Ende?

Der Große Trend für 2018, der sich bereits im vergangenen Jahr abzeichnete, ist die Aufweichung des strikten Flat Design. Hauptbestandteile des Flat Designs sind ein Verzicht von Verzierungen, Texturen, Schatten, 3D-Elementen zugunsten einer reduzierten und besonders klaren Erscheinung.

Die scharf definierten Umrisse des Flat Design brechen auf und lassen organischen Formen wieder mehr Raum. Es ist eine Rückkehr zu mehr Realismus im Webdesign in 2018 zu erwarten. Ein Mix aus realen Objekten und artifiziellen Designelementen wird die Designlandschaft deutlich bereichern.

Schatten

Der Einsatz von Schatten im Webdesign ist seit Vorstellung des Flat Design vor ein paar Jahren sehr stark zurückgegangen, speziell seitdem Google die Designsprache Material Design für seine Anwendungen eingeführte. Dieser Trend weicht immer mehr auf. Webdesigner setzten Schatten seit kurzem wieder häufiger und präsenter ein.

Hochgesättigte Farbpaletten

Grelle, schrille Farben sind nach wie vor Trend und hervorragende Eyecatcher. Etablierte Farbharmonien werden bewusst und krass gebrochen. Die Anzeigegeräte der Nutzer sind technisch immer mehr in der Lage, erweiterte Farbräume darzustellen, sodass hochgesättigte Farben auch beim Anwender ankommen.

Farbverläufe

Die Bevorzugung des Flat Designs im Webdesign in der Vergangenheit sorgte für meist einfarbige Farbflächen. Verläufe wurden vermieden um ein möglichst klares und minimales Design zu erhalten.

Farbverläufe finden nun wieder mehr Verwendung und brechen die Monotonie der sterilen Flächen des Flat Designs langsam auf.

(Quelle: www.voellerei.at)

Farbverläufe sind wieder aktuell

Große Typografie

Die Zeiten von kleinen Schriftgrößen sind lange vorbei. Leicht lesbare, größere Schriftgrößen werden verwendet. Die durchschnittliche Schriftgröße ist um bis zu +3 Punktgrößen innerhalb der letzten Jahre gestiegen, geschuldet der Tatsache, dass Displays immer größer geworden sind und die Usability (Nutzerfreundlichkeit) unter einer zu kleinen Schrift deutlich leidet.

Große Schriftarten bleiben auch 2018 voll im Trend.

Nach wie vor stellt eine prägnante Typografie (Schriftgestaltung, Schriftart und Schriftsatz) ein wesentliches Gestaltungselement bei Webseiten dar. Im Zusammenhang mit flächigen Hintergründen oder Hero-Images wird die Kernaussage/Hauptbotschaft gern auf Startseiten platziert.

Große Schriften sind immer noch aktuell

Organische Formen

Entsprechend dem Gegentrend zum "geraden" Flat Design finden runde Elemente, Kurven und amorphe Formen immer mehr Verwendung. Statt einheitlich, rechtwinklige Ecken Kanten und Linien werden gerundete Ecken und Buttons eingesetzt.

Abstrakte, weiche Formen werden mit scharfen Kanten und Linien kombiniert. Gradzahlen jenseits der 90° werden in 2018 häufiger verwendet werden.

Organische Formen im Webdesign

Non Grid / Asymmetrische Layouts

Ein (unsichtbares) Grid/Gitter ist ein hervorragendes Tool zum Ausrichten der Inhalte. Webdesigner haben sich lang nach dieser Möglichkeit, zum geordneten Ausrichten von Inhaltselementen gesehnt.

Das Aufkommen dieser Technik (vor einigen Jahren), bringt jedoch den Nachteil der Gleichförmigkeit mit sich. Nahezu jeder Designer verwendet ein Grid zum Layouten. Die optische Austauschbarkeit der Webseiten drängt sich auf.

In der Vergangenheit wurde sehr auf 100% Symmetrie gelegt. Dabei bietet der asymmetrische Aufbau des Layouts viel spannendere Möglichkeiten zur Aufmerksamkeitslenkung.

Texte, Bilder und Hintergründe gegen das Diktat der Gleichförmigkeit zu positionieren wird die Webseitenlandschaft in 2018 sehr bereichern.

(Quelle: www.market-me.fr/Livo/)

Split Screens

Split Screens teilen das Layout vertikal in zwei Bereiche. Die Wertigkeit und Relevanz beider Bereiche ist dabei gleich bedeuten, eine Gewichtung findet sich statt.

Beispielanwendungen:

  • Der Nutzer kann beispielsweise zwischen zwei Produktbereichen/Optionen wählen.
  • Neben einen Produktbild stehen Produkteigenschaften.
  • Eine Seite zeigt ein Foto des Ladengeschäfts, die andere Seite die Kontaktinformationen zum Unternehmen.

Split Screen sind keine neue Erfindung, werden jedoch in 2018 weiter entwickelt und größere Verbreitung finden.

(Quelle: theoceanfortlauderdale.com/)

Eigenes Bildmaterial

Wer kennt sie nicht, die nette lächelnde Dame mit Telefon/Headset auf der Kontaktseite?

Dieses Motiv wurde (und wird noch) sehr inflationär eingesetzt. Es gibt unzählige Bilddatenbanken, die Webdesigner Stockfotos (fertiges Bildmaterial) schnell und günstig liefern.

Be unique!

Setzten Sie sich vom Wettbewerb ab, verwenden Sie eigenes Bildmaterial. Oder, falls es nicht anders geht, nutzen Sie außergewöhnliche Stockfotos.

Eigenes Bildmaterial

Illustrationen

Fotos bilden einen direkten Bezug zum Produkt, Marke und Unternehmen. Sie vermitteln eine gewisse Realität und Authentizität. Illustrationen gehen einen Schritt weiter und erlauben einen kreativeren Zugang. Sie sprechen die Vorstellungskraft und Abstraktion des Betrachters an. Sie hinterlassen durch die Auseinandersetzung des Betrachters mit dem Motiv einen bleibenden Eindruck.

Illustrationen erweitern den Trend, eigenes Bildmaterial zu nutzen. Sie beinhalten einen noch persönlicheren Charakter als Fotografien. Sicherlich steckt in Illustrationen viel Arbeit, die man jedoch auch wahrnimmt.

Die Kombination von Fotografie und ergänzender Illustration kann eine gewöhnliche, durchschnittliche Webseite in eine außergewöhnliche, einzigartige Seite verwandeln.

Kleine Animationen / Cinemagraphs / Gifs

Cinemagraphs sind ein Crossover zwischen Foto und Video. Gegenüber einem Video werden nur kleine Details eines statischen Inhalts bewegt.

Video bietet im Vergleich zum Foto Vorteile, nur nicht immer hat der Nutzer die Geduld das Video in voller Länge zu betrachten. Die Kernaussage des Videos erreicht in diesen Fällen nicht den Betrachter.

Cinemagraphs entfalten die Wirkung eines kraftvoller Verstärker für (Key-)Visuals und transportieren Emotionen besonders gut durch die Reduktion auf minimale Elemente.

Brutalist Design

Brutalist Webdesign ist ein aufkeimender Design Gegentrend, der versucht auf allen Ebenen mit gängigen Konventionen zu brechen.

Brutalist Webdesign ist quasi die Punkbewegung im Webdesign. Die Webseiten sind radikal, Avantgarde und provozieren. Es werden so ziemlich alle vorherrschenden Lehrmeinungen über Komposition, Harmonie, Proportionen gebrochen und diese Brüche sind ermöglichen eine vollkommen neue Erfassung und Wahrnehmung des Webdesigns.

Sicherlich ist es schwer, dieses Konzept für die Webseite eines z.B. Anwaltsbüros oder lokalen Bäckers umzusetzen aber warum nicht? Einfach mal mit Erwartungen und Konventionen brechen?

(Quelle: peer-to-peer-web.com/berlin)

Mobile First

Mobile First, alter Hut! Klar aber dennoch wird bei der Gestaltung von Webseiten immer noch gern vernachlässigt, dass es bei einer mobilen Version zu einem auf eine sinnvolle und vor allem intuitive Bedienbarkeit ankommt und dass der Inhalt passend formatiert ist.

Die Suchanfragen von mobilen Geräten bei Google haben Anfragen von stationäre Desktops bereits in 2015 überholt (mehr Infos dazu hier)

Für das Webdesign ergeben sich nun Fragen wie:

  • Wie gestalte ich ein intuitives Menü?
  • Wie bereite ich den Inhalt auf, dass er einfach zu erfassen ist?
  • Auf welche Gestaltungselemente sollte ich in der mobilen Version der Webseite verzichten? Was muss ich anders darstellen?
Mobile First wird immer noch unterschätzt

Angebot für neues Webdesign oder Webseite?

kostenlos anfragen
×