Website Design Trends 2021

Angenehme und passende Farben

Die Menschen verbringen immer mehr Zeit am Computer, gerade auch in Zeiten der Pandemie. Da ist es keine allzu große Überraschung, dass den Nutzern / Schüler*innen bei langer Bildschirmzeit die Augen schmerzen. Dies erklärt auch ein wenig die Beliebtheit des Darkmodes.

2021 werden Webdesigner außerhalb der beiden Extreme hell und weiß denken, 2021 ist schon extrem genug, da kann man sich schon mal nach ruhigen und weniger störenden Farben sehnen. Mit weichen Farbpaletten, zum Beispiel warmes Braun, gesunde Grüntöne, pastellblauen Schattierungen oder helles Rosa kann man dies erreichen.

Hamburger Menü als einzige Navigation

Auch wenn dieser Trend schon seit geraumer Zeit existiert, erfreut er sich dieses Jahr großer Beliebtheit. Was spricht dafür und was dagegen?

Für ein (minimalistisches) Webdesign könnte man mit einem Hamburger Menü auch in der Desktop-Version die Ästhetik waren, es wirkt wesentlich aufgeräumter. Des Weiteren kennt vermutlich jeder diese drei Linien in der zumeist rechten oberen Ecke um ans Menü zu gelangen.

Ein weiterer wichtiger Punkt für das Hamburger Menü ist der direkte Zugriff auf weitere Unterpunkte ohne langes durchscrollen der Seite. Dagegen sprechen aber auch einige Dinge. Seiten werden durch diese Navigation weniger wichtig und der Nutzer könnte viele wichtige Sachen von der Webseite übersehen.

Retro Touch

Der Retro und der Vintage Trend hatten vor allem in der Modeszenen in den letzten Jahren einen regelrechten Hype erfahren. Dieser Trend macht 2021 nun auch beim Webdesign keinen halt mehr.

Online-Erlebnisse, die in den frühen 2000er Jahren überall zu finden waren, haben nun wieder eine tolerierbare Daseinsberechtigung. Skurrile und unvorhersehbare Layouts, Texturen, Muster und sogar Pixelkunst werden diesem Stil zugeordnet.

Interessanterweise sind solche Webseite heutzutage nicht einfach herzustellen, da sie unsere gewohnten Richtlinien und Regeln auf den Kopf stellen. Marken, die sich von anderen Marken abheben möchten, müssen sich auch in ihren digitalen Erlebnissen von anderen abheben. Es sollte daher auch nicht verwundern, ungewöhnliche Layout- und Interaktionsmodi, thematische Design und schließlich einen Hauch von neuem Retro-Touch zu sehen.

Handgezeichnete Elemente und Illustrationen

„Ein Bild sagt mehr als tausend Worte“ ist für die heutige Zeit immer noch relevant und gar nicht mehr wegzudenken. Grafiken übermitteln eine Botschaft schneller als Texte. Diese natürliche Eigenschaft von Fotos, Illustrationen und Skizzen macht sie für die visuelle Gestaltung und Kommunikation sehr nützlich. Das Hauptmotiv eines jeden Webdesigners ist es, die Webseite auf interessante und modische Weise zu präsentieren, um Besucher anzulocken und die Verweildauer auf der Webseite zu verlängern.

Mikrointeraktionen

Mikrointeraktionen lassen sich in jeder Anwendung wieder finden.
Die „Gefällt mir“-Funktion von Instagram, Facebook und Co und die „Retweet“-Funktion von Twitter sind perfekte Beispiele für Mikrointeraktionen. Oder aber auch das Vibrieren vom Smartphone, wenn es auf lautlos gestellt wird. Mikrointeraktionen sind die einfachsten Tasks, die ein Nutzer wahrnimmt, sobald er mit einer Anwendung agiert. Bestenfalls erhält der Benutzer positives Feedback und das Gefühl, ein Teil der Handlung zu sein.

Neomorphismus

Der allgemeine Trend in diesem Jahr ist eine realistisch aussehende Grafik. Neomorphismus (manchmal auch als Neumorphismus bezeichnet) ist die Wiederbelebung von lebensechten Designelementen, die aus der Mode kamen, als flaches Design den Skeuomorphismus ersetzte und selbst um 2015 durch Materialdesign ersetzt wurde. Neomorphe Berührungselemente bestehen aus demselben „Material“ wie der Hintergrund, vor dem sie verwendet werden. Sie scheinen aus dem Hintergrund gedrängt worden zu sein, was ihnen Volumen verleiht. Die Kreativszene hat diese minimalistischen Designs aus zwei Hauptgründen lange abgelehnt: bei falscher Erstellung sieht das Design schnell unprofessionell aus die weichen Schatten und der geringe Kontrast kann beim Besucher zu Problemen führen und einige Menschen außen vor lassen. Stichwort Barrierefreiheit.

Barrierefreiheit im Web

Die Barrierefreiheit wird im Bereich Web immer wichtiger und spielt 2021 eine wichtige Rolle. Die Barrierefreiheit ist mehr als nur ein Trend, es ist viel mehr eine Leitlinie um so viele Menschen wie möglich abzuholen.

Weltweit leben 2 Milliarden Menschen mit Behinderungen, was 37,5 % der Weltbevölkerung entspricht. Um diese Zielgruppe nicht auszuschließen, muss man einige Dinge auf seiner Webseite beachten.
Barrierefreiheit im Web bedeutet also, dass Websites, Tools und Technologien so gestaltet und entwickelt werden, dass alle Menschen sie navigieren, verstehen und nutzen können, einschließlich Menschen mit Behinderungen.

Was ist bei der Barrierefreiheit zu beachten?

• Texte und Hintergrund müssen einen geeigneten Farbkontrast aufweisen

• Fokusindikatoren müssen vorhanden sein

• Funktionale Alt-Tags für Bilder

• Verwendung von Beschriftungen und Anweisungen im Formularfeldern

Wie kann ich meine Barrierefreiheit testen?
Mit dem Entwicklerwerkzeug von Mozilla Firefox kann man seine Website auf die Barrierefreiheit testen. Dieser hat eine eigene Barrierefreiheit-Kategorie.

Hover Gallery Menu

Zu guter Letzt, das Hover Gallery Menü. Es sieht aus wie ein normales Standardmenü, aber sobald man den Mauszeiger darüber hält, werden Bilder angezeigt, die einen kleinen Einblick in den Inhalt geben, den wir im nächsten Schritt sehen würden. Dies ist zum einen ein ziemlicher Blickfang für den Besucher und zum anderen kann dies dem Besucher den Inhalt hinter dem Text besser zu verdeutlichen.