Standard- vs. Quirks-Modus
Gegenwärtig gängige Browser können eine HTML-Datei im Standard-Modus oder im Quirks-Modus darstellen. Das bedeutet, dass verschiedene Regeln angewandt werden, um die Datei darzustellen: entweder konform zu dem erwarteten Verhalten nach den W3C-Standards oder konform zu den Erwartungen anhand des Nicht-Standard-Verhaltens von älteren Browsern.
Die neueren Versionen der gängigen Browser schalten bei einer vorhandenen DOCTYPE-Deklaration in den Standard-Modus. Ein fehlender DOCTYPE kann zu unterschiedlichem Rendering in verschiedenen Browsern führen.
Die folgenden Screenshots zeigen einige dieser Unterschiede auf:
Clicken Sie auf die Bilder, um die HTML-Seiten zu öffnen. Im Internet Explorer sieht man den Effekt.
Diese zwei Bilder zeigen dieselbe Seite mit exakt demselbem Markup und demselben Stylesheet. Der einzige Unterschied zwischen beiden Dateien besteht darin, dass in der linken ein DOCTYPE am Anfang des Quelltextes steht, in der rechten nicht. Eine Datei mit einer geeigneten DOCTYPE-Deklaration sollte in den neusten Versionen aller Browser im Standard-Modus gerendert werden. Kein DOCTYPE ergibt Quirks.
Die eben gezeigten Unterschiede resultieren aus unterschiedlichen Implementierungen in Browsern wie dem Internet Explorer:
-
Im Standard-Modus schließt die für das div gesetzte Breite nicht die Breiten für Innenabstand (Polsterung, padding) und Rahmen (border) ein, im Quirks-Modus hingegen doch. Deshalb ist der große Kasten im linken Bild (im Standard-Modus) breiter.
-
Im Quirks-Modus erbt die Tabelle nicht die Schriftgröße vom body-Element, demzufolge erscheint der Text größer.
Ursprünglich war der DOCTYPE lediglich dazu bestimmt, die Auszeichnungssprache anzugeben. Das folgende Beispiel zeigt einen Quelltext mit DOCTYPE-Deklaration am Anfang (rot und kursiv hervorgehoben):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>XHTML document</title>
<style type="text/css">
body { background: white; color: black; font-family: arial, sans-serif; font-size: 12px; }
p { font-size: 100%; }
h1 { font-size: 16px; }
div { margin: 20px; width: 170px; padding: 50px; border: 6px solid teal; }
table { border: 1px solid teal; }
</style>
</head>
<body>
<h1>Test file for Standards/Quirks</h1>
<div>
A div with CSS width:170px, margin:20px, padding:50px and border:6px.
</div>
<p>Text in a p element.</p>
<table>
<tr><td>Text in a table.</td></tr>
</table>
</body>
</html>
Das Umschalten zwischen Standard- und Quirks-Modus nennt man auch DOCTYPE-Switching.
Es ist generell angebracht, die Seiten im Standard-Modus auszuliefern, also eine DOCTYPE-Deklaration einzufügen.
Die XML-Deklaration und DOCTYPEs
Ein Punkt ist bei der Verwendung von DOCTYPEs besonders wichtig für die Angabe der Zeichencodierung und für vorhersehbare Darstellungsergebnisse.
Weil XHTML 1.0 auf XML basiert, ist es möglich, eine XML-Deklaration am Dateianfang hinzuzufügen, auch wenn es als HTML ausgeliefert wird. Damit sieht der Anfang der obigen Datei so aus (XML-Deklaration rot und kursiv hervorgehoben):
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
...
In Browsern wie Internet Explorer 7, Firefox, Safari, Opera, Google Chrome u.a. wird eine Seite sowohl mit als auch ohne XML-Deklaration, jedoch mit DOCTYPE-Deklaration, im Standard-Modus gerendert.
Im Internet Explorer 6 jedoch wird, wenn vor der DOCTYPE-Deklaration noch irgendetwas anderes außer einem BOM steht, die Seite im Quirks-Modus gerendert.
Wenn die Nutzer des Internet Explorer 6 immer noch einen signifikanten Anteil des Zielpublikums ausmachen könnten, sollte dieses Problem bedacht werden. Wenn alle Seiten genauso wie in allen anderen, standardkonformen Browsern dargestellt werden sollen, muss darüber nachgedacht werden, wie das zu lösen ist.
Wenn das Dokument keine Konstrukte enthält, die von den Unterschieden zwischen Standard- und Quirks-Modus beeinflusst werden, dann gibt es kein Problem. Wenn dies allerdings nicht der Fall ist, muss man Workarounds im CSS hinzufügen, um die Unterschiede auszugleichen; oder die XML-Deklaration weglassen.
Wenn man sich dafür entscheidet, die XML-Deklaration wegzulassen, sollte man als Zeichencodierung für die Seite entweder UTF-8 oder UTF-16 wählen. (Siehe Angabe der Zeichencodierung in HTML für weitere Informationen zum Einfluss der Deklaration der Zeichencodierung.)