5. FarbenAuf Monitoren werden Farben im so genannten „RGB-Modus“ dargestellt. RGB steht für „Rot – Grün – Blau“.
Um Farben auf Webseiten zu definieren, stehen euch die
Farbnamen aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white und yellow zur Verfügung, die bereits im letzten Kapitel erklärt wurden. Diese Art der Farbangabe wird jedoch nicht unbedingt empfohlen.
Besser geeignet zur Farbdefinition sind die
Hexadezimalfarben, bei denen ihr aus 16,7 Millionen Farben wählen könnt.
Vor einem Hexadezimal-Farbcode steht immer ein #-Zeichen („Raute“). Ein solcher Farbcode besteht aus einer sechsstelligen Kombination aus den Ziffern 0-9 und den Buchstaben A-F.
Die Ziffern zeigen, wie viele Teile rot, grün und blau in einer Farbe anhalten sind – „0“ steht dabei für „gar nicht“ und „F“ für vollständig.
So sieht z.B. der Farbcode von weiß so aus:
- Code:
-
#ffffff
der Farbcode von schwarz lautet:
- Code:
-
#000000
und z.B. grün
- Zitat :
- #009933
Mit den Hexadezimalcodes können dann Schrift-, Hintergrund-, Rahmen- usw. -farben definiert werden.
Um die
Standardfarben einer HTML-Seite festzulegen, stehen im BODY-Tag diverse Attribute zur Verfügung, denen Farbwerte zugewiesen werden können:
- Code:
-
<body bgcolor="#e0e0e0" text="#333333" link="#800080" vlink="#4f154f" alink="#800080">
bgcolor (hier hellgrau) bestimmt die Hintergrundfarbe
text (hier fast schwarz) bestimmt die Textfarbe
link (hier violett) bestimmt die Farbe von Links
vlink (hier dunkles violett) bestimmt die Farbe von besuchten Links
alink (hier violett) bestimmt die Farbe vom Link, der gerade angeklickt wird
Innerhalb eines Textes kann die Farbe, die als Standardtextfarbe festgelegt ist, einfach mittels font-Tag überschrieben werden:
- Code:
-
<font color="#4f154f“>...Text...</font>
Ich habe hier einmal als Beispiel das Wort „Ausbildung“ hervorgehoben.
Wie kommt man nun zum gewünschten Farbcode? Sicherlich könnte man mittels „ausprobieren“ die gewünschte Farbe erraten. Dafür braucht man aber viel Zeit und es erfordert ein gewisses Maß an Erfahrung, die Farbanteile im Kopf zu errechnen.
Einfacher geht der Weg über ein Bildbearbeitungsprogramm wie z.B. Photoshop:
Mit einem Doppelklick öffnet sich der Farbwähler, wo die gewünschte Farbe eingestellt und der entsprechende Code rauskopiert werden kann.
Eine Übersicht mit verschiedensten Hexadezimalcodes ist hier zu finden:http://www.html-php-mysql.de/generatoren/colors.php
Idealerweise werden alle Farbeinstellungen zentral in einer CSS-Datei festgelegt – dazu werdet ihr hier später mehr erfahren.
~~~
Nun ist auch Part 5 überstanden, ich hoffe das mit den Farbcodes habe ich nicht allzu kompliziert erklärt.
Wer Fragen hat, kann die ganz enfach hier im Forum (einfach auf "antworten" klicken, auch als Gast) loswerden oder mir eine eMail schicken.
Nächste Woche geht es weiter mit Teil 6: Listen & Aufzählungen.