1.3 Grundstruktur eines HTML-Dokuments

Ein HTML-Dokument wird in Form einer Textdatei gespeichert. Diese Datei enthält den Dokumenttyp und das html-Element. Das html-Element dient als Wurzelelement des HTML-Dokuments (engl. root element) und schließt alle weiteren Elemente ein.

1.3.1 Dokumenttyp

In der ersten Zeile der Datei wird der Dokumenttyp angegeben. Dieser verrät einem Webbrowser, nach welchem Regelwerk (Dokumenttypdefinition, kurz DTD) das vorliegende Dokument erstellt worden ist. Der Browser benötigt diese Information, um das Dokument korrekt darstellen zu können.

Wird ein HTML-Dokument nach den Regeln von HTML5 erstellt, muss als Dokumenttyp <!DOCTYPE html> angegeben werden.

Abb. 1-5: Dokumenttyp HTML5

1.3.2 Das Wurzelelement (`html`-Element)

Das html-Element ist das Wurzelelement eines HTML-Dokuments, das alle weiteren Elemente aufnimmt.

Abb. 1-6: html-Element

HTML-Attribute bieten zusätzliche Informationen über das jeweilige Element. So gibt zum Beispiel das lang-Attribut Auskunft über die Sprache, in welcher der Inhalt des jeweiligen Elements verfasst ist. Die Sprachkürzel sind in ISO 639-1 festgelegt, zum Beispiel de für Deutsch und en für Englisch. Die Angabe des lang-Attributs ist nicht verpflichtend, wird jedoch empfohlen, da es von Webbrowsern und Suchmaschinen abgefragt wird.

Abb. 1-7: Der Inhalt dieses html-Elements wird in deutscher Sprache verfasst werden.

HTML-Attribute speichern zusätzliche Informationen über das jeweilige Element. Sie werden stets im Start-Tag rechts neben den Namen des Elements notiert. Mehrere Attribute werden durch ein Leerzeichen voneinander getrennt.

Ein Attribut besteht aus dem Attributnamen gefolgt von einem Gleichheitszeichen und dem in Anführungszeichen eingeschlossen Attributwert.

Merke: HTML-Attribute

1.3.3 `head`- und `body`-Element

Das html-Element enthält ein head- und ein body-Element. Das head-Element speichert Informationen über das HTML-Dokument, die zum Beispiel durch den Webbrowser oder Suchmaschinen ausgewertet werden. Das body-Element enthält den Inhalt des Dokuments.

Abb. 1-8: head- und body-Element

Ein Element, das andere Elemente enthält, wird Elternelement genannt. Elemente, die Teil eines anderen Elements sind, werden als Kindelemente bezeichnet. So ist zum Beispiel das html-Element das Elternelement der Elemente head und body, die wiederum dessen Kindelemente sind (vgl. Abbildung 1-4).

Kindelemente können selbst auch Elemente enthalten. Sie sind dann deren Elternelement.

Merke: Eltern- und Kindelemente