Website gestalten: was Farbe kann

Die Farbgestaltung sollte auf kommerziellen Websites nicht beliebig sein, sondern eingebunden in das jeweilige Marketingziel. Dazu sollte man sich bewusst machen, welche Funktion die Farbe auf der Website hat. Drei wichtige Funktionen stellt dieser Blogbeitrag vor: akzentuieren, profilieren und emotionalisieren, wobei es gerade beim Einfluss auf Emotionen wichtig ist, nicht einfach irgendwelchen Klischees zu folgen.

Hier ein wenig Blau, da ein wenig Rot. Dem Seitenbetreiber gefällt es und das wars. Wie sich die Farbwahl auf das Besucherverhalten auswirkt – wer weiß das schon? Bei kommerziellen Websites sollte aber immer die Frage mitschwingen: Trägt diese Farbe an dieser Stelle der Internetseite dazu bei, dass die Conversion-Rate steigt?

Schon besser wäre es, wenn getestet würde, ob die Farbgestaltung dazu beiträgt, dass der Besucher gern auf der Seite bleibt, sich zurechtfindet und wunschgemäß handelt. Aber dann läge dem Test immer noch keine Idee zugrunde.

Effektiv wird die Sache, wenn man Hypothesen entwickelt, wie man mit kluger Farbauswahl und -platzierung die Conversion-Rate steigert und dann durch Tests schaut, ob die Hypothese wahr ist. Nur dann führen die Tests auch zu einem Erkenntnisgewinn, auf dem man neue Tests aufbauen kann, um den Erfolg der Website nachhaltig auf einer soliden Basis zu steigern.

Um Ideen für eine effektive Farbgestaltung zu gewinnen, sollte man sich bewusst machen, welche Funktion Farbe auf einer Website haben kann. Wir haben drei herausgepickt:

Farbe kann… akzentuieren

Farbe kann ansonsten eher unauffällige Elemente hervorheben, um die Aufmerksamkeit der Besucher auf sie zu lenken.

So dominieren auf einer Landingpage von Swiss Life zum Thema Altersvorsorge Schwarz und Weiß, so dass die wenigen rot gefärbten Elemente herausstechen. Alle rot gefärbten oder hinterlegten Elemente enthalten wichtige Informationen:

Rechts oben weist das Logo farbig auf den Anbieter hin. Links im Menü ist das Wort „Altersvorsorge“ eingefärbt. Das beantwortet die Frage: Wer bietet hier was an?

Finanzberatung ist das Ziel der Landingpage, deren Besucher sich für eine Beratung zum Thema „Altersvorsorge“ entscheiden sollen. Aus diesem Grund macht es Sinn, dass „Finanzberatung“ ebenso wie der Button „Beratungsanfrage“ rot ist.

Zusätzlich sind die kleinen Kästen mit den Häkchen in der Liste rot und lenken den Blick auf die wesentlichen Unterthemen, die eine Beratung zum Thema umfassen kann. Folgt der Besucher dem Rot auf der Seite, erfasst er also die wichtigsten Infos sehr schnell.

Das Beispiel der Landingpage zeigt zweierlei:

• Jede Farbe sollte man aus einem bestimmten Grund einsetzen
• Je weniger bunt die gesamte Website ist, desto mehr Chancen auf Aufmerksamkeit haben Farbakzente.

Farbe kann… profilieren

Farbe kann in Onlineshops auch dafür sorgen, dass Besucher bestimmte Elemente sofort wiedererkennen – etwa Rabattbuttons.

Das Unternehmen Roller hat beispielsweise auf seiner Website den Hinweis auf Preisknüller blau eingefärbt und hebt ihn so vom ansonsten dominierenden Rot ab. So sorgt das Unternehmen auch dafür, dass sich der Hinweis auf preislich besonders attraktive Produkte besser vom Hinweis auf TV-Knüller abhebt, der in der Form (Stern) exakt gleich ist.

In der Regel lernen Besucher schnell: Blauer Stern = Preisknüller. Für eine schnelle Orientierung ist das gut. Und Websites, die für eine schnelle Orientierung sorgen, haben meistens Vorteile beim Kampf um hohe Conversion-Raten.

Farbe kann… emotionalisieren

Ist für diejenigen, die mit Google nach „Wellness in Hamburg“ suchen, eine eher kühle oder eher warme Farbgebung einer Website attraktiver? Geht es ihnen um ein erfrischendes Bad oder um die heiße Sauna?

Das Beispiel Wellness zeigt schnell, dass die Farbgestaltung einer Website eine unmittelbare Wirkung auf den Besucher hat und dass man bei ein- und demselben aktuellen Bedürfnis potenzieller Kunden durchaus unterschiedliche Farbstrategien fahren kann. Welche Variante mehr Erfolg verspricht, kann man nur mit Tests herausfinden.

Hier fühle ich mich wohl. Oder nicht.

Letztlich geht es bei der Farbgestaltung auch darum, dass sich der jeweilige Besucher auf der Website wohlfühlt. Wer bei Wellness an ein erfrischendes Bad denkt, wird sich bei einem kühlen Blau auf einer Website möglicherweise besser angekommen fühlen als bei einem warmen Orange.

Und nicht nur bei Wellness kann die emotionale Wirkung einer Farbe entscheidend sein: Ein Modeshop mit Pastellfarben wirkt anders als einer mit kräftigen Farben und er sorgt vermutlich auch dafür, dass sich andere Menschen spontan richtig angekommen fühlen.

Spätestens hier wird auch deutlich, dass es bei Farbgestaltung auf Websites nie allein um die Farbe eines einzelnen Elements geht. Man kann natürlich testen, ob ein knallroter Call-to-Action-Button für eine höhere Conversion-Rate sorgt als ein blassgrüner. Allerdings sollte man sich dabei stets bewusst sein, dass die Ergebnisse immer auch von den Farben der Umgebung abhängen und davon, wie gut das Element dort hineinpasst.

Auch Fotos sind Farbelemente

Auch Fotos können nicht nur mit dem Motiv, sondern auch mit ihren Farben zum Gesamteindruck einer Internetseite beitragen. Bisweilen vergisst man das; dann zerstören Fotos im ungünstigsten Fall die Harmonie. Dieses Risiko steigt, wenn Slider einen Bildwechsel initiieren.

Vorsicht vor Küchentisch-Farbpsychologie

Natürlich macht es Sinn, sich ein bisschen mit Farbpsychologie auseinanderzusetzen. Man darf nur nicht glauben, dass Verallgemeinerungen wie „Rot steht für Leidenschaft, Schwarz für Trauer…“ universell zutreffen- zumal es bei jeder Farbe eine Vielzahl an Farbtönen gibt, die nicht alle dieselbe Wirkung haben.

Die Farbgestaltung muss zur Website passen

Noch ein Punkt ist wichtig: Darf (sollte?) die Website eines Schmuck verkaufenden Onlineshops so bunt sein wie die eines Online-Spielzeughandels? Spontan würde man sagen: eher nicht. Die Ansicht ist wahrscheinlich nicht verkehrt.

Allerdings gibt es verschiedene Arten von Schmuck und Modeschmuck kann eventuell mehr Buntheit auf der Website vertragen als ein lupenreiner Diamant. Die Wirkung einer Farbe hängt auch von den sie umgebenden Farben ab sowie von den Erwartungen, die Besucher bei Websites einer bestimmten Branche an die Gestaltung haben.

Wie so oft könnte das Geheimnis von Erfolg darin liegen, solche Erwartungen weitgehend zu erfüllen und gleichzeitig für leichte Irritationen zu sorgen, weil man manchmal anderes als das Erwartete präsentiert. Vielleicht sollte man genau das im Hinterkopf haben, wenn man sich darüber Gedanken macht, wie kluge Farbgestaltung zur gelungenen Conversion-Optimierung beiträgt.