Schritt für Schritt lernen
die eigene Website zu erstellen

Jetzt das HTML-Seminar als
Video-Tutorial mit über 210 Videos,
Gesamtspielzeit über 24 Stunden
Video-Kurs HTML5+CSS+Webdesign

Videokurs HTML + CSS + Webdesign erstellen

HTML Farben - die Welt ist bunt

HTML-Tags für Farben

Kurz und knapp – es gibt keinen HTML-TAG für Farben.

Ähmmm – sollte jetzt der Einwand kommen, dass man so gut wie auf jeder Internetseiten Farben sieht, dann ist der Einwand zwar richtig – aber es gibt einfach keinen HTML-TAG für Farbe. Farbe ist Design und Design wird mit CSS gemacht! Daher werden wir im Kapitel CSS dann darauf zu sprechen kommen, wie man Farben technisch einsetzt.

Hier jetzt erst einmal ein Stück Theorie zu Farben und wie diese angegeben werden können.

Farbenmischen

So, nun ist nur noch die Frage, welche Farben einem zur Verfügung stehen und was es mit den 6 Zahlen bzw. dem F als Farbangabe auf sich hat.

Welche Farben stehen zur Verfügung?

Wie in der Physik gelehrt, kann man fast alle Farben aus den 3 Grundfarben Rot, Grün und Blau zusammenmischen. Dieses Farbmodell wird oft in der Welt der Computer genutzt - es heißt RGB-Farbmodell. Dabei steht r für red, g für green und b für (ratet mal :-).

RGB-Farben und Zusammenhang mit HTML Farben

Jede Farbe kann einen Wert zwischen 0 und 255 annehmen. Nimmt man den höchsten Wert, erhält man die reine Farbe, wie im Beispiel zu sehen ist. So besteht Rot dann aus den Anteilen 255 Rot, 0 Grün und 0 Blau. Weiß ist 255,255,255 und Schwarz das Gegenteil 0,0,0.

Eine Farbe, hier Rot, wird in der Regel wie folgt angegeben.

#FF0000

So, laut der Aussage von vorhin müsste doch eigentlich eine 9-stellige Zahl dastehen. Was macht also hier die 6-stellige Zahl mit dem doppelten F?

Damit es nicht zu einfach wird, werden die Werte hexadezimal angegeben. Aber keine Panik - jedes bessere HTML-Tool unterstützt sie. Beim HTML-Editor können Sie direkt aus den Farben auswählen und bekommen dann die entsprechenden Hexadezimalzahlen.

Dezimal 0 1 2 ... 9 10 11 12 13 14 15 16 17 18 ... 255
Hexadezimal 0 1 2 ... 9 A B C D E F 10 11 12 ... FF

Der Aufbau der Farbnummer ist im Hexadezimalsystem immer wie folgt.

Aufbau Farbangaben bei hexadezimaler Schreibweise

Die andere Art, Farben anzugeben

Farben können auch über ihren englischen Namen angegeben werden.

color="silver"
color="red"
color="yellow"
color="fuchsia"

Farbpalette

Normalerweise sollten Sie sich nach Möglichkeit immer an das Standard-Schema halten, das von den Browsern optimal interpretiert wird. Die Standard-Palette wird eingesetzt, weil es immer Surfer gibt, die auf ihrem Computer nur 256 Farben anzeigen lassen. Für diese Surfer ist die Standard-Palette konzipiert. Wird diese nicht eingesetzt, werden Farben unter Umständen aufgerastert und das Ergebnis ist nicht optimal.

Die Standard-Palette bietet 216 Farben. Dabei handelt es sich um bestimmte Farben (mathematisch sind bei der Standard-Palette die RGB-Farbnummern durch 51 dividierbar). Um nun nicht mit dem Taschenrechner dasitzen zu müssen, hilft uns wie immer der HTML-Editor. Stellen Sie bei dem Reiter "Color" das Pulldownmenü auf st216_xxx.bmp

Sie haben dann die folgenden Farben zur Auswahl. Hier sehen Sie alle 216 Standardfarben und ihre hexadezimale Schreibweise.

Farbtabelle mit 216 Farben

Tipp:

Weniger ist mehr - viele Homepages sind zu bunt und zeichnen den Ersteller so durch schlechten Geschmack aus.

Genug der Farben - sonst treiben wir es noch zu bunt.

Facebook und Google+

Sehr geehrte Nutzer/innen dieser Website! Wir würden uns freuen, wenn Sie uns durch Facebook oder Google+ unterstützen würden - sei es durch ein Like/+1 oder das Teilen dieser Seite. Allerdings legen wir Wert auf Datenschutz und möchten nicht, dass diese Netzwerke Daten von Ihnen erhalten, sollten Sie dies nicht wünschen. Deshalb sind die entsprechenden Buttons bei uns standardmäßig deaktiviert.

Durch einen Klick auf einen der unteren Buttons stimmen Sie der Nutzung/Speicherung Ihrer Daten (in uns unbekanntem Ausmaß, uns unbekannten Orten und uns unbekannter Weise) zu und erhalten Zugriff auf die Buttons. Wir bitten um Ihr Verständis und freuen uns über Ihre Unterstützung :)

X

Wenn Sie einen Fehler finden, bitte mitteilen
(egal ob Schreibfehler oder inhaltlicher Fehler).

Mit Maus fehlerhafte Stelle markieren und übernehmen mit folgendem Button:

Fehler:

Verbesserung:

Name/E-Mail (damit ich auch Danke sagen kann)

eBook HTML-Seminar.de Videokurs HTML + CSS + Webdesign erstellen

Video-Tutorial: über 210 Videos,
Gesamtspielzeit über 24 Stunden
Video-Kurs HTML5+CSS+Webdesign

© 2000-2015 Axel Pratzner • www.html-seminar.de • Stand 18.8.2015
Wir freuen uns über Weiterempfehlungen und Links zu www.html-seminar.de