2022 Webdesign-Trends zur Inspiration Ihres nächsten Website-Projekts

Stimmt etwas mit TOO trendy nicht?

Ich sehe, dass viele Website-Designer vom Weg abgekommen sind – sie werden von „super schickem“ Design angezogen, auf Kosten der Benutzerfreundlichkeit und Funktionalität ihrer Websites.

„Die meisten Designer leben in einer Art alternativer Realität und kreieren unnötige Dinge füreinander. Dann werden sie zu Trends.“ – Webflow-Benutzer Blazej

Heute werden wir 3 Trends für 2022 durchgehen – die Sie nicht dazu bringen werden, die Benutzerfreundlichkeit Ihres Website-Projekts zu opfern, sondern dazu beitragen, es auf die nächste Stufe zu heben.

2022 Web Design Trend #1 – Motivausschnitte mit farbigen Hintergründen

Lassen Sie diesen Website-Trend 2022 für sich arbeiten:

• Die Verwendung einer „Shape Maker“-App wie ShapeDivider.app – kann Ihnen helfen, diese natürlichen Formen zu erstellen, wenn Sie eine nette Abkürzung wünschen.
• Die Auswahl des perfekten Bildes wird für diese wichtiger sein, da es bei vielen Bildern im Internet mit weißem Hintergrund leicht ist, zu „stock photo-y“ zu gehen.

2022 Webdesign Trend Nr. 2 – Monochrome Arbeiten

• Die Wahl einer anderen Farbe neben Schwarz und Weiß kann das Design zum POP machen!
• Weniger Farben zum Arbeiten zu haben, macht das Entwerfen dieser Art von Websites tatsächlich einfacher!
• Lassen Sie die Farbe für sich arbeiten, verwenden Sie sie für Tasten und Dinge, auf die Sie die Aufmerksamkeit lenken möchten.

2022 Webdesign-Trend Nr. 3 – Phantom-Designelemente

Lassen Sie diesen Webdesign-Trend 2022 für sich arbeiten:

• Fügen Sie ein Element hinzu, das Sie nicht unbedingt wie einen wunden Daumen herausragen möchten.
• Schaffen Sie eine hochwertige Ästhetik , indem Sie diesen subtileren Look verwenden.

Website-Trends der vergangenen Jahre

Wir lieben schöne Websites – die sich auf das Benutzererlebnis konzentrieren und auf eine Weise aufgebaut sind, die sowohl stilvoll als auch zeitlos ist. Der Schlüssel ist … nicht zu trendy zu werden, so dass es aus der Mode kommt, bevor Sie „Parallax-Animation“ sagen können.

• Springen Sie nicht auf jeden neuen Trend auf.
• Achten Sie darauf, was sowohl stilvoll als auch effektiv ist.
• Jeder der unten vorgestellten Trends enthält einen kleinen Auszug darüber, warum er stylisch ist, und einen separaten darüber, warum – oder ob – er effektiv ist.

Die drei wichtigsten Webdesign-Trends 2020

1. Große Typografie

Warum ist es stilvoll? In einer Welt, in der jeder so viel Text wie möglich in seine Designs füllt, um 200 Stakeholder zufrieden zu stellen … wenn Sie es auf eine Schlüsselbotschaft reduzieren können, die superkurz ist und so groß wirkt – gewinnen Sie.

Ist es effektiv: Es ist sehr effektiv, weil die Leute wissen, worauf sie sich konzentrieren müssen! Das Problem mit jedem Textstück, das dieselbe Größe hat oder nur winzige Abweichungen voneinander aufweist, ist natürlich, dass unklar ist, was der wichtigste Teil ist.

2. Kleinere Helden, wirkungsvollere Heldenbilder

Warum ist es stilvoll? Wie herrlich ist es, seine schönen Bilder nicht zu verdecken? Die Leute lieben das, weil es sich kohäsiv anfühlt und Sie weniger wahrscheinlich Probleme mit dem Schichten haben, die schwierig sind (Beispiele im nächsten Punkt).

Ist es effektiv: Das kann es sicherlich sein – der entscheidende Punkt ist, dass die Bilder gut sind und den Menschen wirklich helfen, sich vorzustellen, dass sie von Ihrem Produkt oder Ihrer Dienstleistung profitieren. Ohne gute Bilder kann dies nur kitschig aussehen.

3. Geschichtete Elemente

Warum ist es stilvoll? Genau wie in der Mode ist absichtliches Schichten kunstvoll – es fühlt sich absichtlich an und kann daher sehr schön aussehen.

Ist es effektiv: Dies hängt wirklich vom jeweiligen Artikel ab. Es kann wirklich NICHT effektiv sein, wenn es nicht das richtige Foto, die richtigen unterstützenden Elemente, die richtige Überlagerung für den Kontrast oder die richtige Typografie (funktioniert besser mit dickeren Schriftarten) hat. Achten Sie darauf, dies nicht zu überbeanspruchen – und verwenden Sie es wenn Sie solide Elemente haben, die zusammenarbeiten, und Sie 'Kontrolle über sie haben'. Oft tauscht ein Kunde ein Image aus, das jetzt nicht funktioniert – und daher ist es wichtig, dass es mit den richtigen Komponenten gemacht wird, wenn Sie wissen, dass sie sich nicht oft ändern werden.

Weitere lobende Erwähnungen:

Vertikale Typografie – Wird für UI-Elemente verwendet und kann Designs ein absichtlicheres Gefühl verleihen.

Organic Shape Cutouts – Das obige Beispiel von Pops Diabetes macht sich diesen Trend ebenfalls zunutze.

10 % versetzte Bilder – Auch der obige Artikel von Schaefco weist dies auf –

Typografische Ausschnitte – Ich habe einige großartige Beispiele dafür gesehen. Ein großer fetter Buchstabe wird aus dem weißen Raum ausgeschnitten und hat manchmal ein Video dahinter – was einen wirklich coolen Schichteffekt ergibt.

Videos auf jeder Seite – Wenn Sie regelmäßig Videos machen – warum machen Sie nicht eins für jeden Ihrer Schlüsseldienste und binden sie ein, um die „Zeit vor Ort“ zu verlängern? Großartig für SEO – und großartig für Ihre Benutzer, die keine Lust zum Lesen haben. (Hinweis: Die meisten von uns würden lieber ein Video ansehen.)

Leichte ergänzende Animationen – Animationen ziehen die Aufmerksamkeit auf sich, besonders wenn sie sich ein wenig bewegen, aber stellen Sie sicher, dass Sie die Aufmerksamkeit der Leute auf das Richtige lenken. Oder stellen Sie sicher, dass die Animationen wirklich gut sind / einen Stil haben, der wirklich zu Ihrer Marke passt.

Mehr Serifenschriften – Serifenschriften sind einfacher zu lesen! Ich freue mich über das Comeback von Serifen im Jahr 2020 und darüber hinaus!

Andere Designer übernehmen die Webdesign-Trends 2020 (Crowdsourced.)

Webdesign-Dienste konzentrieren sich in letzter Zeit darauf, den Benutzern das beste Erlebnis zu bieten, wenn sie die Website durchsuchen. Daher wird es für die Entwickler sehr wichtig, sicherzustellen, dass sie entsprechend arbeiten.
Hier ist also eine Liste der 17 wichtigsten Webdesign- und UI-Trends für das Jahr 2020.

1. Offener und farbenfroher Minimalismus
Wenn Sie heute noch an minimalistisches Design mit schwarzen und weißen Hintergründen denken, sind diese Zeiten vorbei. Offener und farbenfroher Minimalismus ist der neueste Trend, der den Webdesigns ein zusammenhängendes und auffälliges Gefühl verleiht.

2. Mobilfreundlich
Mit der zunehmenden Nutzung von Mobiltelefonen müssen die Designer sicherstellen, dass die Website für Mobilgeräte optimiert ist, damit jeder Benutzer die Website problemlos über sein Mobiltelefon anzeigen kann. Genau hier hilft ein responsiver Webdesign-Service.

3. Übergroße Überschriften
Übergroße Überschriften und Schlagzeilen sind in letzter Zeit sehr üblich geworden, um die Aufmerksamkeit der Leser zu erregen, da sie viel weniger Zeit auf der Website verbringen können. Die Schlagzeilen sind also so gestaltet, dass sie die Aufmerksamkeit der Leser auf sich ziehen.

4. Lebhafte Farben, herausfordernde Farbverläufe und dunkle Hintergründe
Die heutigen Websites konzentrieren sich darauf, die beste Benutzererfahrung zu bieten, und daher konzentrieren sich die Webdesign-Dienste besonders darauf. Die Verwendung von komplexeren Farbverläufen und einer fantastischen Farbwiedergabe mit dunklem Hintergrund hat sich im Jahr 2019 immer mehr durchgesetzt. Ein klassischer Mix aus allen dreien liegt im Trend.

5. Ladegeschwindigkeit der Website
Die Kunden von heute sind immer in Eile und daher wird eine langsam ladende Website von den Benutzern einfach übersprungen. Daher muss die Ladegeschwindigkeit der Website viel höher sein, was genau der neueste Trend für eine verbesserte Benutzererfahrung geworden ist.

6. Animationen und Illustrationen der nächsten Ebene
Die Nutzer freuen sich immer wieder über Neues. Dies kann leicht mit den Animationen sowie den Illustrationen der nächsten Ebene erreicht werden, was genau der Grund dafür ist, warum diese zum neuesten Trend geworden sind.

7. CSS-Raster
Die CSS-Raster sind immer noch einer der beliebtesten Webdesign-Trends, der eine wichtige Rolle dabei spielt, das Webdesign viel einfacher zu machen. In letzter Zeit ist es eine Mischung aus einigen neuen Tools mit bestehenden Funktionen. Das moderne CSS von heute bietet ein völlig neues Maß an Reaktionsfähigkeit, Interaktion sowie Datenvisualisierung.

8. Farbschemata, die hell und dunkel sind
Um etwas Aufregendes für die Benutzer zu schaffen, ist die Verwendung von hellen und dunklen Farbschemata einfach zu gut. Dies schafft einen positiven Eindruck bei den Benutzern und ist daher von Vorteil.

9. Immersive 3D-Erlebnisse
Die 3D-Bilder und -Grafiken sind für Webdesign-Dienste zweifellos zu schade, um ansprechende Webdesigns zu erstellen, die den Benutzern ins Auge fallen. Die immersiven 3D-Erlebnisse bringen Leben in Ihre Website und bieten den Benutzern großartige Erlebnisse.

10. BrutalismusBrutalismus ist ein weiterer großer Trend, der auf dem Vormarsch ist, was sich daran zeigt, dass immer mehr Marken es vorziehen, sich mutiger, grobkörniger und dreister Konzepte zu bedienen, um ihre innere rebellische Seite zu zeigen.

11. Fliegende und schwebende Elemente
Um die Aufmerksamkeit der Benutzer zu erregen, sind sowohl fliegende als auch schwebende Visuals äußerst effektiv.

12. Organische und geometrische Formen
Die Verwendung geometrischer und organischer Formen für Webdesign-Dienste hat ihren Platz irgendwo zwischen den flachen Designs und den gebrochenen Gittern ziemlich fest eingenommen.

13. Überlappende Dinge
Der Überlappungseffekt ist sicherlich einer der heißesten Trends des Jahres 2020. Überlappende Dinge wecken visuelles Interesse für einige der spezifischen Arten von Inhalten. Dieses Konzept ist ein großartiger Trick, um die Interessen von Menschen zu wecken, muss jedoch mit Webdesign-Diensten sorgfältig durchgeführt werden.

14. Erhöhtes Video
Das Hinzufügen von mehr Videos bringt mehr Leben in die Website und hat die Fähigkeit, die Aufmerksamkeit fast aller zu erregen, wie keine anderen Medienformen. Dies ist zweifellos ein Trend für 2020 und wird noch lange anhalten.

15. Asymmetrische Layouts und unterbrochene Gitter
Die asymmetrischen Layouts der Website zusammen mit der Verwendung von unterbrochenen Gittern zum Zeitpunkt des Webdesigns sind heutzutage üblicher geworden.

16. Erweiterte Realität
Reine Bildschirmschnittstellen reichen für die heutige Welt nicht aus, und die Benutzer möchten, dass physische Interaktionen in der realen Welt stattfinden. Hier müssen sich die Webdesigner etwas Neues einfallen lassen, um die Funktion Augmented Reality anzubieten.

17. Mikrointeraktionen
Die Bedeutung von Mikrointeraktionen darf um keinen Preis vernachlässigt werden. Diese sind einfach großartig, um Veranstaltungen zu erstellen, die sehr einladend sind und dadurch im Jahr 2020 auf dem Vormarsch sind.
Jetzt, da Sie die wichtigsten Webdesign- und UI-Trends für 2020 kennen, verschwenden Sie nicht mehr Zeit, sondern integrieren Sie diese in Ihre Website, um den Benutzern fantastische Erlebnisse zu bieten.

Beispiele für gängige Webdesign-Trends, die schlecht genutzt werden

Wie stellen Sie fest, ob ein Trend schlecht genutzt wird? Empathie und Intuition. Wenden Sie sich an Ihre innere Jiminy-Grille. Würde es Ihnen gefallen, wenn Ihnen das jemand mit seiner Website antun würde? Wenn die Antwort nein ist, sollten Sie vielleicht auf die fünfzig Pop-ups verzichten, obwohl Sie „so viele Newsletter-Anmeldungen haben“, dass Sie sie für den Rest Ihres Lebens spammen können.

Funktioniert es? Herzlichen Glückwunsch, Sie haben 5 weitere Menschen konvertiert und weitere 40 angepisst, was Ihre Markenwahrnehmung ruiniert und sie dazu gebracht hat, es sich noch einmal zu überlegen, jemals wieder auf Ihre selbstbeglückwünschenden Inhalte zu klicken. Also ja, Sie haben es erraten, mein bestes Beispiel für einen schlecht genutzten Webdesign-Trend ist:

Invasive Pop-ups

Aufdringliche Pop-ups und die Art, bei der Sie nicht wissen, wie Sie sie schließen sollen, oder die Sie zwingen, eine lächerliche Frage zu beantworten, sind schrecklich.

So machen Sie es besser – Verschenken Sie etwas Wertvolles, wenn jemand geht

Anstatt zu versuchen, jemanden in Ihre E-Mail-Liste zu schieben, ziehen Sie. Wenn Sie mir etwas von Wert geben, bin ich nicht verärgert, dass Sie mir ein großes altes Pop-up ins Gesicht setzen, tatsächlich könnte ich ein wenig fasziniert sein. Wichtig zu beachten ist, dass der Inhalt die Variable ist. Stauben Sie nicht irgendein beschissenes Whitepaper ab, bauen Sie etwas Großartiges – arbeiten Sie mit einem Team zusammen, um etwas Großartiges zu bauen – was auch immer Sie tun müssen, und machen Sie es dann zum Mittelpunkt. Kombinieren Sie das mit einem „Ausstiegsabsicht“-Pop-up und zwingen Sie niemanden, eine Entscheidung zu treffen – geben Sie immer klare Wege, um das Pop-up auszublenden.

Unendliche Schriftrolle

Wir brauchen keinen klaren Call-to-Action am Ende oder einen schönen Footer mit durchdachter Navigation

Vielleicht ist dies ein Beispiel für mein zynisches Gehirn eines alten Mannes, weil ich nicht einmal damit umgehen kann, wenn Twitter von Sternen zu Herzen wechselt – aber wenn wir hier die goldene Regel anwenden, hasse ich es, einen Artikel fertigzustellen und jemand anderen eine Entscheidung treffen zu lassen welchen Artikel ich als nächstes lesen möchte. Die Entscheidung für sie zu treffen, mag bei Facebook- und YouTube-Videos angenehm sein, denn hey, es ist ein Video und ich vegetiere sowieso nur – aber für Inhalte, die Sie lesen müssen, tut es mir leid, ich glaube nicht, dass Sie es tun werden eine Entscheidung über meine Vorlieben, die genau auf einem Artikel oder Inhalt basiert, den ich fertiggestellt habe.

Ich möchte dies mit der Tatsache einschränken, dass galerieartige / Pinterest-ähnliche Websites, auf denen Sie eine Reihe von Artikeln durchsuchen, einen gewissen Vorteil für diese Art der Navigation zu haben scheinen, aber möglicherweise auf soziale Netzwerke beschränkt sind. Der Rest von uns braucht die Befriedigung einer Schlussfolgerung und mehr Navigation.

Wie man es besser macht – Denken Sie darüber nach, was eine Person tun möchte, nachdem sie diese Kategorie oder Art von Inhalten auf der Website gelesen hat.

Jede Art von Inhalt auf der Website kann eine Art Pre-Footer mit anderen ähnlichen Artikeln, Navigationselementen und idealerweise ein paar klaren nächsten Schritten haben, die auf das zugeschnitten sind, was sie gerade fertig gestellt haben. So sehr ich die „Lobster“-Schriftart im obigen Beispiel (Messages Home) hasse, denke ich, dass Jared lange und gründlich darüber nachgedacht hat, woran die Leute interessiert sein könnten, nachdem sie eine Seite mit Inhalten gelesen haben, und diese auf visuelle Weise geteilt hat ist klar und einfach. Wenn doch nur andere Footer so viel Glück hätten. Ich gebe es zu, ich habe einen Footer-Fetisch.

3. Schmerzhaft ablenkende Parallaxe, die außer einer Millisekunde von oooh-ahhh keinen Wert hinzufügt.

Diese Kunst- und Kulturorganisation hat Bewegung, sie hat Tiefe – aber hat sie einen Sinn? Ich kann mir nicht vorstellen, wie die Kreise auf der Rückseite ein nützliches Element hinzufügen, außer dass es an einer Stelle originell oder noch nicht viel gemacht war. IE ein Gimmick – aber hey, sie haben einen Site Award gewonnen … also muss die Site gut sein, oder?

Bewegung und Tiefe können großartig sein, wenn sie geschmackvoll implementiert werden, leider eilte eine große Anzahl von Leuten herein, um Parallaxe zu implementieren, ohne viel nachdenklich darüber nachzudenken, wie es den Besuchern wirklich helfen und einen Mehrwert schaffen würde. Große spacige Designs sind schön, aber wenn Sie versuchen, den Inhalt einer Website auf den Punkt zu bringen und wirklich zu erfahren, wie oder warum Sie mit einem Unternehmen zusammenarbeiten oder ein Produkt kaufen möchten, verfehlen lange Parallax-Websites den Sinn.

Wie man es besser macht – Implementieren Sie subtil, um etwas Tiefe hinzuzufügen, und verwenden Sie es sparsam auf eine Weise, die den Produkten gegebenenfalls ein wenig Faszination verleiht.

Inzwischen haben vielleicht viele von Ihnen den Schneefallartikel der New York Times gesehen, der 2012 veröffentlicht wurde. Der Artikel verwendet Parallaxe und Video auf eine Weise, die fast entwaffnend war, weil er zu dieser Zeit so fortschrittlich war.

Schlüssel, die diese Seite so schön machen?

• Starke Betonung des Inhalts – typografische Elemente sind super durchdacht und gut lesbar
• Titelbehandlungen geben eine klare Hierarchie
• All dies spielt sehr gut zusammen, so dass der Parallaxe-Aspekt nicht im Mittelpunkt steht, sondern eher ein angenehm subtiler Teil eines größeren Bildes ist.

Genau so lässt sich Parallax 2016 geschmackvoll einsetzen, ohne wie eine Spielerei zu wirken.

Webdesign-Trends von 2019

Webdesigner unterscheiden sich nicht von Modedesignern darin, dass sie ständig ein Ohr am Boden haben müssen, wenn es darum geht, zu hören, was die neuesten Trends für das kommende Jahr im Webdesign sein werden.

Ein smarter Webdesigner hat bei der Gestaltung einer Seite nicht nur das Markenimage im Blick, sondern auch die Usability für den Nutzer. Aus diesem Grund sortieren Designer jedes Jahr Designdetails aus, die den Benutzern nicht gefallen, und erweitern diejenigen, die den Benutzern gefallen.

Dieses Jahr ist das nicht anders, und hier ist eine Liste der Top-Trends, auf die Sie im Webdesign für 2019 achten sollten.

Video-Hintergründe

Sie haben wahrscheinlich eine anständige Anzahl von Websites gesehen, die große Videohintergründe enthalten, um den Benutzer zu fesseln. Videohintergründe sind eine großartige Möglichkeit, dem Benutzer einen Einblick in Ihr Unternehmen zu geben.

Schauen Sie sich die Website des Immobilienentwicklungsunternehmens Ditto an , die ihre Wohnsiedlungen mit Menschen hervorhebt, die ihren Tag verbringen, und dem Benutzer die Möglichkeit bietet, das Innere der Einheiten auf ansprechende Weise zu sehen.

Wir haben mit Deneen Pottery zusammengearbeitet, um bei der Umsetzung eines Videos zu ihrem Hintergrund zu helfen, das echtes Filmmaterial ihrer handgefertigten Töpferwaren zeigt.

Partikelhintergründe

Für Unternehmen, die dennoch Bewegung in ihre Websites einbauen möchten, sind Partikelhintergründe eine großartige Alternative zu Videohintergründen, insbesondere wenn Sie sich Sorgen über die Ladezeit bei einem größeren Hintergrundvideo machen. Diese Animationen sind Javascript, die natürliche und ansprechende Bewegungen als Teil des Hintergrunds erzeugen.

Heystack hat einen komplizierten Partikelhintergrund für seine Website verwendet, und wir erwarten, dass mehr Designer dasselbe tun werden.

Asymmetrische Layouts

Die einzigartigen und unverwechselbaren Aspekte des asymmetrischen Webdesigns machen es attraktiv, Ihre Website von anderen abzuheben. Im Gegensatz zu dem seit einigen Jahren beliebten minimalistischen Stil sind asymmetrische Designs geschäftiger, sehen aber immer noch genauso sauber und professionell aus, wenn sie richtig gemacht werden.

Wir haben kürzlich diese Website für Sustainable 9 gestartet, die sich überschneidende Formen aufweist, und obwohl es einen Anschein von Ausgewogenheit gibt, gibt es sicherlich asymmetrische Elemente, die ihr Tiefe verleihen.

Fette Typografie

Die Wahl der richtigen Typografie kann der Unterschied zu einer niedrigen statt einer hohen Absprungrate sein. Die Wahl einer fetten Typografie, insbesondere in einer großen Schriftgröße, kann die Aufmerksamkeit Ihrer Website-Benutzer wirklich auf sich ziehen.

Diese beiden Homepages von Websites, die von einem Webdesigner auf Dribble erstellt wurden, veranschaulichen perfekt die einfache und moderne Natur fetter Schriftarten.

Integrierte Animationen

Integrierte Animationen sind genau das, wonach sie sich anhören: Animationen, die auf der gesamten Website platziert werden, um der Website ein zusätzliches Gefühl von Lebendigkeit, Bewegung und Engagement zu verleihen. Wie Sie bemerkt haben, ist Bewegung ein großes Thema im Webdesign für das kommende Jahr.

30 Species in Pieces, eine Website, die sich der Aufklärung von Menschen über gefährdete Tiere widmet, verwendet gestochen scharfe und ansprechende Animationen in ihrem einfachen Webdesign, um sie zum Leben zu erwecken.

Dynamische Farbverläufe

Wie wir bereits angemerkt haben, erleben Farbverläufe ein Comeback. Farbverläufe ermöglichen die Anpassung an die Farben Ihrer Website, um etwas zu schaffen, das Ihre Marke wirklich verkörpert.

Apple verwendete einen Farbverlauf für seine Schriftfarbe, um sich an das Thema seiner neuen iPhone X-Anzeigen zu halten.

Unterbewertete Webdesign-Trends von 2018

Webdesign- Trends ändern sich jedes Jahr ständig – was vor ein paar Jahren „trendy“ schien, ist heute vielleicht nicht mehr die beste Option. Daher ist es für alle Geschäftsinhaber wichtig, über die neuesten Webdesign-Trends auf dem Laufenden zu bleiben, um ihr Geschäft zu verkaufen und die Aufmerksamkeit der Besucher aufrechtzuerhalten. Lesen Sie weiter, um sechs der größten unterbewerteten Webdesign- Trends des Jahres 2018 zu entdecken.

Unterbrochene Rasterlayouts

Viele Websites verwenden Raster, um sicherzustellen, dass hinter dem Text, den Bildern und den Navigationsschaltflächen eine Struktur vorhanden ist. Raster bieten nicht nur eine Richtlinie für die Designer, sondern helfen den Besuchern auch, sich leicht auf der Website zurechtzufinden. Allerdings ist in diesem Jahr das typische Grid-Layout durchbrochen. Anstatt einer bestimmten Regel zu folgen, gab es die Möglichkeit, beim Webdesign etwas anderes zu machen. Entwickler haben sich zu Layouts mit unterbrochenen Rastern bewegt, die weniger restriktiv sind. Unterbrochene Rasterlayouts ermöglichen es dem Text und den Bildern, sich freier in und über die Seite zu bewegen. Wenn sich Elemente überlagern, entsteht ein harmonisches Webdesign, das für den Besucher natürlich fließt. Unterbrochene Rasterlayouts können auch durch die Verwendung von Ebenen, ungewöhnlicher Positionierung und subtilen Berührungen erreicht werden, die die Seite ansprechender machen.

2. Chatbots

Immer mehr Webdesigner beginnen damit, den Einsatz von Chatbots in Websites zu implementieren. Chatbots werden häufig auf Unternehmenswebsites angezeigt, die sich unten rechts auf dem Bildschirm befinden. Das kleine Pop-up-Fenster gibt Besuchern die Möglichkeit, mit jemandem aus dem Unternehmen zu sprechen oder automatisierte Hilfe bei Anfragen zu erhalten. Das Hinzufügen eines Chat-Fensters zu Ihrem Webdesign bedeutet, dass jeder Besucher mit einer Frage diese sofort beantwortet bekommen kann. Einige Unternehmen haben Probleme damit, einen Mitarbeiter zum Chatten zur Verfügung zu haben. Es ist jedoch möglich, Ihren Chatbot so zu programmieren, dass er die häufigsten Fragen beantwortet und Details zur Kontaktaufnahme mit dem Unternehmen bereitstellt, wenn es die Antwort auf eine Frage nicht kennt.

Kundenspezifische Illustrationen

In der Vergangenheit bestanden Webdesign-Bilder hauptsächlich aus Produktaufnahmen, GIFs und redaktionellen Fotografien, die die Eigenschaften, Funktionen und menschlichen Dimensionen des Produkts betonten. 2018 hat sich davon etwas entfernt, Illustrationen dominieren nun den Markt. Entwickler haben festgestellt, dass Illustrationen ansprechender und einladender sind. Sie haben eine klare und fokussierte Botschaft, die auf die Marke zugeschnitten ist. Illustrationen werden normalerweise mit unkonventionellen Farbkombinationen vervollständigt, die mit verschiedenen Kontrasten experimentieren, Spannung erzeugen, aber auch die Lesbarkeit des Webdesigns erhalten.

Seitenübergänge

Jedes Mal, wenn die Erfahrung eines Benutzers unterbrochen wird, besteht eine hohe Wahrscheinlichkeit, dass er die Website verlässt. Dies kann auch passieren, wenn sie von einer Seite zur anderen wechseln. Einige Websites brauchen zu lange zum Laden, während andere den Benutzer aus dem Kontext herausreißen, in dem er sich befand, bevor die neue Seite geöffnet wurde. Daher ist es wichtig, dass jedes Webdesign reibungslose und effiziente Übergänge zwischen den Seiten hat. In diesem Jahr führen immer mehr Websites für ihre Besucher zusammenhängende Seitenübergänge ein. Anstatt zu einer neuen Seite zu navigieren, können Besucher verschiedene Informationen auf derselben Seite anzeigen. Diese reibungsloseren Seitenübergänge können die Benutzererfahrung verbessern und das Engagement für Ihre Marke steigern.

Brutalismus

2018 hat der Einsatz von Brutalismus im Webdesign zugenommen. Brutalismus eröffnet einen Raum, in dem Entwickler und Designer tun können, was sie wollen, und nicht, was sie tun sollten. Dieser Stil des Webdesigns wurde von der Architektur der 1950er Jahre inspiriert, die simpel, kostengünstig und praktisch war. Brutalistisches Webdesign ist roh und fesselnd. Das Hauptaugenmerk liegt auf dem Inhalt, da es wichtig ist, ihn für den Besucher optisch ansprechend zu gestalten. Brutalistisches Webdesign manifestiert sich durch exponierte Strukturen, ein Gefühl der Rauheit und durchdachte Prozesse.

Videoinhalt

In diesem Jahr ist auch die verstärkte Nutzung von Videoinhalten auf Websites zu beobachten. Videos sind eine großartige Möglichkeit, komplexe Informationen in einem visuellen Format zu vermitteln. Videoinhalte lassen Websites nicht nur moderner aussehen, sondern schaffen auch ein Gefühl von Kunstfertigkeit, das ein statisches Bild nicht einfach erreichen kann. Videos sind ein mächtiges Werkzeug, weil sie sich nahtlos in Ihr Webdesign einfügen und selbst mit vielen Farben, Verläufen und Details immer noch äußerst hochwertig bleiben. Videos können auch geloopt werden, um sicherzustellen, dass die Details der Kopie und die des Videos im Einklang bleiben. Viele Website-Entwickler sehen, dass Besucher länger auf Websites bleiben, wenn Videoinhalte vorhanden sind, und dass sich Besucher auch eher für ihre Produkt- und Serviceangebote anmelden oder entscheiden.Aus geschäftlicher Sicht – welche Trends für das Webdesign im Jahr 2017 sind wichtig?

Webdesign-Trends, die die Nadel bewegen

1. Kontaktformular auf jeder Seite

Verstehen Sie es nicht verdreht – wenn Ihre Website eine Website zur Lead-Generierung ist, möchten Sie das Kontaktformular nicht schwer auffindbar machen. Wenn Sie es auf jeder Seite einbauen können, umso besser.

Es mag wie ein einfacher Trick erscheinen, aber die besten „Tricks“ sind es.

2. Allgegenwärtiger CTA: Konstant starker Call-to-Action-Button

Sie müssen kein Kontaktformular haben, um Leute dazu zu bringen, Sie zu kontaktieren, eine Demo zu erhalten, ein Angebot zu erhalten oder was auch immer die Hauptaktion ist, zu der Sie den Kunden bewegen möchten. Stattdessen können Sie die ganze Zeit über einen großen Button oben rechts einfügen. Lassen Sie beim Scrollen die Call-to-Action-Schaltfläche oben auf dem Bildschirm mit einem „klebrigen“ Header, der den Besuchern folgt.

3. Überladen des Designs mit Vertrauensfaktoren wie Organisationsabzeichen und Testimonials

Ich bleibe nur bei den effektivsten Dingen, die ich kenne, die einigen meiner Zuhörer vielleicht vorher nicht so bewusst waren. Vertrauensfaktoren sind alles im Webdesign – sie sind fast alles, woran ich denke, abgesehen von einem sauberen, modernen und ästhetisch ansprechenden visuellen Design.

Die einzige Möglichkeit, Menschen zum Handeln zu bewegen (große Call-to-Action-Schaltflächen und Jetzt-kaufen-Schaltflächen usw.), besteht darin, sie mit diesen Elementen zu umgeben, die sie erklären und zum Fortfahren anregen – denn VERTRAUEN ist bei jeder Transaktion absolut entscheidend.

Haben Sie kostenlose Rücksendungen? Haben Sie einen schnellen und kostenlosen Versand? Haben Sie eine Garantie? Präsentieren Sie diese Dinge.

Teil einer lokalen Handelsgruppe? Besseres Geschäftsbüro? Haben Sie ein SSL-Zertifikat in Ihrem Online-Shop?

Fügen Sie eine visuelle Darstellung für diese Artikel hinzu und erwägen Sie, sie an den Stil Ihrer Website anzupassen, um das Vertrauen noch mehr zu steigern.

Einer der größten Punkte in der Kategorie der Vertrauensfaktoren, die die meisten Qualitätsunternehmen haben, sind Online-Bewertungen und Erfahrungsberichte. Ich schlage vor, diese auf Ihrer Website sehr visuell hervorzuheben. Wenn es sich um Testimonials handelt, haben Sie idealerweise Fotos der Kunden selbst, um dem, was sie über Ihr Produkt oder Ihre Dienstleistung gesagt haben, noch mehr Glaubwürdigkeit zu verleihen.

4. Ein Video haben, um Ihr zentrales Leistungsversprechen zu präsentieren

Als ich DeneenPottery.com zum ersten Mal entwarf, arbeitete ich mit dem, was der Kunde hatte – Bilder seiner hochwertigen Tassen und ein Video, das ein wenig im Design versteckt war. Wir haben dieses Video herausgearbeitet, indem wir ein kleines Highlight daraus genommen haben, das unbestreitbar die handgefertigte Natur ihrer Tassen zeigt und den Menschen einen Vorgeschmack auf ihren Prozess gibt:

5. Äußerst attraktives Design mit Weißraum – erwägen Sie sinnvolle Übergänge, überlappende Rastersysteme und geteilte Inhalte, um Dichotomien hervorzuheben

Weißraum ist dieses entzückende Element des Designs, das alles „high-end“ wirken zu lassen scheint:

Bei dieser Website habe ich mich entschieden, die natürliche Offenheit der Fotografie zu nutzen, um ein Gefühl von großzügiger Dekadenz zu erzeugen.

Apple versteht Leerzeichen. Das bedeutet nicht, dass der Hintergrund weiß ist – es bedeutet nur Freiraum um das Hauptmotiv des Designs herum.

Hier ist ein wirklich großes Beispiel für Apples Verwendung von Leerzeichen auf ihrer Website :

Sinnvolle Übergänge

Google verwendet seit Jahren sinnvolle Übergänge in seinem „Material Design“ – aber immer mehr Webdesigner nutzen dies, um eine effektive Möglichkeit zu schaffen, den Aktionen, die der Benutzer auf der Website ausführt, mehr Kontext zu verleihen. Sehen Sie sich den Hover-Status auf der Schaltfläche unten an, die Farbausbreitung, wenn der Benutzer auf die Schaltfläche klickt, und dann die Art und Weise, wie das Modal-/Popup-Fenster nach dem Klicken größer wird:

Durch die Verwendung von Materialdesign auf dieser Website konnte ich die Website sehr interaktiv und sehr modern wirken lassen. Es hilft auch, dass Sie sich durch die Verwendung von Konventionen aus Material Design auch subtil mit der Art der Benutzererfahrung auf Google.com und den vielen Produkten von Google in Verbindung bringen – da sie alle diesen Konventionen entsprechen und diese verwenden.

Überlappende Gittersysteme

Boxen im Webdesign sind traditionell Seite an Seite, eine über der anderen, aber viele Designer verwenden einen sehr 2017er Stil, der als überlappendes Rastersystem oder Offset-Rastersystem bezeichnet wird. Dieser Stil stellt Boxen und Fotos übereinander, um einen organischeren, frei fließenden Effekt zu erzielen.

Teilen Sie Farbe oder Bilder, um eine Dichotomie herauszuarbeiten

Eine Dichotomie ist die Trennung von zwei Dingen – wie „heiß und kalt“ oder „gut und böse“. Indem zwei Seiten einer Website sehr unterschiedlich gestaltet werden, erregt sie die Aufmerksamkeit eines Besuchers.

Sie können dies verwenden, um die emotionalen Elemente der Gegensätzlichkeit oder die beiden Seiten des Gehirns „emotional und logisch“, „kreativ und systemorientiert“ hervorzuheben, oder es einfach verwenden, um einen visuellen Reiz zu erzeugen, wie dieses Design von Mateusz Koziorowski .

Was auch immer Sie tun – stürzen Sie sich nicht einfach so auf Webdesign-Trends

Berücksichtigen Sie in erster Linie Ihre Geschäftsziele. Visuelle Designtrends sind nichts, ohne zu überlegen, was sie in Bezug auf die Bewegung der Nadel mit Ihren Einnahmen bewirken werden.

Eine bessere Website ist gleich um die Ecke
Seit der Einführung der ersten Websites haben wir einen langen Weg zurückgelegt. Webdesigner werden detaillierter, abenteuerlustiger und ehrlich gesagt besser. In den nächsten Jahren des Webdesigns wird es darum gehen, Grenzen zu überschreiten und mutige neue Ideen auszuprobieren. Hier bei Hook lieben wir es, eine alte Website zu nehmen, der Sie überdrüssig geworden sind, und sie in etwas zu verwandeln, das die innovative Einzigartigkeit Ihrer Marke wirklich verkörpert. Wenn Sie eine neue Website erstellen möchten, die Benutzer anspricht und zu mehr Conversions führt, wenden Sie sich noch heute an Hook Agency, um ein Meeting zu vereinbaren, bei dem wir darüber sprechen, was Ihre Geschäftsziele sind und wie wir sie umsetzen können sie in Ihre neue Website.