Das Konzept von HTML

   HTML bedeutet HyperText Markup Language. Momentan gilt HTML als die Publikationssprache im WWW. Will man dort Informationen verfügbar machen, dann müssen sie mit Hilfe von HTML aufbereitet (beschrieben/ausgezeichnet) sowie in HTML-Dokumenten gespeichert sein und auf einem Web-Server zugänglich gemacht werden.
   Ursprünglich wurde die Sprache HTML für die Beschreibung der Struktur wissenschaftlicher Dokumente und deren Verknüpfungen mit Hilfe von Hypertext-Techniken in Rechner-Netzwerken konzipiert. Die zugrundeliegende Idee geht von HTML als universelle und plattformunabhängige (das heißt vor allem unabhängig vom Rechner bzw. seinem jeweiligen Betriebssystem) Dokumentenbeschreibungs- bzw. -auszeichnungssprache aus.
   Deshalb basiert das Konzept von HTML auf einer möglichst klaren Trennung der inhaltlichen und logischen Struktur eines Dokuments von dessen physischer und grafischer Präsentation. Kurz gesagt: Das Dokument wird nicht grafisch "gelayoutet", sondern logisch strukturiert. Das Layout wird dann zum Beispiel vom jeweiligen Browser je nach den lokalen Gegebenheiten erzeugt. Nur auf dieser Grundlage ist es möglich, den Anspruch einer plattformunabhängigen und sogar medien-universellen Darstellbarkeit der durch HTML aufbereiteten Informationen zu erfüllen.
   Um diesem Anspruch gerecht zu werden, wurden schon von Beginn an Anstrengungen unternommen, HTML zu normieren. Deshalb gründete man das World Wide Web (W3) Consortium. Diese Organisation ist vor allem für die Koordinierung der Weiterentwicklung technischer Standards des WWW, speziell von HTML und des HTTP-Protokolls zuständig. Die momentan gültige Spezifikation HTML 4.0 wurde in Zusammenarbeit mit den wichtigsten EDV-Firmen und führenden Web-Experten entwickelt.
   In der kurzen Beschreibung von HTML wurde schon erwähnt, dass die Möglichkeit, Verknüpfungen innerhalb und zwischen verschiedenen Dokumenten herzustellen, eine der wichtigsten Eigenschaften von HTML ist. Solche Verknüpfungen werden als Verweise oder Hyperlinks bezeichnet. Hyperlinks können sowohl zu anderen Stellen im eigenen Projekt führen als auch zu beliebigen anderen Adressen im World Wide Web verweisen. Zudem ist es mit ihnen möglich, Internet-Adressen zu aktivieren, die nicht Teil des WWW sind (zum Beispiel Adressen von FTP-Servern, wenn man Dateien herunterladen möchte). Damit kann die Grundidee des WWW, die möglichst weitreichende Vernetzung aller Informationen, verwirklicht werden.
   Die universelle Einsetzbarkeit von HTML führt zu einem weiteren Vorteil dieses Konzeptes. HTML-Dateien funktionieren nicht nur im WWW. Sie können lokal von jedem Rechner aus geöffnet werden, auf dem ein WWW-Browser installiert ist. Deshalb ist HTML auch gut geeignet für lokale Dokumentationen, CD-ROM-Oberflächen, Readme-Dateien oder ähnliches. Da auch die unmittelbaren Ergänzungssprachen von HTML (CSS und JavaScript) lokal funktionieren, kann man sehr ausgefeilte und anspruchsvolle Projekte realisieren, die nicht für den unmittelbaren Einsatz im WWW gedacht sind. HTML ist mittlerweile das verbreitetste Dateiformat überhaupt.

Tags als elementare Bestandteile

Themen in diesem Abschnitt:

Das Beschreibungsschema von HTML
Die Sprachkomponenten von HTML
Was hat das nun alles mit Tags zu tun?

Elemente
Attribute
Interne Kommentierungen

Das Beschreibungsschema von HTML

Wie schon erwähnt hat HTML als logische Auszeichnungssprache die Aufgabe, die logischen Elemente eines Dokumentes zu bschreiben. Deshalb enthält HTML hauptsächlich Befehle zum Markieren typischer Elemente eines Dokuments (zum Beispiel Überschriften, Textabsätze, Listen, Tabellen oder Grafikreferenzen).
Die meisten der genannten Strukturelemente eines Dokumentes besitzen einen fest definierbaren Erstreckungsraum. Ein Textabsatz erstreckt sich zum Beispiel vom ersten bis zum letzten Zeichen des Absatzes oder eine Liste vom ersten bis zum letzten Listenpunkt. Auszeichnungen mittels HTML markieren Anfang und Ende dieser Elemente. Um zum Beispiel einen Textabsatz auszuzeichenen, lautet das Schema:

[Textabsatz] Text des Textabsatzes [Ende Textabsatz]

Ein Element des Dokumentes kann auch mehrere Unterelemente besitzen. Bei einer Liste wären zum Beispiel die einzelnen Listenpunkte die Unterelemente. In diesem Fall sieht das Schema folgendermaßen aus:

[Liste]
[Listenpunkt] Text des Listenpunktes [Ende Listenpunkt]
[Listenpunkt] Text des Listenpunktes [Ende Listenpunkt]
[Ende Liste]

Durch Web-Browser werden die Auszeichnungsbefehle aufgelöst und die Elemente in optisch gut erkennbarer Form auf dem Bildschirm dargestellt. Eine Besonderheit von HTML ist, dass die Bildschirmdarstellung nicht die einzige Ausgabeform ist. HTML kann beispielsweise auch mittels synthetisch erzeugter Stimmen auf Audio-Systemen ausgegeben werden.

Die Sprachkomponenten von HTML

Zur Beschreibung bzw. Auszeichnung eines Dokumentes und zur Darstellung besonderer Zeichen existieren in HTML folgende Sprachkomponenten:

Elemente zur Beschreibung der strukturellen Einheiten eines Dokuments
Attribute zur Beschreibung der Eigenschaften von Elementen (meist unter Zuweisung eines Wertes)
Kommentare zur dokument-internen Verwendung (das bedeutet, sie werden im Browser nicht angezeigt)
Kodierungen zur Darstellung von Entities (= Entitäten = Sonderzeichen und Symbole)

Was hat das nun alles mit Tags zu tun?

Betrachtet man mit Hilfe eines Browsers den Quelltext eines HTML-Dokumentes (bei den meisten Browserversionen befindet sich diese Möglichkeit unter dem Menüpunkt "Ansicht"), so fällt ins Auge, dass außer dem eigentlichen Inhalt der Website als ASCII-Text alle HTML-spezifischen Sprachkomponenten außer den Entitites in sogenannten Tags (deutsch: Etiketten) stehen.
Alle Elemente und Attribute werden in Form dieser Tags formuliert und zur Auszeichnung des Dokuments eingesetzt. Sie werden durch spitze Klammern (= Delimiter, deutsch: Begrenzer) gekennzeichnet. In den meisten Fällen besteht eine Sprachkomponente aus einem einleitenden und einem abschließenden Tag. Der Raum und/oder Text dazwischen stellt den eigentlichen Gültigkeitsbereich der betreffenden Tags dar. Eine Auszeichnung (Markup) besteht also im Normalfall aus:

Start-Tag
Inhalt
End-Tag (zusätzlich markiert mit einem Schrägstrich)

Elemente

Das Schema für die HTML-Sprachkomponente Element sieht folgendermaßen aus:

<ELEMENT-NAME>inhalt</ELEMENT-Name>

Beispiel:

<H3>Die Dienste im Internet</H3>

Im Browser erscheint dieser Beispieltext etwa so:

Die Dienste im Internet

Das Beispiel demonstriert die Auszeichnung einer Überschrift 3. Ordnung. Durch das einleitende Tag <H3> wird angezeigt, dass eine Überschrift 3. Ordnung folgt (H = Heading = Überschrift). Das abschließende Tag </H3> markiert das Ende des Überschriftentextes. Alle abschließenden Tags sind leicht an den ihnen vorangestellten Schrägstrichen "/" zu erkennen.
Achtung: Es ist gleichbedeutend, ob die Tags in Klein- oder Großbuchstaben notiert werden. <h3> und <H3> bedeuten demnach das gleiche.

Einige Elemente, wie zum Beispiel br, hr oder img sind "leer", das heißt, sie haben keinen Inhalt bzw. stellen keine Einleitung für folgenden Text dar. Sie benötigen demzufolge auch kein End-Tag.

Beispiel:

Das WWW ist ein Internet-Dienst.<br>Andere Dienste sind zum Beispiel Telnet, FTP, ...

Im Browser erscheint dieser Beispieltext etwa so:

In diesem Beispiel wird durch das Tag <br> angezeigt, dass an dieser Stelle ein manueller Zeilenumbruch eingefügt werden soll (br = break = Umbruch).

Weiterhin ist es möglich, Tags ineinander zu verschachteln.

Beispiel:

<H3>Die <i>Dienste</i> im Internet</H3>

Im Browser erscheint dieser Beispieltext etwa so:

Die Dienste im Internet

Die in diesem Beispiel verwendete Auszeichnung <i> bedeutet italic (= kursiver Text). Der Browser interpretiert den Text zwischen <i> und </i> als kursiv, dessen Schriftart und Schriftgröße jedoch in Abhängigkeit von der Bedeutung der Markierung als Überschrift 3. Ordnung.

Attribute

Die meisten Elemente können zusätzliche Angaben, sogenannte Attribute enthalten. In einem solchen Fall sieht das Schema folgendermaßen aus:

<ELEMENT-NAME attribut="wert">inhalt</ELEMENT-NAME>

Beispiel:

<H3 align="center">Die Dienste im Internet</H3>

Im Browser erscheint dieser Beispieltext etwa so:

Die Dienste im Internet

Durch das Attribut align wird die Ausrichtung des Textes bestimmt (align = Ausrichtung). Im vorliegenden Beispiel bewirkt der Wert center, dass der Text zentriert dargestellt wird (center = zentriert). Es ist zudem möglich, einem Element mehrere Attribute zuzuweisen. Man unterscheidet verschiedene Arten von Attributen. Genauere Informationen zu den Unterscheidungen findet man zum Beispiel an der entsprechenden Stelle in Selfhtml.
Achtung: Normalerweise sollten alle Werte, die Attributen zugewiesen werden, in Anführungszeichen gesetzt werden. Der HTML-Standard verlangt dies jedoch nicht in jedem Fall. Enthält der Wert nur Buchstaben oder Ziffern ohne Leerzeichen, können sie weggelassen werden. Bei Wertzuweisungen sollte allgemein darauf geachtet werden, dass keine Leerzeichen zwischen Attribut, Istgleichzeichen und Wertzuweisung gelassen werden. Weniger tolerante WWW-Browser könnten sonst Schwierigkeiten haben. Anführungszeichen sind in jedem Fall notwendig bei Attributen mit variablen Namen (siehe Selfhtml), also zum Beispiel Grafikreferenzen.

Interne Kommentierungen

Mit HTML besitzt man die Möglichkeit, an jeder beliebigen Stelle innerhalb eines HTML-Dokuments Kommentare einzufügen, die vom Web-Browser nicht dargestellt werden. Kommentare können beispielsweise dazu verwendet werden, interne Anmerkungen zu bestimmten Textstellen zu machen oder zum verwendeten HTML-Code kurze Erläuterungen hinzuzufügen. Außerdem sind interne Angaben zu Autor oder Erstellungsdatum eines Dokuments sowie zur verwendeten HTML-Version denkbar.

Beispiele:

<!--Es gibt auch Kommentare, die so lang sind,
         dass sie sich über mehrere Zeilen erstrecken//-->

Alle Kommentare werden durch die Zeichenfolge  beendet, ein mehrzeiliger Kommentar durch die Zeichenfolge --//>.

Achtung: Die noch fehlende HTML-Sprachkomponente, die Entities (besondere Zeichen), werden nicht mit Hilfe von Tags formuliert und durch spitze Klammern gekennzeichnet. Für die weltweit korrekte Darstellung von sprachspezifischen Zeichen, mathematischen Symbolen oder anderen Sonderzeichen und die Gewährleistung deren Eingabe über die Tastatur werden in diesem Fall besondere Zeichenkodierungen verwendet, die an entsprechender Stelle im Kapitel "Text" näher erläutert werden.

Die grundlegende Struktur eines HTML-Dokuments

Grundsätzlich besteht ein normales HTML-Dokument aus zwei Teilen:

einem Dokument-Header, der Informationen über das Dokument enthält (zum Beispiel Angaben zum Titel u. ä.) und
einem Dokument-Body, der den eigentlichen Dokumenteninhalt, also das, was als Web-Seite sichtbar ist, darstellt (tatsächlicher Text eventuell mit Überschriften, Verweisen, Grafikreferenzen usw.)

Beispiel:


<HTML>

 <HEAD>

  <TITLE>...</TITLE>

 </HEAD>

 <BODY>

    ...

 </BODY>

</HTML>

   Der gesamte Inhalt eines HTML-Dokuments wird durch die Tags <HTML> und </HTML> eingeschlossen. Nach dem einleitenden HTML-Tag folgt das einleitende Tag für den Dokumenten-Kopf <HEAD>. Zwischen diesem und abschließenden Tag des Dokumenten-Kopfes </HEAD> befinden sich allgemeine Angaben zum vorliegenden HTML-Dokument. Obligatorisch an dieser Stelle ist die Angabe des Dokumenten-Titels. Dieser steht zwischen dem einleitendem und dem abschließenden TITLE-Tag. Dieser Titel soll möglichst knapp, aber aussagekräftig sein.
   Der Titel ist deshalb so wichtig, weil er beim Browser in der Fensterleiste und häufig zusätzlich noch in einer separaten Statuszeile erscheint. Außerdem ist er diejenige Information, die der Browser beim Anlegen von Lesezeichen und beim Anzeigen der bereits besuchten Dokumente (History) verwendet. Weiterhin benutzen viele Suchmaschinen im WWW den Titel von Dokumenten für ihre Datenbanken.
   Achtung: Der Dokument-Titel darf lediglich aus Text bestehen. Weitere Auszeichnungen sind hier nicht erlaubt.
Unterhalb des Dokumentenkopfes folgt der Textkörper, der durch das einleitende und abschließende BODY-Tag begrenzt wird. Im Textkörper findet man den eigentlichen Inhalt des Dokumentes. Hier wird das ausgezeichnet, was durch das Ausgabefenster des Browsers angezeigt werden soll.

   Nach dem momentan aktuellen HTML-Standard (HTML 4.0) kommt zu den eben beschriebenen Teilen eines HTML-Dokumentes ein dritter Teil hinzu, nämlich die Angabe der im Dokument verwendeten HTML-Version. Momentan wird diese Angabe bei der Erstellung von HTML-Dokumenten meist noch weggelassen, sie sollte aber bei einem gültigen HTML-Dokument nicht fehlen. HTML-Spezifikationen werden als "document type definitions" (DTDs) bezeichnet.

Beispiel:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"

 "http://www.w3.org/TR/REC-html40/loose.dtd">

<HTML>

 <HEAD>

  <TITLE>...</TITLE>

 </HEAD>

 <BODY>

    ...

 </BODY>

</HTML>

   Die Anweisung zur Angabe der verwendeten HTML-Version steht immer am Anfang eines HTML-Dokumentes vor dem einleitenden HTML-Tag. Zunächst folgt nach der startenden spitzen Klammer ein Ausrufezeichen. Danach befindet sich die Angabe DOCTYPE HTML PUBLIC. Sie besagt, dass man sich auf eine öffentlich zugängliche HTML-DTD bezieht. W3C (das W3-Konsortium) ist der Herausgeber der DTD. Die Angabe DTD HTML 4.0 bedeutet, dass im Dokument der Dokumenttyp "HTML" in der Sprachversion 4.0 verwendet wird. Das EN stellt eine Landesabkürzung dar. In diesem Fall ist die Sprache Englisch. Eine solche Angabe besagt lediglich, in welcher Sprache die Tag-Befehle definiert wurden, nicht, in welcher Sprache der Dokumenttext geschrieben wurde. Das bedeutet, dass an dieser Stelle immer das Kürzel EN verwendet werden muß, da HTML-Befehle auf der englischen Sprache basieren. Wird HTML 4.0 als verwendete Version angegeben, ist es möglich, zusätzlich die Internet-Adresse der offiziellen DTD von HTML anzugeben. Diese wird in Anführungszeichen am Ende des DOCTYPe-Tags notiert.
   Wie schon erwähnt ist die Angabe der HTML-Version vor allem für den Web-Browser bestimmt. Im vorliegenden Beispiel weist sie darauf hin, dass sich das folgende HTML-Dokument an der HTML 4.0-DTD Transitional orientiert. Diese berücksichtigt die aktuelle HTML 4.0-Spezifikation des W3C, läßt aber auch ältere, nicht mehr zur Verwendung empfohlene Elemente zu. Durch die angegebene Adresse kann sich der Browser bei Bedarf die entsprechende DTD holen.

   Eine letzte Bemerkung in diesem Kapitel gilt einer Folge aus der Grundidee der Markup Language: Verwendet man beim Erstellen des HTML-Codes mehrere (n) Leerzeichen hintereinander, werden sie trotzdem immer nur als ein Leerzeichen gelesen und im Browser-Fenster ausgegeben. Das entspricht dem Grundsatz einer logischen Auszeichnung. Einrücken als Layout-Tool muß genau definiert werden und kann im Gegensatz zu Programmen wie MS Word nicht durch mehrere Leerzeichen hintereinander erreicht werden.