Die erste Webseite
Folgend soll das Entstehen einer ersten, einfachen Webpage dokumentiert werden.
Die Seite soll eine Überschrift erhalten, das Tag für Überschriften wurde oben bereits vorgestellt.
Nach dem einleitenden Bodytag wird also die Überschrift folgendermaßen eingefügt:
<h1>Meine erste Webpage</h1>
Der Text würde in diesem Fall groß (h1 = größte Überschrift, h6 die kleinste) und linksbündig ausgegeben.
Um den Text zentriert auszugeben, können dem einleitenden Tag Attribute hinzugefügt werden.
<h1 align=center>Meine erste Webpage</h1>
Darstellung im Browser:
Meine erste Webpage
Durch die Zusatzangabe "align" (= alignment = Ausrichtung) kann der Text
zentriert (= center) oder auch rechtsbündig (= right) ausgegeben werden.
Grundeinstellung ist die linksbündige Ausgabe.
Nun kann ein kurzer Text eingegeben werden, Absätze im Text können entweder
durch das Tag <p> (=paragraph = Absatz) oder das Tag <br> (= break) erzeugt werden,
<br> verlangt kein abschließendes Tag.
Nach dem Einleitungsabsatz soll eine kurze Aufzählung erfolgen,
um diese zu strukturieren, gibt es zwei Möglichkeiten:
1. <ol> (= ordered list): erzeugt eine Liste mit alphanumerischen Aufzählungen
2. <ul> (= unordered list): Aufzählung mit Bullets
Außerdem müssen die einzelnen Listenpunkt noch mit dem Tag <li> eingeleitet werden.
Alle mit Listen verbundenen Befehle verlangen auch ein abschließendes Tag.
Beispiel (für eine durch Bullets strukturierte Aufzählung:
<ul>
<li>1. Punkt</li>
<li>2. Punkt</li>
<li>3. Punkt</li>
</ul>
Darstellung im Browser:
· 1. Punkt
· 2. Punkt
· 3. Punkt
Durch <ul> wird die Aufzählung eingeleitet,
der zwischen <li> und </li> stehende Text wird im Dokument schließlich ausgegeben.
Mit </ul> wird die Aufzählung abgeschlossen.
Zusatzelemente zur Schriftformatierung:
<b>Dieser Text ist fett</b> (b = bold =fett)
<i>Dieser Text ist kursiv</i> (i = italic = kursiv)
<u>Dieser Text ist unterstrichen</u> (u = underline = unterstrichen)
Darstellung im Browser:
Dieser Text ist fett
Dieser Text ist kursiv
Dieser Text ist unterstrichen
Neben diesen physischen Textauszeichnungen (das Tag <u> sollte mit Zurückhaltung verwendet werden, da normalerweise Links = Seitenverweise unterstrichen dargestellt werden) kann man auch Schriftgröße, Schriftfarbe und evtl. Schriftart bestimmen. Bei der Einstellung der Schriftart sollte man jedoch auf exotische Schriftarten weitgehend verzichten, da die Browser diese oft nicht darstellen können.
Beispiele:
<font size=6>Dieser Text ist sehr groß</font>
<font size=1>Dieser Text ist recht klein</font>
<font size=+1>Dieser Text ist ein wenig größer als normalerweise</font>
<font size=-2>Dieser Text ist deutlich kleiner als normalerweise</font>
Darstellung im Browser:
Dieser Text ist sehr groß
Dieser Text ist recht klein
Dieser Text ist ein wenig größer als normalerweise
Dieser Text ist deutlich kleiner als normalerweise
Der Befehl zur Schriftgröße wird mit <font> eingeleitet,
durch das Attribut "size" wird die Größe der Schrift bestimmt.
Farben können in HTML durch vordefinierte Bezeichnungen (white, blue, green, etc.)
oder hexadezimal angegeben werden.
Beispiele:
<font color = "#0000FF">Blauer Text</font>
<font color = "green">Grüner Text</font>
<font color = "#000000">Schwarzer Text</font>
Darstellung im Browser:
Blauer Text
Grüner Text
Schwarzer Text
Nach "font color" erfolgt die Zuweisung der Farbe (unter Anführungszeichen;
es geht bei den meisten Browsern zwar auch ohne, aber man weiß ja nie ...).
Erklärung der Hexadezimalzahlen: Die Farbkomponenten Rot, Grün und Blau werden gemischt,
Angaben von 0 bis F sind möglich (Hexadezimalzählweise: 0, 1, 2, ...8, 9, A, B, ...F),
wobei 0 die geringste und F die höchste Farbintensität darstellen.
Bei Hexadezimalschreibweise sollte am Beginn das Zeichen "#" eingefügt werden,
es funktioniert meist auch ohne, aber ... siehe oben.
