Im Webdesign geht es darum, in die Zukunft zu blicken. Durch ihr enges Verhältnis zur Technik bietet die digitale Welt jedes Jahr aufs Neue einen Ausblick auf Innovationen in den Bereichen Animation, Interaktion und Immersion. Das Jahr 2022 verspricht vieles, auf das wir uns freuen können, wie wir in den folgenden Webdesign-Trends entdecken werden.

Die 80er und 90er Jahre kommen zurück, Typografie spielt eine führende Rolle und Live-Animationen steigen zu neuen Höhen auf. Der visuelle Stil hingegen reicht von beeindruckendem Hightech bis hin zu skurrilem Kunsthandwerk.

Alles in allem wird das Jahr 2022 als vielfältiger und experimenteller Eintrag in die digitalen Annalen eingehen. Doch bevor wir uns ins neue Jahr stürzen, lass uns einen Ausblick auf die 9 innovativen Webdesign-Trends werfen, die uns 2022 erwarten.

Die 9 besten Webdesign-Trends für 2022

  1. Memphis Design
  2. Typografische Hero Images
  3. Retro-Revolution
  4. Sichtbare Rahmen
  5. Ansprechende Interaktionen
  6. Neo-Brutalismus
  7. Bewegliche Schrift
  8. Kreative Scroll-Erlebnisse
  9. Handgefertigte Grafiken

1. Memphis Design

Memphis Design – eine prägende Ästhetik der 1980er Jahre – wird nicht selten als kitschiger Stil angesehen, der eine Vielzahl chaotischer Muster und Formen miteinander kombiniert. Zu seiner Zeit war Memphis Design eine Ablehnung des Minimalismus und vermeintlich guten Geschmacks der Kunstkritiker und -kritikerinnen. Es machte Design gleichzeitig bunter, aufgeschlossener und abenteuerlicher als jemals zuvor.

Webseitendesign für Blockchain mit abstrakten Memphis-Designmustern
Von MASER

Diese Haltung trifft besonders in der heutigen Zeit zu, in der minimalistische Designansätze zu Benutzeroberflächen geführt haben, die (obgleich sie intuitiv sind) überwiegend gleich aussehen. Es ist daher kein Wunder, dass viele Webdesigner und -designerinnen sich dem Memphis Design zuwenden, um eine Explosion farbenfroher Persönlichkeit zu erzeugen, die niemand so schnell vergessen wird.

Webseitendesign für Fitnessmarke mit abstrakten Memphis-Designmustern
Von e2infinity

2. Typografisches Hero Image

Als erster Teil einer Website, den Besucher und Besucherinnen zu sehen bekommen, muss das Hero Image ein Statement setzen. Die Webdesigner und -designerinnen des Jahres 2022 nehmen sich diese Idee mit typografischen Hero Images zu Herzen.

Typografie-fokussiertes hero image für Webdesign
Von jonasgo
Typografie-fokussiertes hero image für Webdesign
Von Bluesjay

In diesen Hero Sections finden sich nur wenige oder gleich gar keine Bilder, damit die Botschaft selbst einen starken ersten Eindruck hinterlassen kann. Sie wirken nicht nackt, sondern fallen durch ihre Einfachheit auf. Sie fordern auf die gleiche Weise Aufmerksamkeit wie eine fesselnde Schlagzeile. Und darüber hinaus bieten sie einen hervorragenden Schauplatz für geschmackvolle, kreative Schriftstile.

Im Webdesign im Allgemeinen bin ich immer von guter Typografie inspiriert, die in ein Designelement integriert ist oder als eigenständiges Element fungiert.
- Vl@daS, Designer bei 99designs von Vista
Typografie-fokussiertes hero image für Webdesign
Von malzi.
Typografie lässt sich sehr gut mit verspielten Elementen und frischen Farben kombinieren. So sieht der Weg in die Zukunft aus!
- adamk, Designer bei 99designs von Vista

3. Retro-Revolution

Während die Anfangszeit des World Wide Webs immer mehr zu einer fernen Erinnerung wird, lassen sich aufstrebende Webdesigner und -designerinnen von heute von diesen frühen Wild-West-Zeiten inspirieren. Das sogenannte Web 1.0 der 90er zeichnete sich durch leuchtende Hintergrundfarben, sichtbare Tabellen-Layouts und roboterhafte Schriften wie Courier aus.

Obwohl all dies häufig zu tragischen und oftmals wahnsinnig witzigen Ergebnissen führte, beleben die Webdesigner und -designerinnen des Jahres 2022 diesen Trend neu und profitieren dabei von fast 30 Jahren kollektiver Designerfahrung.

Während das Internet der 90er zwar voller unnötiger Spielereien, Grafiken und Farben war,  war es auch eine Zeit, in der die Regeln noch nicht festgeschrieben waren – als „Webdesign“ noch nicht mal ein Beruf war. Die Designer und Designerinnen von heute – die durch Branchenstandards im Zaum gehalten werden – betrachten diese Anfangszeit als Brutstätte für uneingeschränkte Kreativität (im Guten wie im Schlechten).

Von Kristen Ryan via Dribbble

90er Jahre Retro-Webdesign für E-Commerce
Via starface.world
90s retro web design for creative portfolio
Von Ruxandra Nastase via Dribbble
90s retro web design for educational site
Von Max Osichka via Dribbble
Die 2020er Jahre wurden einmal als Zukunft von Design und Technik betrachtet. Nun kehren wir dem polierten Minimalismus des Jetzt den Rücken und schauen in die Vergangenheit, um Inspiration zu finden.
- Justin Hamra, Art Director bei 99designs von Vista

4. Sichtbare Rahmen

Webdesign kreiert gern ein Gefühl von Magie – oder zumindest die Illusion, dass der Content durch eine unsichtbare Hand sauber arrangiert wurde und frei im digitalen Raum schwebt. Die Realität ist dagegen, dass Webseiten auf einem präzisen Raster erstellt und mithilfe von Code zusammengehalten werden. 2022 setzen Webdesigner und -designerinnen auf realistischere Layouts, die mithilfe simpler Umrandungen und Rahmen ihr Fundament offen zur Schau stellen.

Landing page design for online music education
Von Ashik via Dribbble
Product page design for watch company
Von Soumitro Sobuj via Dribbble
Homepage design for creative blog
Von Gavrisov Dmitri via Dribbble

Ein sichtbares Raster hat den offensichtlichen Vorteil, einzelne Bereiche voneinander zu trennen. Dadurch wird die Seite überschaubarer und es lässt sich mehr Content unterbringen, ohne dass die Seite sich überladen anfühlt. Diese einfachen Rahmen verleihen Webseiten auch einen dezenten Retro-Touch, der gut zu den 90er-Trends passt, die gerade ihr Comeback erleben.

Website-Design für Produktseiten für nachhaltige Kleidung
Von Anastasia Fesiuk via Behance
Homepage web design for movie review site
Von JJay Jay via Behance
Landing page design for finance company
Von Arvin Aradhana via Dribbble
Als Kreuzung aus Mondrians Kunststil und dem modernen Web ermöglichen es Raster und Rahmen Designschaffenden, den Fokus zu verschieben und so wirklich hervorzuheben, was sie sagen wollen.
- Justin Hamra, Art Director at 99designs von Vista
Landingpage-Design für Zimmerpflanzenservice
Von Ashik via Dribbble

5. Ansprechende Interaktionen

Im Laufe der Jahre haben wir immer aufwendigere Animationen auf Webseiten gesehen. Während diese in der Vergangenheit größtenteils in den Hero Sections und bei Seitenübergängen eine Rolle gespielt haben, gehen wir davon aus, dass sich 2022 immer mehr Designer und Designerinnen umfangreichen, animierten Interaktionen zuwenden werden.

via Spotify

via weareimpero.com

Diese Interaktionen gehen über bloßes Scrollen – welches relativ passiv sein kann – hinaus, um eine bedeutsamere Interaktion mit der Seite zu fördern, z. B. durch Klicken, Wischen und Ziehen.

Der Schlüssel zu diesem Trend besteht darin, etwas leicht Mysteriöses zu präsentieren – wie beispielsweise der winzige schwarze Würfel, der deinem Cursor auf der Seite von LEQB folgt, oder die auffällig fehlende Navigation auf der Seite von Chiara Luzzana – und den Besucher aufzufordern, eine bestimmte Form der Interaktion zu nutzen, um zu erfahren, wie die Seite funktioniert. Dies sorgt für neuartige Erlebnisse, durch die sich die Besucher der Seite mehr wie Ermittler fühlen, die aktiv mit der Seite herumspielen, um ihre Geheimnisse zu enthüllen.

via le-qb.com

via chiaraluzzana.com

Simples und doch effektives Designs mit modernen Hover-Effekten.
- Vl@daS, Designer bei 99designs von Vista

via kim-jooyoung.com

via monopo.london

6. Neo-Brutalismus

Neo-Brutalismus entstammt den klassischen Wurzeln des Brutalismus, einer Architekturbewegung der 50er-70er Jahre, bei der rohe, sichtbare Materialien wie Beton betont wurden. Brutalismus gewinnt seit seiner digitalen Wiederauferstehung 2014 im Webdesign immer mehr an Beliebtheit, wie die Seite brutalistwebsites.com belegt. Kahles, ungestyltes HTML, schlichte Hintergründe, asymmetrische Layouts, Standard-Computerschriften und unbearbeitete Bilder zeichnen den digitalen Brutalismus aus.

Brutalistisches Webseitendesign für Kerzenladen
Von Maia I

Von Luka Marr via Dribbble

Der brutalistische Stil soll schonungslos sein und hat oftmals eine fesselnde Wirkung. Der Schlüssel dazu liegt in einer selbstbewussten Ehrlichkeit, die durch seine eigene Kahlheit gefördert wird. Wir gehen davon aus, dass dieser Stil 2022 dezenter und weniger extrem werden – also im Grunde zum Neo-Brutalismus – wird. Dies vereint die Rohheit des Brutalismus mit der Zurückhaltung des Minimalismus, wodurch Webseiten entstehen, die sich für eine weniger avantgardistische Kundschaft eignen und die Fallstricke vermeiden, die letztendlich zum Niedergang des architektonischen Brutalismus geführt haben.

Brutalistisches Webseitendesign für Künstleratelier
Von Pier-Luc Cossette via Dribbble

Von Tee Tran via Dribbble

Beim Brutalismus ging es schon immer um Minimalismus und unbearbeitete Materialien. Neo-Brutalismus nimmt die Kernwerte des Brutalismus, verfeinert diese und haucht ihnen neues Leben ein. Stark, gewagt und auffällig.
- Justin Hamra, Art Director bei 99designs von Vista
Brutalistisches Webseitendesign für Website-Builder
via cargo.site

Von Aleksandar Igrošanac via Dribbble

7. Bewegliche Schrift

Wie alle Designschaffenden wissen, kann Typografie mehr als nur Informationen vermitteln. Sie kann die Betrachter bewegen. 2022 werden Webdesigner und -designerinnen diese Idee mit Schriften, die sich buchstäblich bewegen, weiterführen.

via esfuerzomezcal.com

via vitaarchitecture.com

Animationen sind im Webdesign selbstverständlich nichts Neues, allerdings sind sie in der Regel illustrierten Grafiken, UI-Elementen und Seitenübergängen vorbehalten. Aus diesem Grund kann sich bewegender Text frisch und überraschend wirken, selbst wenn die Animationen simpel sind – so wie dies bei kreisförmigen Drehungen und seitlich scrollenden „News Tickern“ der Fall ist. Diese kleinen Feinheiten rücken die Typografie in den Vordergrund, ohne die Leser mit verspielten, animierten Gags zu überwältigen.

via chungiyoo.com

via vancouverartbookfair.com

Bewegliche Schrift wird 2022 ein großer Trend. Wir leben in einer digitalen Welt und es ist cool zu sehen, wie man sich dies in der Welt der Schriften zunutze machen kann, um lebendige Buchstaben zu kreieren.
- Arian Bozorg, Community Engagement Manager bei 99designs von Vista

via spielzeit.jungesschauspielhaus.de

via enjoylunacoffee.com

8. Kreative Scroll-Erlebnisse

Da das Scrollen die häufigste Form der Interaktion ist, die User mit einer Seite haben, bietet es eine ständige Gelegenheit für animiertes interaktives Feedback. 2022 wird das Scroll-Erlebnis noch größer und besser als jemals zuvor, indem es Besucher mit auf eine imaginäre Reise nimmt. 

via uncannyvalley.studio

via tote.design/sirup/

Da Scroll-Animationen nichts Neues sind, liegt der Schlüssel zu diesem Trend darin, die User mit einem kreativen Erlebnis zu überraschen. Wir sehen Seiten, die sich durch psychedelische Bilder, Parallax-Effekte und sogar Durchbrüche in die dritte Dimension in lebendige Welten verwandeln. 

Animationen werden detaillierter und psychedelischer als jemals zuvor. Viele Designer und Designerinnen stellen ein auffälliges Element in den Vordergrund, auf das der User seinen Blick richten kann – so wie der schwarze Kristall auf der Seite von Stone & Style. Auf diese Weise sorgt das Vordergrund-Element dafür, dass sich die User nicht verirren, während sie von einer immersiven Animation dazu gebracht werden, sich zum unteren Ende der Seite zu begeben.  

via stonestyle.co.th

via dgstudio.com

Simples und doch interaktives Scrollen ist 2022 ein großer Webdesign-Trend. 
- Khaled Lioui, Team Lead Creative Production Studio bei Vista

via drinkcann.com

via kikk.be

9. Handgefertigte Grafiken

Wie wir in den Trends für 2022 gesehen haben, hat Technologie den Weg für unglaubliche Meisterwerke bereitet. Aber die Abhängigkeit von digitalen Tools kann schnell dazu führen, dass ein Stück der Persönlichkeit verloren geht, die man von handgemachten Kunstwerken mit kleinen Schönheitsfehlern kennt. Deshalb erwarten wir für 2022 mehr DIY-Grafiken, die Benutzeroberflächen hervorbringen, mit denen man sich identifizieren kann.

Botanisches Website-Design mit handgezeichneten Grafiken
Von Brent & Jo Studio

Dazu gehören Kritzeleien, unsaubere Ausschnitte und analoge Texturen wie Buntstifte und Farben. Dies schließt die Lücke zwischen Online und Offline, um diese allzu oft austauschbaren Bildschirme durch einen menschlichen Touch mit der realen Welt zu verbinden.

Setze auf handgefertigte Designs, um aus der Masse herauszustechen. 
- c-artworker, Designer bei 99designs von Vista
Künstler-Website-Design mit handgezeichneten Grafiken
via inapsquare.com
Ich mochte Einfachheit und Handwerkskunst schon immer. Vintage-Eindrücke und ein menschlicher Touch sind äußerst interessante Dinge für mich, die ich bei vielen Gelegenheiten weiterentwickeln kann. Das hatte einen großen Einfluss auf meinen Arbeitsablauf. 
- reza ernanda, Designer bei 99designs von Vista

Bist du bereit für die Webdesign-Trends 2022?

Die Webdesign-Trends 2022 stehen für einen weiteren Schritt nach vorne, auch wenn das im Internet nichts Neues ist. Die Zukunft schreitet in schnellen Schritten voran und digitale Designer und Designerinnen ebnen dafür den Weg. Doch was diese Trends so erfrischend macht, ist ihr Augenmerk darauf, für Freude zu sorgen. 

Ob sie ein vergessenes Jahrzehnt zurückbringen, die User mit Interaktionen und Animationen erfreuen oder etwas Handgemachtes bieten – das Ziel der diesjährigen Webdesign-Trends besteht darin, für einen kurzen Moment der Verwunderung zu sorgen, egal wie ungewöhnlich ihr Ansatz auch sein mag. 

Du möchtest ein angesagtes Webdesign für deine Marke?
Dann arbeite mit unserer talentierten Design-Community.