Zwischen HTML 4.01 und xhtml 1.0 gibt ein paar kleine, aber sehr wichtige Unterschiede, die ich zusammengetragen habe.
Kleinschreibung
Da in xhtml zwischen Groß- und Kleinschreibung unterschieden wird, müssen alle Elemente und Attribute grundsätzlich kleingeschrieben werden.
End-Tags
Einzelne Elemente wie li
oder p
mussten in HTML nicht explizit geschlossen werden, dies ist nunmehr zwingend vorgeschrieben.
Auch leere Elemente müssen nun per End-Tag ( <hr></hr>
) oder in sich ( <hr> />
) geschlossen werden.
Erweiterung des html-Tags
Der html-Tag wird nunmehr anstelle von <html>
erweitert und wird wie folgt geschrieben:
<html xmlns="http://www.w3.org/1999/xhtml">
Sinnvoll ist es dabei, gleich die Sprachangaben mit zu ergänzen:
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
In xhtml 1.1 wurde das lang-Attribut durch das xml:lang-Attribut
von xml ersetzt. Daher ist es sinnvoll, bei Nutzung von xhtml 1.beide Attribute anzugeben.
Sauberer Elemente-Code
In HTML durften sich die Elemente überkreuzen, dies ist nun nicht mehr gestattet und führt zu einem Validierungsfehler.
Falsch:
<p>Dies ist ein <em>Beispiel</p></em>
Richtig:
<p>Dies ist ein <em>Beispiel</em></p>
Attribute
Atributte müssen nun zwingend in Anführungszeichen gesetzt werden:
<div class="klasse">Dies ist ein Beispiel</div>
Jedes Attribut muss einen Wert besitzen:
<input type="checkbox" checked="checked" />
Die Kurzform aus HTML (<input type="checkbox" checked />
) führt nun zu einem Fehler.
xhtml 1.0 strict: keine missbilligten (deprecated) Elemente
Es gibt Elemente und Attribute, die in xhtml 1.0 Strict als missbilligt (deprecated) eingestuft werden. Dazu gehören u.a <font>
, <center>
, align
, valign
.
Alternativ kann man auf XHTML 1.0 Transitional ausweichen, wie ich z.B. derzeit noch mit dieser Website verfahre, da ich ansonsten u.a. Probleme mit der Einbindung des Amazon-Werbeblocks hätte.
Style- und Script-Elemente im Dateikopf
Auch wenn es i.d.R. am sinnvollsten ist, Style- und Script-Elemente in separate Dateien auszugliedern und per
<link rel="stylesheet" href="http://www.f-thies.de/base.css" type="text/css" media="screen" />
<script type="text/javascript" src="script.js"></script>
einzubinden, so kann es doch vorkommen, dass man diese Inhalte auch direkt im Dateikopf einbinden. Da der Parser aber Script- und Style-Angaben in xhtml diese wie Markup liesst, müssen diese Angaben wie folgt vor dem Parsen geschützt werden:
<script>
<![CDATA[
unescaped / ungeschützter Inhalt
]]>
</script>
Buchempfehlungen
- XHTML, CSS und Co. – Die W3C-Spezifikation für das Web-Publishing Herausgeber Stefan Mintert, ISBN 3827318726, 884 Seiten, Verlag Addison-Wesley
- Webseiten programmieren und gestalten Mark Lubkowitz, ISBN 3898425576, 1.141 Seiten, Verlag Galileo Press
- Barrierefreies Webdesign Jan Eric Hellbusch, ISBN 3898642607, 391 Seiten, Dpunkt Verlag