Die Anfänge des Internets waren zugegebenermaßen die Zeiten grafischen Augenkrebses: Animiert blinkende GIFs hüpften über selbst zusammengeklöppelte HTML-Seiten, Textstyles, Farben und Hintergrundgrafiken wurden lustig gemischt und nicht selten startete beim Aufruf einer Webseite irgendein kostenloses Audiofile in Endlosschleife – gerne, wenn man grad mal eben im Großraumbüro ein bisschen zum Spaß surfen wollte.

Wie gut, dass diese grafischen und akustischen Ausrutscher seit langem der Vergangenheit angehören. Selbst private Blogs sind dank einfach zu bedienender Tools und CMS-Systeme wie WordPress in der Regel sehr passabel anzusehen.

Doch was ist eigentlich gerade state of the art in Sachen Webdesign? Nachgefragt – bei unserem Chef-UXler Andrej Schamber.

Andrej, Wie hat sich das Webdesign in den vergangenen Jahren weiterentwickelt?

Andrej: Enorm! – Nicht nur der Mobile-Trend hat für viele Neuerungen und zumeist positiven Entwicklungen gesorgt. HMTL5 und CSS3 haben uns neue Möglichkeiten geöffnet und Flash nun endlich überflüssig gemacht. Digitales Design ist wichtiger und zugänglicher geworden. Es gibt mittlerweile unzählige Tools, mit denen nicht nur Webdesigner arbeiten, sondern die auch von Laien bedient werden können und durchaus ordentliche Ergebnisse liefern.

Welche Änderungen *genau* hat der Aufschwung der mobilen Endgeräte mit sich gebracht?

Andrej: Das Aufkommen der vielen unterschiedlich großen Mobile-Devices – vom Smartphone über das Phablet bis zum Tablet – hat zu einem Umdenken geführt. Aus separat zu erstellenden mobilen Websites wurden responsive Websites – eine Website für alle Formate. Long Scroll und Onepage-Lösungen wurden (wieder) populär. Navigationslösungen wurden überdacht und neu eingeführt (z.B. das Hamburger-Icon). Gesten-Steuerung, schickes und minimalistisches Design und animierte Icons machen einfach mehr Spaß als früher.

Mittlerweile haben mobile Endgeräte einen so hohen Stellenwert, dass viele Designer nach dem Workflow-Prinzip „Mobile-First“ arbeiten und neue Websites von den kleinen Geräten her konzipieren und denken. Das führt natürlich letzten Endes zu einem höheren Design- bzw. Programmieraufwand. Aber das ist wahrscheinlich auch die einzige Schattenseite.

Heute spricht man ja eigentlich gar nicht mehr von Web-Design, sondern vom UX-Design. Wie lässt sich dieser Begriff definieren?

Andrej: UX-Design ist das bessere Web-Design. So richtig trennen lassen sich aber beide Begriffe nicht. In der Vergangenheit war Webdesign vor allem mit der Ausarbeitung und Gestaltung von Seiten und Screens verbunden. Beim UX-Design geht es um mehr als nur darum eine funktionale, und die Werte der Marke transportierende Webseite zu erstellen. UX steht für „User Experience“. Die positive Erfahrung, die der Benutzer mit dem Produkt – in unserem Fall der Webseite – machen soll.

UX-Design greift schon früher in Prozesse ein und hinterfragt die Intentionen und das Nutzungsverhalten der potenziellen Nutzer. Es bietet Lösungen an, die den Bedürfnissen der User entsprechen und diese ihre Ziele bei der Interaktion auf der Website komfortabel und intuitiv erreichen lassen.

Letzten Endes ist es ja immer der individuelle Geschmack, der über „schön“ oder „hässlich“ entscheidet. Dennoch gibt es alle paar Jahre wechselnde Trends oder Hypes. Auf welche sollte man definitiv achten?

Andrej: Interaktive Storytelling-Websites sind aus UX-Sicht sehr interessant – hier stehen Emotionalität, Vertrauensbildung und Im-Gedächtnis-bleiben im Vordergrund. Typografie wird immer wichtiger im Webdesign – auch weil es kaum noch Hürden bzw. Probleme beim Einbinden von Schriften gibt. Es wird immer mehr Wert auf qualitatives Bild- und Videomaterial gelegt – sowie auf animierte UI-Elemente (SVGs und CSS3) und interaktive Infografiken. Der User will, dass sich etwas bewegt – im positiven Sinne.

Gibt es besondere Grafikregeln, die jeder als schön empfindet oder lohnt sich eine genaue Zielgruppenanalyse?

Andrej: In erster Linie muss die Webseite die Marke wiederspiegeln – hier geht es dann um eine möglichst exakte Wiedergabe des Corporate Designs und der Corporate Identity. Insofern ist man als Grafiker im Hinblick auf Unternehmensfarben oder Logoverwendung in der Regel schon im Vorhinein festgelegt.

Eine Zielgruppenanalyse lohnt sich in jedem Fall. Von Zielgruppe zu Zielgruppe können sich die Erwartungen, der technische Wissensstand und die Ziele beim Besuch einer Website doch sehr stark unterscheiden. Dem sollte das Webdesign Rechnung tragen. Es sollte jeder für das Unternehmen relevanten Zielgruppe passende gestalterische Lösungen anbieten und sie bei der Interaktion mit der Website unterstützend begleiten.

Farben erzeugen immer auch Emotionen – wie kann ich das als Unternehmen für mich einsetzen?

Jede Farbe hat eine bestimme emotionelle Wirkung. Je nachdem welche Absichten gewünscht sind, können Farben ein zielgerichtetes emotionales Bild der Marke bzw. des Unternehmens steuern. Aufgrund der Farbpsychologie weiß man, dass Blau beispielsweise die Produktivität fördert und von Männern als sehr angenehm erachtet wird. Orange steht für Enthusiasmus und regt psychologisch gesehen zum Kaufen oder Anmelden an.

Wichtig ist aber auch immer die Kombination der Farben: Nehmen wir beispielsweise die Farbe Schwarz. Schwarz kann je nach Umgebungskontext als Hintergrund geheimnisvoll oder auch elegant wirken – häufig aber auch schwer und drückend.

Gibt es auch einen Trend bei Bildern oder Bildgrößen?

Andrej: Im Trend liegen unter anderem voll- bzw. großflächige Bilder sowie Videos, die die gesamte Seitenbreite einnehmen. Designtechnisch werden die meisten Seiten immer noch im Flat Design programmiert, wobei ein großes Augenmerk auf Call-to-Action-Elementen oder Motion- bzw Scrolling-Elementen liegt, die sich beispielsweise einblenden, wenn der Kunde sich länger mit dem Inhalt einer Seite beschäftigt. Die Idee hierbei ist, dass eine hohe Verweildauer ein Indikator dafür ist, dass der Inhalt einer Seite als relevant empfunden wird und Nutzer in so einem Fall eher dafür bereit sind, auf einen Shop-Link zu klicken oder einen Newsletter zu abonnieren.

Jede Website sollte im Idealfall ein spezifisches Ziel verfolgen: zum Kaufen animieren, Vertrauen schaffen oder Kundeninteraktion fördern. Wie wichtig ist hierbei das Design der Call-to-Action-Elemente?

Andrej: Call-to-Action-Elemente sollten sich grundsätzlich vom umliegenden Inhalt abheben. Nicht nur visuell durch eine kontrastreiche Hinterlegung. Textlich sollte der CTA ebenso attraktiv wie leicht verständlich gestaltet werden. In der Kürze liegt die Würze. Maximal 4 Wörter und klare Handlungsaufforderungen funktionieren sehr gut – wie etwa: „Jetzt gratis anfordern“ – „Termin vereinbaren“ – „Kostenlos testen“ 

Angenommen ich plane als Kunde eine neue Website – welche Designelemente sollte ich heute schon verwenden und welche Trends definitiv nicht aus den Augen verlieren, um für Morgen up to date zu sein?

Hier lohnt sich definitiv ein Blick auf das neue Material Design, das Google auf einer seiner Entwickler-Konferenzen präsentiert hat. Es sieht auf den ersten Blick aus wie herkömmliches Flat Design, das in den letzten Jahren in der UI-Szene eingesetzt wurde.

Auch beim Material Design spielen Icons und Schriftarten eine tragende Rolle, außerdem kommen großflächige, einfarbige Elemente zum Einsatz – gemischt mit kontrastreichen und sehr bunten Farben. Im Gegensatz zum klassischen Flat-Design verfügen die Elemente allerdings nicht nur über eine X- und Y-Koordinate auf dem Bildschirm, sondern auch über eine Z-Koordinate, also einen dreidimensionalen Faktor. Somit ist ein Schattenspiel möglich sowie Überlagerung – es ist also gar nicht mehr so flat. Und das Bedienen wird einfacher und intuitiver.

7 kostenlose Tools für mehr Traffic

7 kostenlose Tools für mehr
Unsere erfolgreichsten Growth Hacking Tools:
✓ Soforthilfe für mehr Traffic
✓ alle Tools bei uns erfolgreich im Einsatz
✓ was sie können u. wie Sie sie verwenden
✓ Fakten und Tipps zur Traffic-Optimierung

 

Kommentare

[js-disqus]
бесплатное создание сайтов продвижениемагазин посуды спбсоздание и раскрутка сайтовтенденции макияжа осень зима 2017новая почта отследить по мируrussia destinations