XHTML im Vergleich zu HTML
Barrierefreie Webauftritte können auch mit HTML 4.01 erstellt weden. Das W3C empfiehlt jedoch XHTML 1.0., weil diese Spezifikation XML-basiert und daher sicher kompatibel mit anderen W3C-Standards ist.
Die folgende Aufzählung vergleicht die wichtigsten Unterschiede zwischen HTML und XHTML.
- Dokumentenerweiterung
- HTML:.htm und .html
- XHTML:.htm, .html oder .xhtml.
- Mit den Dokumenterweiterungen .htm und .html werden Dokumente von Browsern fehlertoleranter geparst. Neuere Browser verfügen über einen XML-Parser, mit dem .xhtml-Dokumente aufbereitet werden können. Dieser Parser bricht die Darstellung eines Dokuments beim Auftreten von Fehlern ab.
- Dokumentenstruktur
-
HTML:
-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="de">
... Inhalt des Dokuments ...
</html> -
XHTML:
-
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
...
<title>Titel des Dokuments </title>
...
</head>
<body>
...
<p>Inhalt des Dokuments</p>
...
</body>
</html> -
Die Anforderungen an die Dokumentenstruktur sind strikter: Zum Beispiel muss ein <TITLE> vorhanden sein. Alle Inhalte im Body müssen in Blockelemente wie P, H1, DIV ... gesetzt werden.
- Strikte Kleinschreibung
- HTML:
In XHTML müssen Elemente, Attribute und Attributwerte ausnahmslos klein geschrieben werden. Dies gilt auch für Event-Handler. - Alle Elemente müssen geschlossen werden.
-
HTML:
-
<img src="bild.gif" alt="Alternativtext des Bildes">
<br>
<ul>
<li>Listenpunkt 1
<li>Listenpunkt 2
</ul> -
XHTML:
-
<img src="bild.gif" alt="Alternativtext des Bildes" />
<br />
<ul>
<li>Listenpunkt 1</li>
<li>Listenpunkt 2</li>
</ul> -
In XHTML müssen alle Elemente abgeschlossen werden. Auch Elemente, die für sich stehen (z.B. IMG), benötigen einen Abschluss, indem am Ende des Elements ein Leerzeichen und ein Schrägstrich angefügt werden.
- Alle Attribute benötigen einen zugewiesenen Wert.
-
HTML:
-
<hr noshade>
<input type="radio" checked> -
XHTML:
-
<hr noshade="noshade" />Attribute, die für sich stehen, wird das Attribut selbst als Wert zugewiesen.
<input type="radio" checked="checked" /> - Textmarken
-
HTML:
-
<a href="#text">zum Text</a>
...
<a name="text"></a> -
XHTML:
-
<a href="#text">zum Text</a>
...
<a name="text"></a>
<p id="text">Text</p> -
In HTML wurde ein leeres Ankerelement mit dem Attribut "name" verwendet. In XHTML ist der Sprung zu einer solchen Textmarke nicht mehr definiert. Um die Rückwärtskompatibilität zu gewährleisten, muss in XHTML sowohl die Textmarke mit dem name-attribut als auch die Zuweisung eines id-Attributs zum verlinkten Text gesetzt werden.
- JavaScript
-
HTML (strict):
-
<script type="text/javascript">
<!--
document.writeln("<strong>Inhalt</strong>");
//-->
</script> -
-
XHTML (strict):
-
<script type="text/javascript">
<!-- //
/*<![CDATA[*/
document.writeln("<strong>Inhalt</strong>");
/*<]]>*/
//-->
</script> -
In XHTML sollte der Inhalt von Skripten als CDATA (Character Data) definiert werden, da der XML-Parser Zeichen wie z.B. < als den Beginn eines HTML-Elements erkennt. Diese Auszeichnung ist für externe Skripte nicht nötig.
