Link zu www.kneller-gifs.de

HTML: Farben auf der Homepage

In HTML-Dateien können Texte, Hintergründe, Links etc. farbig präsentiert werden. Einige Farbwerte können direkt über ihren englischen Namen ("black", "red", ...) angesprochen werden. Um alle Farbkombinationen zu erreichen müssen Farben über deren RGB-Wert (Rot-Grün-Blau-Anteil) definiert werden.

Es gibt jeweils 256 verschiedene Werte für Rot, Grün und Blau. Die gültigen Wertebereiche sind je Farbe dezimal von 0 bis 255 bzw. hexadezimal von 0 bis ff. In HTML müssen Farbwerte hexadezimal angegeben werden. Hier ein paar Beispiele für das Verständnis:
dezimal: 0001..091011..151617..153154..159160..255
hexadezimal:0001..090a0b..0f1011..999a..9fa0..ff

Jeder Farbwert ist 2stellig, die gesamte Farbdefinition für 3 Farben ist also ( 3 * 2 = ) 6stellig. Vor dem HTML-Farbwert muss noch ein "#" stehen, sodass das Farbschema folgendermassen aussieht: "#RRGGBB". Die zulässigen Werte je Farbe zeigt die folgende Tabelle:
RRRot-Anteil00 bis ff
GGGrün-Anteil00 bis ff
BBBlau-Anteil00 bis ff

Aus der Kombination der drei Grundfarben ergeben sich 256 * 256 * 256 = 16,7 Mio verschiedene Farben! Die folgenden Beispiele zeigen, wie Farben aus den RGB-Werten gemischt werden, indem die einzelnen Farbwerte auf z.B. "00" (aus) oder auf "ff" (an) oder auf "99" (etwas an) oder ... eingestellt werden:
Farbdefinition: #000000 #ffffff #999999 #ff0000 #00ff00 #ffff00 #ffaa00
Farbwerte: rot 00
grün 00
blau 00		 rot ff
grün ff
blau ff		 rot 99
grün 99
blau 99		 rot ff
grün 00
blau 00		 rot 00
grün ff
blau 00		 rot ff
grün ff
blau 00		 rot ff
grün aa
blau 00
Ergebnis: schwarz weiss grau rot grün gelb orange
               

Nun aber keine wilden Farbberechnungen durchführen, sondern lieber mit den drei RGB-Farbanteilen experimentieren, um z.B. eine Hintergrundfarbe für die Homepage zu finden. Ich biete dazu die folgende Farbtestbox an. Dort einfach 2stellige Hexwerte eingeben und den "zeige-Button" anklicken. Es erscheinen die entsprechende Farbe und der GesamtHexwert... -hexhex-
Rot:
   Grün:
   Blau:
Hexwert:
Farbe:
 


Eine kleine HTML-Datei mit Farben könnte so aussehen: 
  <html>
    <head>
      <title>Farbtest</title>
    </head>
    <body bgcolor="#000000" text="#ff0000" link="#ff9090" vlink="#900000">
      Dies ist ein Testlink zu
      <a href="http://www.bild.de">bild.de</a><br>,
      <a href="http://www.juergen-kneller.de">juergen-kneller.de</a>
    </body>
  </html>
Im body-Tag stehen vier Farbeinstellungen, die für die gesamte darzustellende HTML-Seite gelten.
- Die Hintergrundfarbe (backgroundcolor) ist schwarz,
- die Textfarbe (text) rot,
- die Linkfarbe (link) hellrot und
- die Farbe für besuchte Links (visited link) dunkelrot.