Homepage selbermachen 7.852 Themen, 35.619 Beiträge

Hi Pharao ;-)

und weiter gehts.
Nachdem du ja jetzt weiss, wie das Grundgeruest einer HTML-Datei aussieht, und auch Umlaute codieren kannst (ich hoffe doch, du kannst?), kommt nun "Farbe in\'s Spiel".

Im Hauptteil des Dokumentes, der zwischen den Tags (body) und (/body) steht, finden sich all die Elemente aus denen sich das zusammensetzt, was der Nutzer im Browser lettendlich zu sehen bekommt.

Mit einigen zusaetzlichen Parametern in diesem Tag kannst du das grundsaetzlice Erscheinungsbild deines HTML-Dokumentes beeinflussen, wie z.B. Hintergrundbild und Farbwahl.

Tip: Achte darauf, dass deine Farbzusammenstellung ausreichend kontrastreich ist.
Vorallem, wenn deine Besucher weniger Farben verwenden, als du, leidet die
Lesbarkeit u.U. deutlich.

Jetzt aber zu den Parametern fuer die Farbdefinition.

bgcolor Hintergrund
text Textfarbe
LINK Farbe fuer nicht besuchte Links
VLINK Farbe fuer besuchte Links (Visited LINK)
ALINK Farbe fuer einen gerade angeklickten Link (Activatet LINK)

Die Farbe werden entweder ueber einen 6-stelligen hexadezimalen Farbcode oder ueber einen Namen festgelegt.
Problem: fuer unsereins sind logischer Weise die Farbnamen leichter zu merken, als die hex-Codes (deshalb kann man die nachschlagen -- oder damit rumexperimentieren). Leider jedoch kennen nicht alle Browser die Farbnamen - lediglich der Netscape und der IE kennen eine recht grosse, gemeinsame Teilmenge. Und: Farbnamen sind nicht immer eindeutig, da bist du drauf angewiesen, dass jeder Browser dasselbe unter z.B. "cornflowerblue" versteht - wogegen die Angabe "#6495ED" ganz sicher fuer jeden Browser dasselbe bedeutet.

Genaueres ueber die Farbcodes und ihre Zusammensetzung kannst du im selfHTML nachlesen.
Hier nur einige Beispiele:

RGB-Code Bestandteile Farbe
#000000 0% rot 0% gruen 0% blau schwarz
#FFFFFF 100% rot 100% gruen 100% blau weiss
#FF00000 100% rot 0% gruen 0% blau kraeftiges rot
#00FF00 0% rot 100% gruen 0% blau kraeftiges gruen
#0000FF 0% rot 0% gruen 100% blau kraeftiges blau
#FF8000 100% rot 50% gruen 0% blau orange

Und jetzt ein Beispiel fuer ein im "body" Tag festegelegtes, farbliches aussehen:

(body bgcolor="#FFFF00" text="#008000" link="#FF0000" vlink="#FF00FF" alink="00FFFF")

Welche Farben werden hier fuer was eingestellt?

Einige Leute - um nicht zu sagen, die meisten - "supern" ihre Site mit einem Hintergrundbild. Dabei werden die Bilder, aehnlich wie beim Windows-Desktop, "gekachelt" d.h., das Bild wird neben- und untereinander sooft wiederholt, bis das Browserfenster gefuellt ist. Damit das nun wieder optisch ansprechend ist, muss das verwendete Hintergrundbild so gestalltet sein, dass kein sichtbarer Stoss entsteht. Ausserdem sollte das Bild moeglicht klein sein, nicht zuletzt, um die Ladezeit moeglichst gering zu halten.

Und wie bekommen wir nun das Hintergrundbild in das Dokument?

Gaaaaanz einfach - mit einem entsprechenden Parameter fuer das (body) Tag:

(body background="muster.gif")

Die Billy-Corp. aus Redmond musste - wie immer - ein eigenes Sueppchen kochen und hat daher einen weiteren Parameter eingefuehrt,
den a u s s c h l i e s s l i c h der IE versteht:

bgproperties.

Durch die zusaetzliche Angabe bgproperties="fixed" wird der Hintergrund als eine Art "Wasserzeichen" fixiert. Das Bild bleibt an Ort und Stelle, waehrend der Text darueber hinweg scrollt.
Da aber, wie gesagt, dieser Parameter nur vom IE verstanden wird, verwenden wir als "anstaendige" HTML-Programmierer ihn natuerlich nicht.
Ich habe ihn auch mehr der Vollstaendigkeit halber erwaehnt.

Ausserdem verstehen fast alle Browser die Parameter "leftmargin" und "topmargin", mit deren Hilfe sich ein Rand zwischen Text und Fensterrand freihalten laesst. Sie koennen einzeln oder gemeinsam eingesetzt werden.

Ach ja:

Aehnlich wie in Programmiersprachen kann man natuerlich auch in HTML - Dokumente Kommentare einfuegen.
Die haben die Form

(!-- Dieser Text ist ein Kommentar --)
wenn es sich um einzeilige Kommentare handelt. Aber auch die mehrzeilige _Variante ist moeglich; die sieht dann so aus:

(!-- Erste kommentarzeile
....
.....
letzte Kommentarzeile
//--)

Und damit waere auch diese Lektion schon wieder beendet.
Bleibt nur noch eines -- die

Hausaufgaben *gg*

1. Wie muss der folgende Satz eingegeben werden, damit er im Browser korrekt
dargestellt wird?

"Schoen daß Ihr alle da seid!" sagte Bärbel Grün von der Spaß & Freud >AG
2. Welche Farbe wird durch den Farbcode #FF00FF eingestellt?
3. Erstelle das Geruest einer HTML-Datei mit dem Titel "Meine erste Übungsseite" und trage dich
als Autor ein.
Sorge dafuer, das der Hintergrund immer weiss, Text schwarz, nicht besuchte Links blau,
besuchte Links violett, und angeklickte Links rot dargestellt werden.


Salut, und ein frohes neues Jahr

Volker