Logo Tipps & Tricks

Wie Sie die Farben für Ihre Homepage wählen

Wenn Sie Ihre Homepage gestalten, spielen die Farben eine wichtige Rolle. Einerseits haben Sie ein Corporate Design oder ein Logo, auf die Sie Ihre Homepage abstimmen wollen. Andererseits wollen Sie mit den Farben bestimmte Aussagen machen. Blau, beispielsweise, symbolisiert oft den Himmel, gilt aber auch als kühle Farbe. Rot dagegen steht sowohl für Liebe, wie auch für Aggressivität. Gelb wiederum kann sowohl für die Sonne, für Gold, aber auch für Neid und Gier stehen. Und grün steht für saftige Wiesen und die Hoffnung.

Das menschliche Auge kann grundsätzlich 3 verschiedene Farben unterscheiden: Rot, grün und blau. Mehr zum Aufbau des menschlichen Auges erfahren Sie in diesem Wikipedia-Beitrag.

Die Farben auf Computer-Bildschirmen sind dem menschlichen Auge nachempfunden und bestehen ebenfalls aus den 3 Grundfarben rot, grün und blau. Von jeder Farbe gibt es 256 Varianten, so dass sich insgesamt beinahe 17 Millionen Farben darstellen lassen (256 x 256 x 256 = 16’777’216). Sie haben also eine immense Auswahl an Farben, die Sie auf Ihrer Homepage verwenden können.

Damit Sie die Sache etwas einfacher gestalten können und nicht über 16 Millionen Farben durchprobieren müssen, gibt es Hilfsmittel, sogenannte Farbräder. Mit ihnen lassen sich verschiedene Farbkombinationen testen und evaluieren, welche Farben gut zusammenpassen.

Bestimmt haben Sie schon von Photoshop gehört. Adobe ist die Firma dahinter.
Und das Farbrad ist ein cooles Werkzeug, mit dem Sie Farbkombinationen testen können.

Hier eine kurze Anleitung, wie Sie vorgehen können:

1 Klicken Sie oben links auf «Color-Harmonie ändern». Hier können Sie eingeben, ob Sie ähnliche Farben, Triade, komplementäre Farben etc. ansehen möchten.

2 Drehen Sie am Farbrad, bis Sie eine Farbe finden, die Ihnen gefällt. Sie können die Farbwähler im Kreis verschieben und nach innen und aussen schieben, so dass hellere und dunklere Töne entstehen.

3 Klicken Sie unten in ein Feld, um eine Farbe als Grundfarbe festzulegen. Die anderen Farben werden jetzt anhand dieser Farbe bestimmt. In der Grundfarbe haben Sie weitere Slider, um den Farbton zu ändern.

4 Wenn Sie eine Farbkombination gefunden haben, die Ihnen gefällt, notieren Sie sich den RGB- oder Hex-Code. Ihre Webdesignerin braucht diesen Code, um die ausgewählte Farbe auf Ihrer Homepage einzusetzen.

Das ist schon alles. Spielen Sie etwas herum und testen Sie verschiedene Farbkombinationen. Sie können aber auch auf «Entdecken» klicken und die dort vorgegebenen Farbkombinationen ansehen, die Sie weiterbearbeiten oder auch herunterladen können.

Ähnlich wie das Adobe Farbrad funktioniert jenes von Paletton:

1 Oben geben Sie ein, ob Sie ähnliche Farben, Triade, komplementäre Farben etc. ansehen möchten.

2 Auf der rechten Seite sehen Sie dann mögliche Farbpaletten. „Vision Simulation“ erlaubt Ihnen zudem, die Farben so zu sehen, wie Farbenblinde das tun.

3 Unter „Preview“ können Sie sehen, wie Ihre Farben in Kombination mit Text wirken.

4 Und unter „Examples“ können Sie gleich eine Homepage oder auch ein Kunstwerk simulieren.

Wenn Sie bei Google Begriffe wie „Farbrad“, „Color Wheel“ und ähnliches eingeben, finden Sie noch weitere Farbräder, mit denen Sie Farbkombinationen für Ihre Homepage finden.

Deckblatt Flyer Webdesign

5 Schritte zu Ihrem erfolgreichen Homepage-Projekt

Planen Sie eine neue Homepage? Dann laden Sie meinen Guide herunter, der Ihnen zeigt, wie Sie Ihr Website-Projekt reibungslos durchführen:

Wenn Sie Farben für Ihre Homepage wählen, ist ein guter Kontrast wichtig. Lesen am Bildschirm ist grundsätzlich mühsam und für die Augen ermüdend. Ein schlechter Kontrast macht die Angelegenheit noch mühsamer und kann dazu führen, dass Ihre Besucher Ihre Homepage verlassen, bevor sie das Wesentliche gelesen haben. Am besten lesbar ist eine dunkle Schrift auf einem hellen Hintergrund.

Bei Ihrer Farbwahl sollten Sie auch bedenken, dass es Personen gibt, die Farbenblind sind. Vermeiden sollten Sie vor allem Rot/Grün-Kombinationen, beispielsweise:

Rote Schrift auf grünem Hintergrund

Grüne Schrift auf rotem Hintergrund

Ganz vermeiden lässt sich nicht, dass Farbenblinde Probleme haben mit den Farben einer Homepage, denn vermutlich wollen Sie Ihre Website nicht nur in schwarz und weiss halten. Auch bei Fotos können Sie nicht vermeiden, dass Farbenblinde die Bilder nicht «korrekt» sehen.

Hier sehen Sie ein Beispiel, wie Farbenblinde mit Rot/Grün-Schwäche ein Farbfoto sehen. Bewegen Sie dazu den Slider von links nach rechts. Da Foto zeigt den Lai da Palpuogna bei Preda/Bergün.

Lai da Palpuogna Farbenblind (rot/grün)
Lai Da Palguogna Normal

Gefällt Ihnen dieser Blog? Dann erzählen Sie es bitte weiter.

Share on facebook
Share on twitter
Share on linkedin
Share on xing
Share on email