Farben im Webdesign als Bestandteil Deiner SEO-Strategie

Auch wenn Farben im Webdesign selbst kein offizieller Rankingfaktor sind, lohnt es sich dennoch über den Zusammenhang zwischen Farbenspiel und SEO nachzudenken. Schließlich geht es bei der Suchmaschinenoptimierung heute darum, eine perfekte User Experience zu schaffen. Und an dieser Stelle wird die Farbe wieder wichtig.

Abbildung 1: Auf diesem Website-Design von Hitron dominieren Kontraste und sorgen für Aufmerksamkeit beim Nutzer. Schwarz sorgt für Seriosität, Gelb regt Glücksgefühle an.

Warum Farben im Webdesign wichtig sind

Farben haben unabhängig vom Webdesign immer eine psychologische Wirkung. Damit lösen Sie eine Reaktion beim Betrachter aus. Das hat schon die Natur so eingerichtet. So wissen Fressfeinde zum Beispiel bei gelb-schwarz gefärbten Wespen sofort: "Hier muss ich aufpassen". Gleiches gilt für leuchtend-rote Früchte oder auffällig gemusterte Insekten.

In unserer Umwelt begegnen wir täglich Farben und den unterschiedlichsten Farbkombinationen. Wir reagieren darauf, Farben beeinflussen unsere Stimmung und unser Verhalten, und letztlich natürlich auch unser Kaufverhalten. Ein "roter Preis" im Supermarkt beispielsweise fällt ins Auge und lockt zum Zugreifen. Deshalb liegt es also nahe, dass Du auch beim Webdesign sorgfältig auf Deine Farbwahl achten solltest.

Der Sinn von Farben im Webdesign kann dabei auf drei zentrale Aspekte reduziert werden:

1. Vertrauensbildung: Wird eine Website in einem einheitlichen Corporate Design gestaltet, besitzt sie langfristig einen höheren Wiedererkennungswert für ihre Nutzer. Dieser Wiedererkennungswert wiederum erhöht den Trust der Seite. Somit kannst Du die Verweildauer steigern und eine niedrigere Absprungrate erreichen.

Abbildung 2: Dieses Design von DSKY fügt sich lückenlos ins Corporate Design des Unternehmens ein.

2. Usability: Selbstverständlich kannst Du Deine Webseite in allen Farben des Regenbogens gestalten. Doch auch eine noch so schicke Schrift in Grau bringt Dir nicht viel, wenn Deine Nutzer sie nur schwer lesen können. Gleiches gilt für Deine Hintergründe. Vielleicht ist ein knalliges Orange ja in der Planung ganz interessant gewesen. Doch der leicht psychedelische Effekt führt langfristig wohl eher nicht zu zufriedeneren Nutzern. Stattdessen wäre zum Beispiel sinnvoller, wenn Call-to-Action-Elemente durch Kontraste hervorgehoben werden oder sich das Navigationsmenü farblich so vom Hintergrund abhebt, dass Deine Nutzer sofort wissen, wo sie hinwollen.

Abbildung 3: Bei diesem Design von theink3dskull sind die Call-to-Action-Buttons dank der knallroten Farbe nicht zu übersehen.

3. Konsumentensteuerung: Die Farbpsychologie ist ein wichtiger Bestandteil des Webdesigns. Dabei spielen verschiedene Faktoren eine Rolle. So solltest Du Dich zunächst fragen, welche Stimmung Deine Webseite ausstrahlen soll. Mindestens ebenso wichtig ist Deine Zielgruppe, denn letztlich haben wir in unterschiedlichen Altersphasen auch verschiedene Farbpräferenzen. Was in jungen Jahren noch genau richtig war, ist für ältere Nutzer vielleicht zu aufdringlich.

Abbildung 4: Das Design von eeeh_aarrh passt perfekt zur jungen, dynamischen Zielgruppe dieses Unternehmens.

Erhöhen sich durch eine gezielte Farbwahl Trust und Usability, sollten in logischer Konsequenz auch Conversions und Leads steigen. Aus SEO-Sicht wäre an dieser Stelle schon geklärt, warum Farben im Webdesign wichtig sind. Wenn Farben schließlich die User Experience verbessern, erhalten auch Suchmaschinen wie Google positive Nutzersignale. Ein weiterer perfekter Nebeneffekt einer sinnvollen Farbwahl.

Hands-On: Worauf bei der Farbwahl geachtet werden sollte

Wirkung der Farben berücksichtigen:

Wähle Farben gemäß der Wirkung aus, die Du damit erzielen möchtest. So gilt zum Beispiel Rot als aktivierende Farbe, die Aufmerksamkeit erregt, während mit Blau eher Ruhe und Kompetenz ausgestrahlt wird. Zugleich solltest Du bei der Farbwahl auch Nuancierungen von Farben und deren Auswirkung auf die Psyche des Empfängers berücksichtigen. Ein gutes Beispiel ist Lila. Als dunkler Farbton wird mit Lila überwiegend Luxus und Wohlstand assoziiert. Verwendest Du jedoch zarte Lilatöne, schwingen Romantik und frühlingshafte Leichtigkeit mit.

Eine besondere Farbe oder "Nicht-Farbe" hingegen ist Schwarz. Klassischerweise wird Schwarz für Schriften gewählt. Wird sie für das Webdesign verwendet, ist vor allem die damit kombinierte Farbe für die Wirkung von Schwarz entscheidend. Von elegant bis traditionell sind hier alle Möglichkeiten offen.

Dieser Beitrag soll Dir lediglich eine Anregung geben, bei der Farbwahl mehr auf die Wirkung zu achten. Eine erschöpfende Auflistung von Farben und Wirkungen würde den Rahmen dieses Beitrags sprengen. Eine praktische Übersicht über die Wirkung von Farben findest du zum Beispiel hier.

Abbildung 5: Durch die Wahl der Blautöne in diesem Design von Aneley wirkt die Website professionell, kühl und modern.

Harmonisches Zusammenspiel oder Kontraste wählen:

Ob Farben ineinander übergehen oder komplementär zueinander stehen, ist beim Webdesign auch eine Frage des Ortes, an welchem die Farben verwendet werden. So sind Kontraste zum Beispiel für das Design von Schaltflächen oder Call-to-Action-Buttons wichtig. Gleiches gilt für Schriften und Hintergründe. Verläufe wiederum können das harmonische Gesamtbild der Webseite stärken und sich wiederum auf die Gefühlswelt des Konsumenten auswirken. Grundsätzlich entscheidest Du damit, wie gut sich die Webseite nutzen lässt.

Abbildung 6: Dieses Design von Iconic Graphics setzt farbliche Akzente an den richtigen Stellen. Dennoch ergibt sich ein harmonisches Gesamtbild.

Nicht zu bunt und nicht zu trist designen:

Allgemein sollte Deine Webseite nicht zu bunt werden. Sonst kann sie schnell unseriös wirken. Das wäre zum Beispiel der Fall, wenn Du möglichst viele Farben kombinierst, um von deren psychologischer Wirkung zu profitieren. Doch viel hilft beim Webdesign ohnehin nicht viel.

Achte ebenfalls darauf, dass die Seite nicht zu trist wirkt. Verwendest Du zum Beispiel nur Blau oder zu viel Blau, kann Deine Seite schnell kühl oder langweilig wirken.

Denke auch an Bilder, Grafiken und Formen:

Farben sind nicht alles im Webdesign. Berücksichtige neben der Farbe deshalb natürlich auch Formen, Grafiken oder Bilder, die das Gesamtbild Deiner Webseite prägen.

Abbildung 7: In diesem Design von Sarah Studio ergibt sich ein Zusammenspiel von Farben und Formen.

Corporate Design beachten:

Wenn Du bereits ein Corporate Design verwendest, sollte dieses auch auf Deiner Webseite wiederzufinden sein. Verwende deshalb unbedingt Deine Brand-Farben, die schon definiert sind. Schließlich spielt der Wiedererkennungswert bei der Werbewirksamkeit sowie beim Trust eine wichtige Rolle. Auf diesen Effekt solltest Du nicht verzichten.

Grundsätzlich bietet es sich an, verschiedene Farbversionen zu testen. Entsprechende Content- und Designtests kannst Du zum Beispiel mit Hilfe von Google Analytics durchführen. In deinem Google Analytics-Konto kannst du unter "Tests" die zu testenden Varianten Deiner Seite einrichten. Wichtig dabei ist, dass die Testbedingungen genau definiert werden. Gleiches gilt für mögliche Ziele, die mit einem A/B-Testing erreicht werden sollen. Deine Tests müssen außerdem nicht die gesamte Farbgebung Deiner Seite betreffen. Sinnvoll kann zum Beispiel ein gezielter Farbtest in wichtigen Bereichen wie dem Bestellprozess oder der Produktpräsentation sein.

Fazit: Auf das Zusammenspiel kommt es an

Bei aller Wichtigkeit der Farbpsychologie für Deine SEO-Erfolge solltest Du das Webdesign jedoch niemals isoliert betrachten. Eine überlegte und sinnvolle Farbwahl allein hat noch keine positiven SEO-Effekte. Denn letztlich ist die Farbe nur eine Stellschraube von vielen, um Usability und Trust zu erhöhen.

Kurz gesagt: Wenn Du exzellente Inhalte sowie eine technisch einwandfreie und mobil optimierte Webseite betreibst, wird sie auch als Schwarz-Weiß-Version funktionieren und vermutlich einige gute Rankings erzielen. Ebenso wird eine schnell ladende Webseite mit einzigartigen Inhalten und Mehrwert besser ranken als eine Webseite mit schlechtem Content. Dabei spielt die Farbe der jeweiligen Seiten sicherlich eine untergeordnete Rolle.

Wenn Deine Seite jedoch bereits viel Traffic generiert und Du nun die Feinheiten berücksichtigst, kann ein Test mit verschiedenen Farbdesigns Aufschluss über Optimierungspotential geben. Vielleicht sind es im Vergleich zu Deinen Mitbewerbern letztlich auch Deine Farben, die den entscheidenden Unterschied ausmachen und mehr Konsumenten binden.

Halten wir fest: Farben im Webdesign sind kein Rankingbooster. Eine schlechte Webseite mit tollen Farben bleibt eine schlechte Webseite. Wenn Du allerdings nach Möglichkeiten suchst, um den Trust und die User Experience Deiner Seite dauerhaft zu erhöhen, bietet das Webdesign vor allem bei den Farben viele Ansatzmöglichkeiten. Im Zuge einer holistischen Suchmaschinenoptimierung im Sinne einer Search Experience Optimization ist die Farbauswahl dann letztlich doch ein wichtiger Aspekt, der nicht vernachlässigt werden sollte. Deshalb verschenke kein Optimierungspotential und gib Deinen Farben den letzten Schliff!