HTML - Grundlagen - Dokumentstruktur
1. Aufbau
Ein HTML-Dokument besteht aus drei Hauptbereichen:
- der DOCTYPE Definition (dazu gleich mehr)
- dem Head-Bereich
- dem Body-Bereich
So und jetzt wagen wir uns erstmals an richtigen HTML-Code heran. Das Grundschema einer Seite sieht so aus (die Pünktchen stehen für weiteren Code):
<!DOCTYPE ...>
<html>
<head>
<title>Titel der Seite</title>
...
</head>
<body>
...
</body>
</html>
Wir sehen also, dass das eigentliche Dokument vom <html>-Tag eingeschlossen ist. Dieses wird dann in zwei
separate Teile untergliedert, den oben erwähnten Bereichen <head> und <body>.
Wichtig!
Wenn ihr euch für XHTML entscheidet, so müsst ihr auf eine Feinheit achten. Das <html> muss
zwingend um die folgenden Attribute ergänzt werden:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="de">
Noch wichtiger!
Laut Spezifikation muss bei einem XHTML-Dokument zu Beginn folgende Anweisung stehen:
<?xml version="1.0" encoding="UTF-8" ?>
Das muss man aber nur tun, um ein valides XML-Dokument(!) zu bekommen. Die praktischen Auswirkungen dagegen sind gleich Null. Außerdem kann es je nach Serverkonfiguration noch zu Problemen mit PHP kommen. Darum empfehle ich euch, das nicht einzusetzen. Man kann es auch übertreiben mit den Spezifikationen.
2. <head>
In diesem "unsichtbaren" Bereich können zum Beispiel Zusatzinformationen, so genannte Meta-Daten, bereitgestellt werden, die vom Browser und auch von Suchmaschinen interpretiert werden. Dazu gehören unter anderem Angaben über den verwendeten Zeichensatz, automatische Weiterleitungen, Anweisungen zum "Cachen" einer Datei, oder logische Bezüge von verschiedenen HTML-Dokumenten zueinander. Auch kann man hier externe CSS- oder JavaScript-Dateien einbinden.
Der Titel (<title>...</title>) ist bei den HTML-Varianten das einzige Element innerhalb des Head-Bereichs,
der laut Spezifikation zwingend vorhanden sein muss. Das hat mehrere Gründe.
- er wird in der Titelleiste des Browsers dargestellt (der bunte Balken ganz oben, wo sich auch das "X" befindet)
- er wird bei Tabs (Karteireitern), wie sie alle modernen Browser anbieten, im Reiter dargestellt
- er wird bei den Favoriten angezeigt (wenn man nicht explizit etwas anderes angibt)
- er dient vielen Suchmaschinen als wichtige Informationsquelle
Bei XHTML muss zusätzlich immer der verwendete Zeichensatz angegeben werden. Bei HTML sollte man es tun. Auf die Details dazu gehe ich später ein, vorab nur ein Beispiel.
<meta http-equiv="content-type" content="text/html;
charset=ISO-8859-1" />
So umgeht ihr das Problem mit dem nicht nutzbaren <?xml version="1.0" encoding="ISO-8859-1" ?>.
3. <body>
Dieser Bereich beinhaltet letztendlich alles, was der Browser darstellt, Kommentare mal ausgenommen. Die sind zwar da, werden aber nicht dargestellt.
zurück zum vorherigen Abschnitt weiter zum nächsten Abschnitt