## Unterschiede zwischen XHTML und HTML

Allgemeines zu XHTML
Unterschied: Mime-Typen
Unterschied: Dateinamen
Unterschied: Die XML-Deklaration
Unterschied: Dokumenttyp-Angaben
Unterschied: HTML-Wurzelelement mit Namensraumangabe
Unterschied: Strengeres Einhalten des HTML-Grundgerüsts
Unterschied: Kleinschreibung
Unterschied: leere Elemente
Unterschied: Elemente mit optionalem Abschluss-Tag
Unterschied: alleinstehende (leere) Attribute
Unterschied: Leerraum in Wertzuweisungen
Unterschied: Verweise zu Ankern
Unterschied: das Universalattribut lang=
Unterschied: Inhalt von Script- und Style-Bereichen
Unterschied: Ausnahmen von Verschachtelungsregeln
Beispiel eines XHTML-gerechten Dokuments

## Allgemeines zu XHTML

Das Konzept der Auszeichnungssprachen, von denen HTML nur eine unter vielen, allerdings die bislang weltweit erfolgreichste und bekannteste ist - dieses Konzept ist schon älter. Ein Merkmal des Konzepts solcher Auszeichnungssprachen ist, dass ihre Bestandteile nicht einfach "frei erfunden" sind, sondern dass es Meta-Sprachen gibt, mit deren Hilfe die Regeln und Bestandteile solcher Auszeichnungssprachen definiert werden.

Bereits seit 1986 gibt es die als ISO 8879 standardisierte Meta-Sprache SGML (Standard Generalized Markup Language = standardisierte verallgemeinerte Auszeichnungssprache). Diese Meta-Sprache erlaubt das Definieren von Auszeichnungssprachen mit Hilfe so genannter DTDs (Document Type Definitions = Dokumenttyp-Definitionen). In den DTDs wird festgelegt, welche Elemente eine Auszeichnungssprache hat, welche zugehörigen Attribute, sowie Regeln, welche Elemente innerhalb welcher anderen Elemente vorkommen können usw. Nun ist SGML sehr ausgereift, gilt aber gemeinhin als ziemlich "sophisticated". So entschloss man sich dazu, eine reduziertere Variante von SGML zu etablieren, und zwar unter dem Namen XML (Extensible Markup Language = erweiterbare Auszeichnungssprache). XML erlaubt ebenso wie SGML das Definieren von Auszeichnungssprachen mit Hilfe von DTDs.

HTML, das Anfang der 90er Jahre entstand, wurde mit Hilfe von SGML definiert. Bis einschließlich HTML 4.x ist das auch heute noch der Fall. Im Zuge von XML und seiner wachsenden Bedeutung für immer mehr Dateiformate, die auch im Web ihren Einsatz finden, entstand der Wunsch, auch HTML mit Hilfe von XML zu definieren anstatt wie bisher mit SGML. Damit kein Versionenwirrwarr entsteht, entschloss man sich dazu, dieses neue, XML-basierte HTML mit einem neuen Namen und eigener Versionenkontrolle auszustatten. Heraus kam dabei XHTML (Extensible HyperText Markup Language = erweiterbare Hypertext-Auszeichnungssprache).

Seit Januar 2000 liegt XHTML 1.0 als Empfehlung des W3-Konsortiums vor und hat damit den gleichen verbindlichen Stellenwert wie etwa HTML 4.0. XHTML 1.0 ist nichts anderes als der Versuch, das SGML-basierte HTML 4.0 mit Hilfe von XML "nachzubauen". Dahinter steckt keine Spielerei von Designern künstlicher Sprachen, sondern es gibt gute Gründe dafür:

- XHTML ist syntaktisch 100%ig kompatibel zu wichtigen XML-Standardsprachen wie SVG, WML, SMIL usw.
- XHTML kann dadurch als Dateninsel innerhalb anderer Sprachen eingebunden werden, und ebenso ist es möglich, diese anderen Sprachen wieder als Dateninsel innerhalb von XHTML einzubinden. So ist es beispielsweise problemlos möglich, eine SVG-Grafik als Dateninsel in eine XHTML-Datei einzubetten. Die SVG-Grafik muss dadurch nicht mehr referenziert werden, sondern ist Bestandteil der XHTML-Datei.
- Durch die gemeinsame syntaktische Grundlage auf der Basis von XML ist es auch möglich, Scriptsprachen zu vereinheitlichen. Genau das geschieht beim DOM (Document Object Model = Dokument-Objektmodell). Das DOM definiert Objekte, Eigenschaften und Methoden für den Zugriff auf Elemente XML-basierter Sprachen. Möglich ist eine solche Anwendung aber nur, weil alle diese Sprachen denselben, XML-bedingten syntaktischen Grundmustern folgen. Da die syntaktischen Grundmuster von HTML sehr ähnlich sind wie die von XHTML, ist das DOM in der Praxis auch auf HTML anwendbar. Doch der Wunsch ist verständlich, ein HTML zu haben, das sich exakt an die Syntax von XML hält.
- Was für Script-Sprachen gilt, gilt ebenso auch für Stylesheet-Sprachen. Die selbst XML-basierte allgemeine Stylesheet-Sprache XSL (Extensible Stylesheet Language = erweiterbare Formatsprache) ist genau für diese Zwecke entworfen worden. Sie stellt eine einheitliche Grundlage für alle XML-basierten Sprachen zur Verfügung.

XHTML ist also XML-gerechtes HTML. Der "Nachbau" von HTML 4.0 in XHTML 1.0 ist so weit gelungen, dass es in XHTML die gleichen Elemente, Attribute und Verschachtelungsregeln gibt wie in HTML. Systembedingt durch die Syntax von XML gibt es jedoch diverse Unterschiede im Detail, die Sie kennen müssen, wenn Sie Ihre Web-Seiten in XHTML statt in HTML schreiben wollen.

Was die Browser-Kompatibilität betrifft, gibt es keine größeren Probleme. Browser, die mit HTML 4.0 zurecht kommen, verarbeiten auch Dokumente, die in XHTML geschrieben sind, und zeigen sie genauso am Bildschirm an wie HTML. Einzelne Probleme, besonders mit älteren Browsern, sind dagegen nicht auszuschließen.

## Unterschied: Mime-Typen

Der Mime-Type für gewöhnliche HTML-Dokumente lautet stets `text/html`. XHTML-Dokumente können diesen Mime-Type ebenfalls haben. Gleichzeitig sind für XHTML-Dokumente jedoch auch die Mime-Typen `text/xml` oder `application/xml` erlaubt. Für das Erstellen von XHTML-Dateien ist dies ohne Bedeutung. Wohl aber für die Kommunikation zwischen Web-Browser und Web-Server. Falls der Web-Server dem Web-Browser in einer HTTP-Umgebung die angeforderte XHTML-Datei als Datei des Typs `text/xml` oder `application/xml` anbietet, muss der Browser diesen Mimetype akzeptieren und sich in der Lage fühlen, Dateien dieses Typs am Bildschirm anzuzeigen. Anderenfalls kann es beispielsweise passieren, dass der Browser dem Anwender die Datei zum Download anbietet, statt sie ins Anzeigefenster zu laden.

## Unterschied: Dateinamen

Neuere, XML-fähige Browser (Internet Explorer ab Version 5.x, Netscape ab Version 6.x) behandeln Dateien abhängig von der Dateinamenerweiterung unterschiedlich, wenn sie sonst keine Hinweise (Mime-Type) darauf haben, wie die Datei zu behandeln ist. Wenn Sie in einer Datei zwar alle Regeln von XHTML einhalten, die Datei aber mit den typischen Endungen .htm oder .html abspeichern, benutzen diese Browser ihre HTML-Parser. Speichern Sie die Datei dagegen mit einer anderen Endung ab, z.B. .xhtml, dann benutzen die Browser ihre XML-Parser. Der Unterschied macht sich vor allem dann bemerkbar, wenn das Dokument syntaktische Fehler enthält. Die heute üblichen HTML-Parser der Browser lassen syntaktische Fehler im Dokument einfach durchgehen und versuchen das Dokument "irgendwie" anzuzeigen. XML-Parser brechen dagegen mit einer Fehlermeldung ab, sobald sie auf einen syntaktischen Fehler stoßen. Im Anzeigefenster des Browsers erscheint dann nur eine Fehlermeldung anstelle des Dokuments.

Bei der Darstellung XML-geparster, fehlerfreier XHTML-Dokumente ohne CSS oder andere Stylesheets reagieren die Browser unterschiedlich. Netscape 6.x zeigt das Dokument wie ein HTML-Dokument an, also mit den voreingestellten Darstellungen etwa für Überschriften, Textabsätze, Listen, Tabellen usw. Der Internet Explorer stellt solche Dokumente dagegen als reine Element-Baumstruktur dar. Erst wenn Sie die verwendeten Elemente mit CSS Stylesheets formatieren, zeigt der Internet Explorer das Dokument in nicht-schematischer Form an.

Solange Sie also XHTML-konforme Dateien mit den HTML-typischen Endungen .htm oder .html abspeichern, erreichen Sie eine "normale" Darstellung im Browser, verhindern aber auch, dass die Dateien im Browser auf XML-Basis verarbeitet werden. Speichern Sie die Dateien dagegen unter einer anderen, dem Browser unbekannten oder mit dem Mime-Type `text/xml` verknüpften Dateiendung ab, dann werden die Dateien zwar auf XML-Basis verarbeitet, doch dann dürfen die Dateien tatsächlich keine syntaktischen Fehler enthalten, und wenn im Anzeigefenster des Internet Explorers etwas anderes als ein Strukturbaum erscheinen soll, müssen Sie Stylesheets verwenden, um die Elemente zu formatieren.

## Unterschied: Die XML-Deklaration

Das allererste, was am Anfang einer XHTML-Datei notiert werden sollte, ist eine so genannte XML-Deklaration. Damit geben Sie an, dass die folgende Datei XML-gerechte Daten enthält. Eine solche Deklaration gibt es in HTML 4.0 nicht, ist also XHTML-spezifisch.

### Beispiel für XHTML 1.0:

    <?xml version="1.0" encoding="UTF-8"?>

Notieren Sie diese Angabe so wie in dem Beispiel gezeigt in der ersten Zeile einer XHTML-Datei, inklusive der Fragezeichen und Groß-/Kleinschreibung. Derzeit ist beim Attribut `version=` nur der Wert `1.0` sinnvoll. Beim Attribut `encoding=` können Sie den Zeichensatz angeben, nach dem die Daten der Datei zu interpretieren sind.
`encoding="UTF-8"` bedeutet den internationalen Zeichensatz auf Basis der ISO/IEC-10646-Norm (Unicode) mit 8 Bit Zeichenbreite, d.h. ein Byte in der Datei entspricht einem Zeichen.
`encoding="UTF-16"` bedeutet den internationalen Zeichensatz auf Basis der ISO/IEC-10646-Norm (Unicode) mit 16 Bit Zeichenbreite, d.h. zwei Byte in der Datei entsprechen einem Zeichen.

## Unterschied: Dokumenttyp-Angaben

XHTML 1.0 und HTML 4.0 haben unterschiedliche Dokumenttyp-Angaben. Die Dokumenttyp-Angabe nimmt Bezug auf die DTD und Sprachversion, die Sie in der Datei verwenden, und an die Sie sich halten wollen. Ein strenger Parser kann die Anzeige der Datei z.B. im Browser verhindern, wenn die Datei syntaktische Fehler ennthält. Maßgeblich dafür, was ein syntaktischer Fehler ist, ist die DTD, auf die Sie mit der Dokumenttyp-Angabe Bezug nehmen.

### Beispiel für HTML 4.01:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
           "http://www.w3.org/TR/html4/strict.dtd">

### Entsprechendes Beispiel für XHTML 1.0:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

### Erläuterung:

Die Beispiele zeigen, wie Dokumenttypen für HTML 4.01 und XHTML 1.0 für die HTML-Variante "Strict" notiert werden. Auch in XHTML 1.0 gibt es die drei Varianten "Strict", "Transitional" und "Frameset", genau wie in HTML 4.0. Die beiden anderen Varianten für XHTML lauten:
`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">`
und
`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">`

### Beachten Sie:

So wie oben notiert, wird ein strenger XML-Parser eine bestehende Internet-Verbindung erfordern und sich die DTD von der angegebenen Web-Adresse laden, um das Dokument gegen die darin formulierten Regeln zu prüfen. Sie können die DTDs in Ihr eigenes Web-Projekt integrieren. Angenommen, Sie haben eine Startdatei namens index.htm und die xhtml1-strict.dtd in einem eigenen Unterverzeichnis namens html-dtd abgelegt, dann können Sie in der index.htm notieren:
`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "html-dtd/xhtml1-strict.dtd">`.
Sie können die erforderlichen DTDs für XHTML downloaden. Die Zip-Datei (31 KByte) enthält die DTDs für alle drei Varianten "Strict", "Transitional" und "Frameset" sowei drei zusätzliche Dateien mit Definitionen für benannte Zeichen.

## Unterschied: HTML-Wurzelelement mit Namensraumangabe

Das einleitende `<html>`-Tag hat in HTML normalerweise keine Attribute. In XHTML müssen sie jedoch den Namensraum für XHTML explizit angeben.

### Beispiel für HTML 4.01:

    <html>
    <!-- Inhalt der Datei -->
    </html>

### Entsprechendes Beispiel für XHTML 1.0:

    <html xmlns="http://www.w3.org/1999/xhtml">
    <!-- Inhalt der Datei -->
    </html>

### Erläuterung:

Notieren Sie in XHTML im einleitenden `<html>`-Tag immer das Attribut `xmlns=`, das einen XML-Namensraum bezeichnet, und weisen Sie ihm den Wert `http://www.w3.org/1999/xhtml` zu. Dies ist ein spezieller URI, der nicht dazu gedacht ist, eine aufrufbare Web-Adresse anzugeben, sondern lediglich das Schema der Web-Adressierung nutzt, um einen weltweit eindeutigen Namen für den Namensraum zu vergeben. Die Web-Adresse exisistiert zwar, weil das W3-Konsortium so freundlich war, damit die Häufung unnötiger Aufruffehler auf ihrem Server zu vermeiden - doch die Adresse bedeutet nichts anderes als wenn man als Name festgelegt hätte: "Superduper-XHTML-Spezifikation".

## Unterschied: Strengeres Einhalten des HTML-Grundgerüsts

Wenn Sie in HTML die Elemente `head` und `body` weglassen und zwischen `<html>` und `</html>` ansonsten gültiges HTML notieren, dann ist es aus Sicht von HTML ein fehlerfreies Dokument. In XHTML besteht diese Freiheit nicht. Hier muss eine HTML-Datei zwingend das übliche Grundgerüst einhalten und ein `head`- und ein `body`-Element enthalten. Außerdem ist bei XHTML das `title`-Element innerhalb des `head`-Elements zwingend erforderlich und muss als erstes Element innerhalb des `head`-Elements notiert werden.

### Beispiel für HTML 4.01:

    <html>
    <h1>Text</h1>
    </html>

### Entsprechendes Beispiel für XHTML 1.0:

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Text</title>
    <!-- gegebenenfalls andere Elemente im Kopfbereich -->
    </head>
    <body>
    <h1>Text</h1>
    </body>
    </html>

### Erläuterung:

Zwar ist die gezeigte Form, ein HTML-4.0-Dokument zu notieren, für die Praxis alles andere als empfehlenswert, aber zumindest ist sie nicht verkehrt. Bei einem XHTML-Dokument muss dagegen immer das vollständige Grundgerüst einschließlich `title`-Element notiert werden.

## Unterschied: Kleinschreibung

In HTML 4.0 ist es egal, ob Sie `<TABLE BORDER="0">`, `<TABLE border="0">` oder `<Table Border="0">` notieren. HTML unterscheidet bei Namen von HTML-Elementen und Attributnamen nicht zwischen Groß- und Kleinschreibung. Nur bei der Wertzuweisung an manche Attribute wird Groß-/Kleinschreibung unterschieden - aber auch nur im Hinblick etwa auf Scriptsprachen. Bei Attributen mit festen erlaubten Werten, wie etwa `align=`, ist es egal, ob Sie `CENTER` oder `center` notieren. Nicht so bei XHTML. XML unterscheidet nämlich strikt zwischen Groß- und Kleinschreibung. Das bedeutet, `<TABLE>` ist etwas anderes als `<table>`. Für XHTML wurde festgelegt, dass alle Elementnamen und Attributnamen klein geschrieben werden. Das Gleiche gilt auch für die festen Wertzuweisungen wie `center`.

### Beispiel für HTML 4.01:

    <OBJECT DATA="Video.mpg" TYPE="video/mpeg" ALIGN="LEFT"></OBJECT>

### Entsprechendes Beispiel für XHTML 1.0:

    <object data="Video.mpg" type="video/mpeg" align="left"></object>

### Erläuterung:

Schreiben Sie in XHTML immer alle Elementnamen wie `object` oder Attributnamen wie `data` oder `type` klein. Schreiben Sie Wertzuweisungen im Zweifelsfall ebenfalls immer klein, also beispielsweise bei `align="left"`. Nur dort, wo in einer Wertzuweisung die Großschreibung von bestimmten Buchstaben erforderlich ist, wie im Beispiel beim Dateinamen `Video.mpg`, können Sie den Wert so schreiben wie es erforderlich ist.

## Unterschied: leere Elemente

In HTML 4.0 gibt es diverse leere Elemente. Das sind Elemente ohne Abschluss-Tag. Das Abschluss-Tag ist deshalb verboten, weil die Elemente als inhaltsleer definiert sind. Beispiele:
`<img>`, `<br>`, `<input>`, `<hr>`.
In XML-basierten Sprachen, also auch in XHTML, müssen solche leeren Elemente gesondert gekennzeichnet werden.

### Beispiel für HTML 4.01:

    <p>Text mit<br>Zeilenumbruch</p>
    <p><img src="bild.gif" alt="ein Bild"></p>

### Entsprechendes Beispiel für XHTML 1.0:

    <p>Text mit<br />Zeilenumbruch</p>
    <p><img src="bild.gif" alt="ein Bild" /></p>

### Erläuterung:

Notieren Sie unmittelbar vor der schließenden spitzen Klammer des alleinstehenden Tags einen Schrägstrich, sodass am Ende die Zeichenfolge `/>` steht. Vor dem Schrägstrich sollte ein Leerzeichen stehen. Alternativ dazu können Sie auch ein Element mit Anfangs- und End-Tag notieren, z.B. `<br></br>`. Dabei darf jedoch nichts, auch kein Leerzeichen und kein Zeilenumbruch, zwischen dem Anfangs- und dem End-Tag stehen, ansonsten ist es ungültiges XHTML.

Wenn Sie Elemente, die Inhalt haben können, ohne Inhalt verwenden, z.B. `<p></p>`, dann notieren Sie sie in XHTML jedoch stets in dieser Form und niemals in der Form `<p />`.

## Unterschied: Elemente mit optionalem Abschluss-Tag

In HTML 4.0 gibt es diverse Elemente mit optionalem Abschluss-Tag. Beispiele:
`<body>`, `<td>`, `<dd>`, `<dt>`, `<option>`.
Notieren Sie solche Elemente in XHTML immer mit Anfangs- und Abschluss-Tag.

### Beispiel für HTML 4.01:

    <select name="Auswahl" size="1">
    <option>1. Eintrag
    <option>2. Eintrag
    <option>3. Eintrag
    </select>

### Entsprechendes Beispiel für XHTML 1.0:

    <select name="Auswahl" size="1">
    <option>1. Eintrag</option>
    <option>2. Eintrag</option>
    <option>3. Eintrag</option>
    </select>

### Erläuterung:

Alle Elemente, die Inhalt haben können, müssen in XHTML mit Anfangs- und Abschluss-Tag gekennzeichnet werden.

## Unterschied: alleinstehende (leere) Attribute

In HTML 4.0 gibt es diverse Attribute, die keine Wertzuweisung erhalten. Beispiele:
`<hr noshade>`, `<td nowrap>`, `<script defer>`.
In XML-basierten Sprachen gibt es diesen Typ von Attribut nicht. Alle Attribute müssen einen Wert zugewiesen bekommen. In XHTML müssen Sie also solchen Attributen irgendeinen Wert zuordnen. Als Regel hat man sich darauf verständigt, als Wert einfach den Attributnamen zuzuordnen.

### Beispiel für HTML 4.01:

    <td nowrap>Inhalt</td>
    <p>Text mit<hr noshade>Trennlinie</p>

### Entsprechendes Beispiel für XHTML 1.0:

    <td nowrap="nowrap">Inhalt</td>
    <p>Text mit<hr noshade="noshade" />Trennlinie</p>

### Erläuterung:

Weisen Sie leeren Attributen in XHTML einfach ihren eigenen Namen als Wert zu. Bei den meisten bekannten Browsern gibt es damit keine Probleme.

## Unterschied: Leerraum in Wertzuweisungen

Bei Wertzuweisungen an Attribute müssen Sie in XHTML besser aufpassen als in HTML. Leerzeichen sind erlaubt wo erforderlich, doch Zeilenumbrüche sollten Sie unbedingt vermeiden.

### Beispiel für korrektes XHTML 1.0:

    <p title="Anfang der Geschichte">Text Text Text</p>

### Beispiel für problematisches XHTML 1.0:

    <p title="Anfang
    der
    Geschichte">Text Text Text</p>

### Erläuterung:

Vermeiden Sie solche Notationen.

## Unterschied: Verweise zu Ankern

In HTML können Sie Verweise zu Ankern notieren, z.B.:
`<a href="#Anker">Verweis</a>`
Der entsprechende Anker ist dann notiert mit:
`<a name="Anker">irgendwas</a>`
Auch andere Attribute, wie etwa das `usemap`-Attribut im `<img>`-Tag zum Verweis auf ein `map`-Element, bei dem wiederum ein entsprechendes `name`-Attribut notiert ist, verwenden diese Technik.

In XHTML funktionieren solche Verweise nicht. XML benötigt Namen vom Typ "ID", also dokumentweit eindeutige Bezeichner, um solche Beziehungen auflösen zu können. In XHTML können Sie das Universalattribut `id=` verwenden, um solche Verweise zu realisieren. Damit aber auch nicht XHTML-fähige Browser damit zurecht kommen, müssen Sie beide Attribute notieren.

### Beispiel für HTML 4.01:

    <a href="#Anker">Verweis</a>
    <p>viel Inhalt</p>
    <a name="Anker">irgendwas</a>

### Entsprechendes Beispiel für XHTML 1.0:

    <a href="#Anker">Verweis</a>
    <p>viel Inhalt</p>
    <a id="Anker" name="Anker">irgendwas</a>

### Erläuterung:

Notieren Sie in dem `a`-Element für den Anker beide Attribute `id=` und `name=`. Weisen Sie beiden Attributen exakt den gleichen Namen zu. Das gibt keine Probleme, da beide Attribute unterschiedliche "Namensräume" haben. Ein Browser, der den Verweis nach XHTML-Syntax ausführen will, benötigt das `id`-Attribut, während ein Browser, der den Verweis nach HTML-Syntax ausführt, das `name`-Attribut zur Ermittlung des Ankers verwendet.

## Unterschied: das Universalattribut lang=

XML-basierte Sprachen benutzen normalerweise anstelle von `lang=` das XML-Universalattribut `xml:lang=`. Da das `lang`-Attribut in XHTML jedoch ebenfalls zur Verfügung steht, existieren also zwei Attribute für die gleiche Sache. XHTML-Parser bevorzugen im Zweifelsfall das Attribut `xml:lang=`, das aber von reinen HTML-Parsern nicht erkannt wird. Notieren Sie deshalb in der Praxis stets beide Varianten, falls Sie das Attribut verwenden.

### Beispiel für HTML 4.01:

    <p lang="de">viel Inhalt</p>

### Entsprechendes Beispiel für XHTML 1.0:

    <p xml:lang="de" lang="de">viel Inhalt</p>

### Erläuterung:

Notieren Sie beide Attribute. Die Reihenfolge spielt keine Rolle.

## Unterschied: Inhalt von Script- und Style-Bereichen

In HTML 4.0 ist der Inhalt der Elemente `script` und `style` als "CDATA" festgelegt, während er in XHTML als "PCDATA" behandelt wird. Im Klartext bedeutet das, dass bei HTML 4.0 innerhalb eines Script- oder Style-Bereichs HTML-eigene Zeichen wie `<`, `>`, `&` und `"` nicht maskiert werden müssen. Nicht so in XHTML. Wenn Sie beispielsweise innerhalb einer Bedingung vergleichen, ob ein Wert kleiner oder größer als ein anderer Wert ist, müssen Sie die spitzen Klammern außerhalb einer Zeichenkette notieren und können sie an der Stelle deshalb auch nicht maskieren. Um das Problem zu lösen, können Sie den Script-Bereich selber als "CDATA"-Bereich erzwingen. Dazu müssen Sie eine entsprechende XML-typische Notation anwenden. Damit ist das Problem allerdings nur für XML-Parser gelöst. Normale JavaScript-Interpreter etwa meinen, es bei der Syntax mit JavaScript zu tun zu haben und erzeugen einen Fehler, weil es sich nicht um gültiges JavaScript handelt. In diesem Fall bleibt nur, das Script in eine externe Datei auszulagern.

### Beispiel für HTML 4.01:

    <script type="text/javascript">
    <!--
      /* JavaScript-Kommentar: jetzt folgt ein kleines Script */
      if(parseInt(navigator.appVersion) < 4)
        alert("Oh, ein sehr alter Browser");
      /* und damit ist das Script auch schon zu ende */
    //-->
    </script>

### Entsprechendes Beispiel für XHTML 1.0:

    <script type="text/javascript">
    <!--
    <![CDATA[
      /* JavaScript-Kommentar: jetzt folgt ein kleines Script */
      if(parseInt(navigator.appVersion) < 4)
        alert("Oh, ein sehr alter Browser");
      /* und damit ist das Script auch schon zu ende */
    ]]>
    //-->
    </script>

### Erläuterung:

Die "CDATA"-Deklaration beginnt mit `<![CDATA[` und endet mit `]]>`. Notieren Sie dies bei XHTML zusätzlich innerhalb des HTML-Kommentars, in den Sie Inhalte von Script- und Style-Bereiche setzen sollten. Andernfalls würde ein XML-Parser das `<`-Zeichen innerhalb des Scripts als Fehler anmeckern.

Um Fehler bei JavaScript-Interpretern zu vermeiden, bleibt die Möglichkeit, JavaScript in separaten Dateien zu notieren. Auch bei CSS Stylesheets besteht die Möglichkeit, Formate zentral in separater CSS-Datei zu definieren.

## Unterschied: Ausnahmen von Verschachtelungsregeln

In HTML 4.0 sind einige Ausnahmen bei Verschachtelungsregeln für Elemente definiert. So ist beispielsweise festgelegt, dass ein `a`-Element kein anderes `a`-Element enthalten darf. Mit Hilfe von SGML ist die Formulierung solcher Ausnahmen möglich. XML bietet dagegen keine Möglichkeit an, solche Ausnahmen zu formulieren. In den XML-basierten DTDs (Dokumenttyp-Definitionen) von XHTML fehlen solche speziellen Verschachtelungsverbote daher. Da aber eine möglichst 100%ige Kompatibilität zwischen HTML und XHTML erreicht werden sollte, blieb dem W3-Konsortium nur der Ausweg, diese Verschachtelungsverbote verbal als "normativen Anhang" zu den DTDs von XHTML zu erklären.

Folgende Verschachtelungsregeln sind betroffen:

- `a`-Elemente dürfen keine weiteren `a`-Elemente enthalten.
- `pre`-Elemente dürfen keine Elemente `img`, `object`, `big`, `small`, `sub` oder `sup` enthalten.
- `button`-Elemente dürfen keine Elemente `input`, `select`, `textarea`, `label`, `button`, `form`, `fieldset`, `iframe` oder `isindex` enthalten.
- `label`-Elemente dürfen keine weiteren `label`-Elemente enthalten.
- `form`-Elemente dürfen keine weiteren `form`-Elemente enthalten.

## Beispiel eines XHTML-gerechten Dokuments

Das folgende Beispiel zeigt ein vollständiges XHTML-Dokument, in dem Sie die Unterschiede zu HTML noch einmal im Zusammenhang sehen können. Sie können das zugehörige Anzeigebeispiel einmal als Datei mit der Endung .htm, einmal als Datei mit der Endung .xhtml und einmal als Datei mit der Endung .xml aufrufen, um selber zu testen, was in Ihrem Browser dann passiert. Es handelt sich um exakt den gleichen Inhalt, nur die Dateinamen sind unterschiedlich.

### Beispiel:

Anzeigebeispiel: So sieht's aus (beispiel.htm)
Anzeigebeispiel: So sieht's aus (beispiel.xhtml)
Anzeigebeispiel: So sieht's aus (beispiel.xml)

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Wenn HTML zu XHTML wird</title>
    </head>
    <body>
    <h1><a name="Start" id="Start">Wenn HTML zu XHTML wird</a></h1>
    <p>Dann m&uuml;ssen alle Elemente mit Inhalt ein End-Tag haben.</p>
    <p>Leere Elemente<br />
    m&uuml;ssen einen Schr&auml;gstrich am Ende haben.</p>
    <hr noshade="noshade" />
    <p>Leere Attribute erhalten ihren eigenen Namen als Wert zugewiesen.</p>
    <p><a href="#Start">Verweise zu Ankern</a> springen zum Zielelement
    aufgrund des id-Attributs, nicht das name-Attributs.</p>
    <script type="text/javascript" src="zeitstempel.js"></script>
    <!-- so ist das mit den Scripts am sichersten -->
    </body>
    </html>

### Erläuterung:

Das Beispiel zeigt ein vollständiges XHTML-Dokument mit verschiedenen typischen Eigenheiten. Die DTD mit dem Namen xhtml1-strict.dtdliegt im gleichen Verzeichnis wie das Dokument selber, daher ist bei der Dokumenttyp-Angabe nur `xhtml1-strict.dtd` als URI notiert - ohne weitere Web-Adresse oder Pfadangabe.

| Modularisierung von XHTML
| Event-Handler für Scripts

© 2001 selfhtml@teamone.de