Schaffen Sie mithilfe von Farbkontrasten eine bessere User Experience

Contrast Ratio der mindtwo Corporate Design Branding Farben

Farben sind Appelle auf der eigenen Webseite. Sie können lebendig und atemberaubend sein oder beruhigend und entspannend. Damit das Benutzererlebnis die richtige Wirkung entfalten kann – primär die Verweildauer auf der Seite erhöhen oder eine gewünschte Handlung ausführen – ist es wichtig, die richtigen Farben auszuwählen. Im Fokus der Farbnutzung steht als oberstes Ziel, Ihre Kunden bei der Informationssuche zu unterstützen.

Die besten Seiten kombinieren schöne Farben mit der Benutzerfreundlichkeit und kreieren eine Benutzererfahrung, die clever ist, gleichzeitig rücksichtsvoll die Interessen der Besucher beachtet und eine hohe Qualität bei der Navigation auf der Webseite integriert. Jeder Designer einer Webseite kann diese Fähigkeiten erlangen, wofür jedoch ein grundlegendes Verständnis des Farbdesigns erforderlich ist.

Starke Navigation: Einfache Suche in Kategorien durch farbliche Gestaltung

Eine der herausforderndsten Aspekte für eine gute Benutzererfahrung ist die Suche nach speziellen Inhalten, besonders bei Newsseiten, die permanent schnell und scheinbar chaotisch aktualisiert werden. Viele Unterseiten erschweren für den Besucher das richtige zu finden, wenn benutzte Farben keine ersichtliche Kategorisierung der Inhalte aufweisen. Die Seitenbesucher sind unzufrieden und verlassen relativ schnell wieder die Webseite. Eine negative Bounce-Rate (Wie lange der Besucher auf der Webseite verweilte) kann zu schlechteren Platzierungen in Suchmaschinen führen.

Das ist sicherlich nicht das gewünschte Ergebnis Ihrer Onlineaktivitäten. Um beim Beispiel einer News-Seite zu bleiben, ist eine Voraussetzung seine Leser zu verstehen und sie mithilfe farblicher Kategorien zu lenken. Bei der farblichen Gestaltung gibt es verschiedene Möglichkeiten:

  • Das monochrome Farbdesign verwendet eine Grundfarbe und verschiedene Abstufungen dieser Farbe (Beispielsweise Rot und diverse Rottöne)
  • Beim analogen Farbschema werden Farben, die im Farbkreis nebeneinander liegen, verwendet
  • Das komplementäre Farbschema benutzt Farben, die gegenüber im Farbkreis zu finden sind
  • Um eine hohe Unterscheidung bei der Erkennbarkeit zu kreieren, können mithilfe des triadischen Farbschemas drei Farben Verwendung finden. Diese sind alle drei gleichweit auf dem Farbkreis voneinander entfernt

Bei Benutzung des komplementären Farbschemas (gegenüberliegende Farben) können Kategorien höchst sichtbar unterschieden werden, sodass die Besucher schnell, effizient und einfach durch die Webseite navigieren können. Möchten Sie beispielsweise als Hintergrund einen Blauton einsetzen, bietet sich ein gelblich-bräunlicher Schriftzug an, da diese Farben genau gegenüber auf dem Farbkreis zu finden sind.

Sorgen Sie für eine visuelle Hierarchie

Eines der mittlerweile wichtigsten Designkonzepte ist das der visuellen Hierarchie. Besucher lesen eine Webseite nicht wie ein Buch. In unserem Kulturkreis herrscht von oben nach unten und von links nach rechts. Im Web kann die Benutzererfahrung Ihrer Kunden positiv gesteigert werden, wenn bekannt ist wie Besucher lesen und wo sie wann hinschauen. Verschiedene Elemente konkurrieren um die Aufmerksamkeit der Leser. Mit den Kenntnissen der Lesegewohnheiten und einer klugen Farbgestaltung sowie einem intelligenten Spiel mit der Größe stellen Sie sicher, dass Ihre Besucher das wichtigste zuerst aufnehmen. Es beginnt eine wechselwirkende Interaktion.

Die Benutzung verschiedener Farbkonzepte kann die Aufmerksamkeitshierarchie stark unterstützen oder massiv behindern. Der Designer muss sich Gedanken über das Interesse der Leser machen, um ihn beim Finden der gewünschten Informationen zu unterstützen. Sind interaktive Elemente hervorzuheben, kann der Benutzer der Webseite durch Zuhilfenahme einer Sekundärfarbe eine klare Handlungsanweisung für sich erkennen.

Das F-Muster

Bei Artikeln oder Blog-Post scannt der Leser die linke Seite nach interessanten Schlüsselwörtern oder hervorgehobenen Texten wie Überschriften ab. Findet er etwas, dass seine Aufmerksamkeit erregt, liest er nach rechts weiter und prüft, ob er interessante Informationen entnehmen kann. Diese Leseart bildet ein F-Muster oder ein Schema mit vielen, häufig abnehmenden Querlinien. Nutzen Sie dieses Schema, um längere Textblöcke mithilfe von fetter Hervorhebung, Aufzählungszeichen oder dezent benutzter farblicher Markierung aufzubrechen.

Das Z-Muster

Leser benutzen das Z-Muster zum Überfliegen einer Webseite, die nicht mit linearem Text gestaltet ist. Etwa bei Anzeigen oder stärker durch Bilder gewichtete Seiten scannt der Leser den obersten Teil, dann geht sein Blick diagonal nach links unten und liest dann wieder quer nach rechts. Die wichtigsten Elemente sollten hier auf diesen Linien platziert und durch entsprechende Farben hervorgehoben werden.

Klarheit bei der internen Suche schaffen

Auch wenn die Webseiten-Besucher alles auf Ihrer Webseite finden können, unterstützt eine klar organisierte und lesbare Suchergebnisseite die Benutzererfahrung. Damit die Suchergebnisseite nicht nutzlos ist, ist es bedeutend, dass die Leser den Sinn der Ergebnisse schnell erfassen können. Ein Problem könnte eine hohe Zahl an Suchergebnissen sein, sodass möglicherweise die schiere Menge Chaos oder Verwirrung beim Benutzer der Webseite stiftet.

Die Lösung ist ein klug durchdachtes Farbdesign. Eine unterschiedliche farbliche Gestaltung der Ergebnisse unterstützt den Leser, diese schneller zu verarbeiten. Gleichzeitig werden die Ergebnisse lebendiger und es kann das wichtigste farblich hervorgehoben werden. Beispielsweise auf einer Buchungsseite kann der Ort eine Farbe erhalten, Kundenbewertung eine zweite und der Buchungsbutton eine dritte Farbe.

Keine Farben nur aus Gestaltungsgründen benutzen

Ein Künstler verwendet möglicherweise für ein Bild viele Farben, um zu gestalten oder etwas zum Ausdruck zu bringen. Im Design einer Webseite sollten Farben die Benutzererfahrung verbessern und eine Kundenbeziehung aufbauen. Farben unterliegen dabei einem höheren Zweck. Fragen Sie sich, ob eine Farbe eine andere besser hervorhebt? Kann eine Farbkombination das Besuchserlebnis der Webseite angenehmer gestalten? Verhindert ein organisiertes Farbschema einen schnellen Absprung des Benutzers? Stellen Sie sich diese Fragen und Sie sind auf dem Weg, Ihren Kunden das bestmögliche Erlebnis auf Ihren Seiten zu erschaffen.

Sie sind auf der Suche nach einer Agentur für User Experience? Dann würden wir uns über Ihre Kontaktaufnahme sehr freuen.