http://jendryschik.de

UX, Usability und Webstandards

Suche
SucheMenü

Syntax und Vokabular

Hinweis: Diese »Einführung in XHTML, CSS und Webdesign« ent­spricht der zwei­ten Auf­lage des gleich­na­mi­gen Buches, das im Dezem­ber 2008 im Ver­lag Addison-Wesley erschie­nen ist. Die Inhalte sind mittlerweile veraltet, fast alles hat sich weiterentwickelt. Seit einigen Jahren gibt es HTML5, von XHTML redet niemand mehr, und auch die Entwicklung und Unterstützung von CSS ist um Einiges weiter. Auch fast alle Grundlagentexte müsste man schon lange fortschreiben. Falls Sie die Texte dennoch lesen möchten, behalten Sie das bitte im Hinterkopf.

Zurück zur Startseite und zum Inhaltsverzeichnis des Buchs

Elementtypen, Elemente, Tags, Elementinhalte

XHTML besteht aus einer Reihe von Elementtypen, die zum Beispiel Absätze, Überschriften, Tabellen, Listenpunkte, Bilder oder Hyperlinks repräsentieren. Welche Elementtypen es gibt, in welchem Zusammenhang diese verwendet und wie sie verschachtelt werden dürfen, wird in der Dokumenttyp-Definition (DTD) oder im zugehörigen Schema festgelegt.

Ein Element ist eine konkrete Ausprägung (eine konkrete Instanz) eines Elementtyps und wird wie folgt notiert:

<Elementname>Inhaltsmodell</Elementname>

Der Elementinhalt wird von einem Start-Tag und einem End-Tag umschlossen. Ein Tag besteht aus einer öffnenden spitzen Klammer (<), dem Elementnamen und einer schließenden spitzen Klammer (>). Das End-Tag enthält zusätzlich das Ende-Kennzeichen, einen Schrägstrich (/), vor dem Elementnamen.

Tabelle 4.1 verdeutlicht die Bezeichnungen anhand eines Elements vom Typ h1, einer Überschrift erster Ordnung.

Tabelle 4.1: Element mit Elementinhalt
Bezeichnung Beispiel
Element <h1>Überschrift erster Ordnung</h1>
Elementname <h1>Überschrift erster Ordnung</h1>
Start-Tag <h1>Überschrift erster Ordnung</h1>
Elementinhalt <h1>Überschrift erster Ordnung</h1>
End-Tag <h1>Überschrift erster Ordnung</h1>

Einige Elementtypen haben keinen Inhalt, zum Beispiel der Elementtyp hr, der eine horizontale Linie erzeugt, br für einen Zeilenwechsel und img zur Einbindung von Bildern. Diese sogenannten leeren Elemente werden über ein Leeres-Element-Tag erzeugt; das Ende-Kennzeichen wird hierbei in das Tag hineingezogen:

<Elementname />

Tabelle 4.2 veranschaulicht die neuen Begriffe anhand des leeren Elements br (Zeilenumbruch).

Tabelle 4.2: Leeres Element
Bezeichnung Beispiel
Element <br />
Elementname <br />
Leeres-Element-Tag <br />

Zum Seitenanfang

Attribute

Oft hat ein Element einen Zusatz, um eine Eigenschaft zu beschreiben. Einen solchen Zusatz nennt man Attribut, dem ein Attributwert zugeordnet wird. Paare aus Attributnamen und Attributwert stehen immer im Start-Tag eines Elements und werden vom Elementnamen sowie voneinander durch Leerraum abgetrennt. Die Reihenfolge der Attribute innerhalb eines Elements ist beliebig. Attributwerte werden entweder von doppelten (") oder einfachen (') Anführungszeichen eingeschlossen.

Als Beispiel: Das Element a (Anker) wird durch die Tags <a> und </a> ausgezeichnet. Um zu bestimmen, auf welches Ziel der Link verweisen soll, wird ihm das Attribut href="http://www.example.com" verliehen. href ist der Attributname, der URI zwischen den Anführungszeichen ist der Attributwert. Tabelle 4.3 zeigt noch einmal alle Begriffe und deren exakte Zuordnung übersichtlich unteinander.

Tabelle 4.3: Das Element a mit dem Attribut href
Bezeichnung Beispiel
Element <a href="http://www.example.com">Dokumentation</a>
Elementname <a href="http://www.example.com">Dokumentation</a>
Start-Tag <a href="http://www.example.com">Dokumentation</a>
Elementinhalt <a href="http://www.example.com">Dokumentation</a>
End-Tag <a href="http://www.example.com">Dokumentation</a>
Attribut <a href="http://www.example.com">Dokumentation</a>
Attributname <a href="http://www.example.com">Dokumentation</a>
Attributwert <a href="http://www.example.com">Dokumentation</a>

Zum Seitenanfang

Kommentare

XHTML bietet die Möglichkeit, Kommentare einzubinden. Kommentare sind dazu geeignet, interne Angaben zum Autor, das Erstellungsdatum, Anmerkungen und Notizen einzufügen oder um verwendete Elemente auszukommentieren. Diese stehen sichtbar im Quelltext der Seite, werden somit auch an den Browser übertragen, allerdings nicht auf der Seite angezeigt.

Geöffnet werden XHTML-Kommentare durch den öffnenden Begrenzer der Auszeichnungsdeklaration (markup declaration open delimiter, <!) und den öffnenden Begrenzer des Kommentars (comment open delimiter, --). Geschlossen werden sie durch den schließenden Begrenzer des Kommentars (comment close delimiter, --) und den schließenden Begrenzer der Auszeichnungsdeklaration (markup declaration close delimiter, >):

<!-- Dies ist ein einzeiliger Kommentar. -->
  
<!-- Dies ist ein mehrzeiliger Kommentar, der durch
die gleichen Zeichenfolgen eingeschlossen wird. -->

Da ein Kommentar mit der Zeichenfolge -- eingeleitet und beendet wird, dürfen Sie die Zeichenkette -- in XHTML-Dokumenten nicht innerhalb eines Kommentars verwenden.

Zum Seitenanfang

Zeichenreferenzen

Das Zeichen < darf nicht Teil eines Elementinhalts sein, da der Browser dieses Zeichen sonst als Teil des Markups (Beginn eines Start-Tags) missinterpretieren würde. Ebenso dürfen doppelte (") oder einfache (') Anführungszeichen nicht in Attributwerten auftreten, die durch die gleichen Zeichen eingeschlossen werden. Deswegen können Sie nicht einfach schreiben:

<p>Das Zeichen < darf nicht Teil eines Elementinhalts sein.</p>

Stattdessen muss das Zeichen < in Form einer Zeichenreferenz notiert werden.

Eine Zeichenreferenz dient der Eingabe von Zeichen, die im Markup an dieser Stelle nicht erlaubt oder nicht in dem gewählten Zeichenvorrat vorhanden sind. Eine Zeichenreferenz beginnt mit einem Ampersand und endet mit einem Semikolon (;). Aus diesem Grund muss das Zeichen & ebenfalls umschrieben werden, da der Browser sonst glauben könnte, eine Zeichenreferenz würde eingeleitet.

Es werden numerische und benannte Zeichenreferenzen unterschieden.

Eine numerische Zeichenreferenz (numeric character reference) gibt die Codeposition eines Zeichens im gewählten Dokumentzeichensatz an. Sie kann zwei Formen annehmen, wobei D und H als Variablen zu verstehen sind:

  • Die Syntax &#D; weist auf die dezimale Zeichennummer D. Beispiel: &#60;
  • Die Syntax &#xH; weist auf die hexadezimale Zeichennummer H. Beispiel: &#x003C;

Eine benannte Zeichenreferenz (character entitiy reference) verwendet zwischen & und ; statt einer Zahl eine mnemonische Zeichenkombination, die das Zeichen beschreibt und sich mehr oder weniger leicht merken lässt. Für jedes Zeichen der Codepositionen 160 bis 255 in Unicode existiert eine benannte Zeichenreferenz, darüber hinaus auch für viele weitere (zum Beispiel mathematische Symbole oder griechische Zeichen).

XHTML verwendet als Zeichenvorrat Unicode; das heißt, Sie können prinzipiell jedes Zeichen aus Unicode in XHTML-Dokumenten verwenden. Da es mehrere Möglichkeiten gibt, ein Zeichen im Quelltext einer Webseite zu referenzieren, können Sie sogar Zeichen aus Unicode unterbringen, obwohl Sie eine Kodierung mit eingeschränktem Zeichenvorrat wie ISO-8859-1 oder US-ASCII für den Großteil Ihres Texts verwenden.

Grundsätzlich können Sie Ihre XHTML-Dokumente in jeder beliebigen Zeichenkodierung schreiben und abspeichern, solange sie mit der korrekten Information zur Kodierung vom Webserver ausgeliefert werden.

Tabelle 4.4 stellt numerische und benannte Zeichenreferenzen von im XHTML-Markup verwendeten Zeichen gegenüber.

Tabelle 4.4: Zeichenreferenzen für Markup-Zeichen
Zeichen Bezeichnung Zeichenreferenz
dezimal hexadezimal benannt
< Kleiner als &#60; &#x003C; &lt;
> Größer als &#62; &#x003E; &gt;
" Anführungszeichen &#34; &#x0022; &quot;
' Apostroph &#39; &#x0027; &apos;
& Ampersand &#38; &#x0026; &amp;

Entgegen einem weit verbreiteten Irrglauben ist es übrigens in den meisten Fällen nicht nötig, das Anführungszeichen, den Apostroph und sogar das Größer-als-Zeichen per Zeichenreferenz zu notieren. Dies ist nur dann notwendig, wenn diese Zeichen in Attributwerten auftreten, wobei Anführungszeichen und Apostroph auch nicht umschrieben werden müssen, wenn der Attributwert im jeweils anderen Zeichen eingeschlossen wird.