Farben in HTML

Elemente und Farben

Farbangaben können für viele Elemente verwendet werden, z.B.:

Definition von Farben

Für Farbangaben wird der RGB-Wert (= Rot-Grün-Blau) in Hexadezimalform verwendet. Eine Farbangabe könnte wie folgt aussehen: #FFFFFF. Dieser Code steht für die Farbe weiß.

Durch die Angaben in Hexadezimalform wird Browserunabhängigkeit erreicht und es können 16,7 Mio. verschiedene Farben verwendet werden.

Weitere Farbbeispiele:

#000000 (Schwarz),
#3300CC (Dunkelblau Richtung Violett),
#0000FF (reines Blau).

Das einleitende Zeichen # ist unbedingt erforderlich. Die ersten beiden Zahlen stehen für den Rot-Anteil, die nächsten beiden für den Grünanteil, die letzten beiden Zahlen für den Blauanteil.
Je höher der Wert, desto heller wird die Farbe; FF wäre der höchste Wert. Steht ein Wert auf 00, ist von dieser Farbe kein Anteil vorhanden.

Ein paar Worte zur hexadezimalen Darstellung von Werten:

Während wir im Dezimalsystem rechnen, also in einer Zahlenreihe von 0 bis 9, hat das Hexadezimalsystem 16 Werte, und zwar von 0 bis 9 für die ersten 10 Werte, gefolgt von A bis F für weitere sechs Werte. Am ehesten kann man sich diese Darstellung bildlich wie ein Koordinatensystem vorstellen, ähnlich wie bei einem Stadtplan, in dem eine Straße zum Beispiel durch die Koordinaten 5N (5 waagrecht und N = 14. Position senkrecht) angegeben wird.

Das folgende Beispiel setzt den Hintergrund auf Rot, die Schrift auf weiß - wohl keine günstige Farbgebung für Sehbehinderte.

Beispiel roter Hintergrund, weiße Schrift:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/transitional.dtd">
<html>
<head>
<title>Roter Hintergrund, weiße Schrift</title>
<link rel=stylesheet type="text/css" href="../../../css/bsp1.css">
</head>
<body bgcolor=#990000 text=#FFFFFF>
</body>
</html>

Beispiel, das den Hintergrund der Datei auf Rot und die Schrift auf weiß setzt

   Zur Navigation    Zum Inhalt

Farben könnten auch durch einen Farbnamen festgelegt werden. Es sind allerdings nur 16 Farben offiziell standardisiert und viele weitere Farbnamen sind stark browserabhängig.

Beispiel hellblauer Hintergrund:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/transitional.dtd">
<html>
<head>
<title>Hellblauer Hintergrund</title>
<link rel=stylesheet type="text/css" href="../../../css/bsp1.css">
</head>
<body bgcolor=aqua>
</body>
</html>

Beispiel, das den Hintergrund der Datei auf Hellblau setzt

   Zur Navigation    Zum Inhalt

Die Textfarbe für den gesamten Dateikörper wird im body-Tag notiert, ebenso die dateiweiten Linkfarben, wobei

Beispiel für mehrere Farben:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/transitional.dtd">
<html>
<head>
<title>Mehr Farben</title>
<link rel=stylesheet type="text/css" href="../../../css/bsp1.css">
</head>
<body bgcolor=#CCCCCC text=#FF00FF link=#FF0000 vlink=#00FF00 alink=#FFFFFF>

<p>Es wurden folgende Farben festgelegt:</p>

Hintergrund (Background Color - bgcolor) = #CCCCC = hellgrau
Textfarbe (text) = #FF00FF = violett
Linkfarbe (link) = #FF0000 = rot
Besuchter Link (Visited Link - vlink) = #00FF00 = grün
Aktiver Link (Active Link - alink) = #FFFFFF = weiß

<p>Auch das ist wohl keine gute Farbgebung für Sehbehinderte. Mit Hilfe der <a href="beispiele/farben/farbtabelle.htm">Farbtabelle</a> können Sie sich aber Ihre persönliche Farbpalette zusammen stellen.</p>

</body>
</html>

Beispiel für mehrere Farben

   Zur Navigation    Zum Inhalt

Kommentar zu Farben

Es ist nicht notwendig, Farben aufgrund Ihres hexadezimalwertes eindeutig identifizieren zu können, wenn man die Farbe selbst am Bildschirm nicht wahrnehmen kann. Die gebräuchlichsten Farben sind in einer Tabelle zusammengefasst, in der Sie nachschlagen können. Es erleichtert allerdings das Verständnis und die Kommunikation, wenn man die Grundregeln der Farbmischung kennt.

Die folgenden Ausagen können als grundsätzlche Regel gelten, sind aber weder vollständig noch auf jedes Beispiel, dem wir begegnen, anwendbar. Zum einen ist die Wahrnehmung von Farben sehr individuell und gerade bei Mischfarben zeigt es sich, dass drei Menschen drei verschiedene Farbbenennungen wählen können. Dazu kommt noch, dass sowohl die Browser Farben unterschiedlich darstellen, das ausgewählte Farbschema diese beeinflussen und auch Bildschirme unterschiedlich reagieren.

Ein paar Beispiele:

Anmerkungen:

   Weiter    Zur Navigation    Zum Inhalt