Farben im Webdesign richtig einsetzen

Kategorie: Internet Tipps

Neben den Texten sind auch die Farben einer Website maßgeblich für den Erfolg bzw. Misserfolg einer Internetpräsenz verantwortlich. Die einzelnen Farben haben unterschiedliche psychologische Wirkungen auf die User und sollten daher sorgfältig und für die jeweilige Firma passend ausgewählt werden. Es kommt darauf an, die Farben im Webdesign so einzusetzen, dass sie die gewünschten Emotionen auslösen.
Farbschema Webdesign

Inhalt

Farbkombinationen

Es gibt Farben, die besonders gut harmonieren und die richtig miteinander kombiniert zu einer gelungen Website beitragen. Diese Farbkombinationen können auf verschiedene Arten ermittelt werden.

Beim analogen Farbschema werden ähnliche Farbtöne miteinander kombiniert und die Abweichungen zwischen den Farbtönen sind sehr gering.

Das komplementäre Farbschema fügt dagegen genau gegensätzliche Farbtöne zusammen. Trotz dieser Gegensätzlichkeit wirken die Farben im Zusammenspiel harmonisch.

Durch das Programm Paletton – The Color Scheme Designer können sowohl analoge als auch komplementäre Farbschemata ermittelt werden. Hierzu muss nur der Hexadezimal-Code der Grundfarbe eingegeben werden und dann wird ein komplettes Farbschema berechnet. Gestartet wird das Programm, indem man im Eingabefeld Base RGB: unten links den Farbcode eingibt.

Farbkontraste zur Hervorhebung

Bestimmte Elemente der Website, wie der Senden-Button eines Kontaktformulars oder der Kaufen-Button in einem Onlineshop sollen besonders häufig angeklickt werden. Um dies zu erreichen, sollte man diese Elemente farblich vom Layout der übrigen Seite abheben. Sind diese Buttons in ähnlichen Farbtönen wie der Rest der Website gehalten, werden sie mangels Unterscheidbarkeit kaum angeklickt. Werden dagegen Komplementärfarben verwendet, die sich deutlich vom Rest des Layouts abheben, werden mehr Anfragen getätigt bzw. mehr Produkte gekauft.

Für diese Website ist es daher besser einen Button in der Komplementärfarbe grün einzubauen, statt den Button in der orangenen Grundfarbe der Internetseite zu gestalten.

Rot

Mit der Farbe Rot können sowohl positive als auch negative Emotionen ausgelöst werden. Rot steht für Lust und Liebe aber auch für Wut und Gefahr. Daher sollte man diese Farbe im Webdesign nur sehr sparsam einsetzen, um negative psychologische Wirkungen zu vermeiden. Rot sollte nicht großflächig, sondern nur punktuell auf der Website eingesetzt werden. So können beispielsweise besonders wichtige Punkte durch Rot hervorgehoben werden. Weil Rot für Verbote steht und gleichzeitig auch noch eine warme Farbe ist, kann es sehr viele Emotionen auslösen und bei zu großzügiger Anwendung einen kontraproduktiven Effekt auf den Erfolg der Website haben.

Rot
#FF0000
Dunkelrot
#8B0000
Hellrot
#F08080

Um die negativen Effekte, die die Farbe Rot hervorruft zu umgehen, kann auf Dunkelrot oder Hellrot ausgewichen werden, diese Farben wirken etwas weniger aggressiv und werden von den meisten Usern positiver wahrgenommen.

Grün

Der große Vorteil, der Farbe Grün ist, dass es sich um eine neutrale Farbe handelt, die weder warm (Rot) noch kalt (Blau) wirkt. Daher vermittelt ein grüner Farbton Ruhe und Entspannung. Außerdem gilt Grün als die Farbe der Hoffnung. Weil Grün mit Natur verbunden wird, ist diese Farbe besonders gut für Unternehmen geeignet, die Naturprodukte verkaufen, sich mit der Umwelt beschäftigen oder Reisen ins Grüne anbieten. Weniger gut eignet sich Grün für Unternehmen, die technische Produkte ohne Bezug zum Umweltschutz herstellen.

Grün
#008000
Dunkelgrün
#006400
Olivgrün
#808000
Gelbgrün
#9ACD32

Blau

Blau wird mit Zuverlässigkeit, Vertrauen und Sicherheit assoziiert. Daher ist Blau auch die bevorzugte Farbe von Banken oder Versicherungen. Blau ist eine kalte Farbe und sollte daher ebenso wie die warme Farbe Rot nicht im Übermaß eingesetzt werden. Außerdem wird Blau auch mit Männlichkeit verbunden und sollte nicht verwendet werden, wenn es sich um spezifisch weibliche Produkte handelt. Helles Blau kann eine aktivierende Wirkung haben, während die dunklen Blautöne eher für Beständigkeit und Kraft stehen.

Blau
#0000FF
Königsblau
#4169E1
Himmelblau
#87CEEB
Hellblau
#ADD8E6

Gelb

Gelb gilt als positive und freundliche Farbe und wird mit Freude und Optimismus verbunden, hat aber auch negative Wirkungen und kann mit Neid und Warnungen gleichgesetzt werden. Wegen dieser doppelten Wirkung sollte Gelb mit Vorsicht eingesetzt werden. Starke Gelbtöne sollte eher vermieden werden, während man mattere Gelbtöne auch häufiger einsetzen kann. Durch Gelb kann Aufmerksamkeit erregt und zu Handlungen animiert werden, sofern der Einsatz dieser Farbe nicht übertrieben wird.

Gelb
#FFFF00
Gold
#FFD700
Khaki
#F0E68C
Hellgelb
#FFFFE0

Orange

Orange vermittelt Energie und Spaß, erregt Aufmerksamkeit und steht für Kreativität. Daher benutzen viele Firmen aus der Meidenbranche diese Farbe als ihre Unternehmensfarbe. Reines Orange wirkt allerdings oft zu aufdringlich, daher sollten eher mattere oder hellere Orangetöne verwendet werden, um das Auge des Betrachters nicht zu überfordern. Es muss verstärkt darauf geachtet werden, Orange nicht zu großflächig einzusetzen, damit die Website nicht zu unseriös aussieht.

Orange
#FFA500
Dunkelorange
#FF8C00
Hellorange
#FF7F50

Grau

Grau gilt als zeitlos, elegant und seriös, wird aber auch mit Langeweile in Verbindung gebracht. Für geschäftliche Websites oder sehr textlastige und informative Internetseiten ist grau gut geeignet, weil der Text und nicht die Designelemente im Mittelpunkt stehen sollen. Soll dagegen Aufmerksamkeit erregt oder eine aktivierende Wirkung erzielt werden, ist Grau die falsche Wahl. Als neutraler Farbton gilt grau als Kompromisslösung, wenn die Farbe eher im Hintergrund stehen und einen ausgleichenden Effekt haben soll.

Grau
#808080
Dunkelgrau
#A9A9A9
Silber
#C0C0C0
Hellgrau
#D3D3D3

Verwandte Beiträge

Storytelling Einführung – Erfolg durch emotionale Geschichten

Beim Storytelling handelt es sich um eine Erzählmethode, bei der Botschaften bzw. Informationen durch möglichst emotionale und anschauliche Geschichten vermittelt werden. Die Aussagen sollen durch eine persönliche Bindung zwischen den

SEO DIVER – kostenloses Toolset zur Suchmaschinenoptimierung

Um die eigene Homepage für Suchmaschinen zu optimieren und somit ein besseres Ranking bei GOOGLE zu erreichen, gibt es zahlreiche Tools, die dafür nützlich sind und die Suchmaschinenoptimierung der eigenen

Tipps für die richtige Website-Navigation

Die Navigation ist die Grundlage jeder Internetseite. Sie sorgt dafür, dass sich der User auf der Seite zurechfindet und die von ihm gewünschten Informationen schnell findet. Um diese Funktionalität gewährleisten

Was muss bei Schriften im Web beachtet werden?

Schriften im Web sollten gut lesbar sein und zum Layout der Webseite passen. Ist die Schriftart optimal gewählt, können die Informationen besser vermittelt und somit die Besucher zufriedengestellt werden. Gute

Richtig suchen mit Google

Der durchschnitttliche User im Internet verbringt viel Zeit damit nach verschiedene Begriffe zu googeln, um detailliertere Informationen zu den Suchbegriffen zu erhalten. Dazu werden meist nur einzelne oder mehrere Suchbegriffe