3 Tipps zum Umgang mit Farbwerten in CSS

Wer sich mit CSS-Code, Webdesign und Farbpaletten beschäftigt, leidet bei all den #sowiso und #hihaho mitunter an Farb-Verwirrung.

Ich gebe Ihnen 3 Tipps, wie Sie einfacher mit CSS-Farbcodes jonglieren können und die Übersicht behalten…

Wie merkt man sich zig Millionen Farben?

Am besten gar nicht. Das ist nämlich nicht nötig. Auch ist es nicht erforderlich, dass Sie das Hexadezimalsystem erlernen und sich Ihre Lieblingsfarben in Zukunft ausrechnen.

Merken Sie sich nur einfach folgendes:

Tipp 1: Fehler schnell erkennen!

Farbwerte werden in CSS mit einer 6-stelligen* Hexadezimalzahl definiert. Sie dürfen also nur die Ziffern 0-9 und die Buchstaben A-F benutzen.

Ein Farbcode wie in der Einleitung (#sowiso) ist daher gar nicht möglich. Oft sind einfache Tippfehler die Ursache für Fehler, die sich aber schnell aufspüren lassen.

Ebenfalls eine häufige Fehlerquelle ist das Vergessen der Raute #. Zwischen Raute und eigentlichem Farbcode darf kein Leerzeichen stehen.

Statt der Hex-Werte kann man auch RGB-Werte benutzen, diese Methode wird aber weniger häufig angewandt.

Aber es sind immer noch so viele Farben!

Besonders Webdesign-Anfänger baden gerne ausgiebig in kunterbunten Layouts. Selbst schuld.

Tipp 2: Nur wenige Farben verwenden!

Es ist ein ungeschriebenes Gesetz, dass man neben Schwarz und Weiß nur 3 oder maximal 4 weitere Farben auf einer Webseite einsetzen sollte.

Genaugenommen zählt man Schwarz und Weiß auch schon dazu, so dass der Spruch “Weniger ist mehr” hier wirklich Geltung hat.

Das sieht nicht nur besser aus, sondern lässt sich auch einfacher merken.

Und durch Werbebanner, Fotos und anderer Gimmicks kommt schnell mehr als genug Farbe in jedes Web-Layout.

Es gibt nur wenige Grundfarben!

Wenn Sie nach Ihrer Lieblingsfarbe gefragt werden, sagen Sie wahrscheinlich nur “rot”, “blau” oder “gelb”, und nennen nicht irgendeine Modefarbe, die sich kaum zuordnen lässt.

Tipp 3: Merken Sie sich die wichtigsten Farbwerte!

Es ist hilfreich, sich die Codes der allerwichtigsten Farbwerte einzuprägen. Es reichen schon wenige Grundtöne, um für bessere Orientierung und schnelle Tests zu sorgen.

Ich habe eine Grafik mit 9 Farbtönen angefertigt, die mir als Gedächtnisstütze dient.

Sie können die Grafik gerne kopieren und nach Ihren Wünschen verändern. Oder Sie fertigen sich gleich eine eigene Vorlage an.

Die 3 Tipps zum einfachen Umgang mit CSS-Farbcodes!

Hier also noch mal eine Kurzübersicht meiner CSS-Farbtipps:

1. Bei Hex-Code dran denken: 6-stellig*, nur 0-9 und A-F benutzen und Raute nicht vergessen.
2. Nur wenig Farbtöne in einem Layout verwenden: Ist leichter zu merken und sieht besser aus.
3. Sich die wichtigsten Codes einprägen. Schon wenige Werte sorgen für besseren Durchblick.

*Unter bestimmten Umständen kann man 6-stelligen CSS-Farbcode auch abkürzen. Aber das erkläre ich Ihnen in einem anderen Post.

Kategorie: Tutorien
Tags: CSS, Farbcodes
Veröffentlicht am 16.04.2008 von admin | Was sagen Sie dazu?