A quoi sert la ligne DOCTYPE en tête de mes fichiers et que faut-il y mettre ?

  1. Qu'est-ce-que c'est ?
  2. A quoi ça sert ?
  3. Le cas des Explorer et la commutation «mode Microsoft»/«mode W3C»
  4. Est-il indispensable de mettre une URL ?
  5. Compléments

1 — Qu'est-ce-que c'est ?

On parle de «doctype» pour faire court, mais il s'agit en fait d'une ligne de déclaration du type de document, qui indique au navigateur dans quel type de HTML la page a été écrite (HTML-3.2 «classique», HTML-4 de transition ou strict, XHTML, etc...). Dans une écriture plus complète, cette ligne a l'allure suivante :
<!DOCTYPE HTML PUBLIC   "type_de_HTML"   "adresse_de_DTD"> 
Par exemple, on pourra rencontrer la déclaration
<!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.0 Transitional//EN"
      "http://www.w3.org/TR/html4/loose.dtd"> 

Ces doctypes sont généralement mis en place par l'éditeur HTML utilisé. La question de l'écrire soi-même ou de le modifier ne se pose que si on code soi-même ses pages à la main. A cette fin, nous avons réuni à la fin de cet article une liste des principaux doctypes utilisés pour les pages web.

2 — A quoi ça sert ?

Pour beaucoup d'entre nous, ça sert avant tout à faire passer nos pages au validateur du consortium W3C, afin de vérifier qu'on n'a pas fait d'erreur sur la syntaxe du HTML. Sans ce doctype, le validateur se borne à répondre qu'il ne peut pas deviner la nature du document et il se croise les bras.

Côté navigateur, d'abord, cette ligne n'est prise en compte que par les navigateurs les plus récents (comme Mozilla, NN7, Opera7, IE5 sur Mac ou IE6 sur Windows). En principe, cela permet un fonctionnement plus propre, du moins plus simple : par exemple, toute instruction illégale dans le cadre du HTML invoqué pourrait être purement et simplement ignorée. Sans ce doctype, le navigateur essaie de donner un sens à l'intruction litigieuse en revenant à des versions antérieures du HTML ou à des habitudes qui se sont mises en place dans les premiers navigateurs sans trop tenir compte de la norme internationale de l'époque. En général, il ne s'en tire pas trop mal parce que l'évolution du HTML s'est faite sans contradiction majeure d'une version à la suivante, mais on conçoit que cela puisse aboutir à des résultats parfois légèrement différents, et que ça ne simplifie pas le développement des navigateurs au fur et à mesure que les années passent.

On voit que cela demande deux modes de fonctionnement aux navigateurs : un mode strict, ou «conforme», ou «standard», en présence du doctype, et un mode plus indulgent en son absence. Les anglo-saxons parlent de Quirks Mode pour ce dernier, où quirk (sinusoïté, bizarrerie, excentricité) s'oppose à strict. En principe, on passe donc d'un mode à l'autre selon qu'on met le doctype ou non.

Les dernières versions de Mozilla ont introduit un troisième mode (almost standard mode, mode presque conforme), principalement pour les doctypes «XHTML Transitional» et «HTML 4.01 Transitional» — alors que le doctype «HTML 4.0 Transitional» ne conduit qu'au mode quirks. Le site mozilla.org détaille dans quels cas on obtient l'un ou l'autre de ces trois modes [1]. Cette référence énumère une liste de doctypes avec à chaque fois un petit test illustrant le mode obtenu [2]. On pourra récupérer le code de ce test pour l'exécuter en local avec le doctype de son choix, au cas où celui-ci ne serait pas dans la liste (par exemple le HTML 3.2 conduit bien au mode quirks :-)). On pourra aussi étudier ce code pour comprendre quelques unes des différences entre ces modes de rendu. Une liste plus étendue de ces différences se trouve dans [3].

3 — Le cas particulier des Explorer : du mode natif «microsoft» au mode conforme W3C

En général, avec tout navigateur autre qu'un Explorer (ou Opera-7), une fois que la page a été validée, son rendu ne change pas beaucoup si on enlève le doctype. Le navigateur passe en quirks mode, mais il se débrouille — en général, à nouveau — de manière satisfaisante.

Il en va différemment avec les Explorer. Leur quirks mode est un mode natif Microsoft qui diverge sur pas mal de points de la norme du W3C, de telle sorte qu'on a parfois des différences assez sensibles dans les rendus (parfois, pas systématiquement, il ne faut pas dramatiser !). Le désaccord le plus célèbre porte sur le modèle des boîtes, c.à.d. sur le sens des propriétés de style width et height, le résultat étant que les dimensions des boîtes peuvent changer quand on passe d'un Explorer à Mozilla.

Le basculement du mode «natif» au mode «conforme» est possible à partir de la version IE6 pour Windows ou IE5 pour Macintosh. En pratique, il est déclenché par l'un des doctypes suivants :
   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
          "http://www.w3.org/TR/html4/loose.dtd">
   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">
   <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0//FR">
(On peut remplacer HTML 4.0 par HTML 4.01 dans ces lignes, à ceci près que <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> laisse IE5-mac — mais pas IE6 — dans le mode natif. Il faut rajouter l'URL pour passer en mode conforme)
Ce qui se passe pour IE6-windows est abondamment commenté sur le site Microsoft même [4]. Il devrait y avoir un document analogue pour IE5-mac, mais nous n'avons pas su le trouver (!). Noter que la présence de l'URL n'est indispensable que dans le cas des HTML-4 transitional (et aussi du HTML 4.01 strict pour IE5-mac).
En fait, le navigateur ne contrôle pas la validité de cette adresse, il se contente tout simplement de détecter la présence de «http://»). Les URL sont facultatives pour les autres doctypes.

Mais l'histoire ne s'arrête pas là, il y a d'autres points à prendre en compte :

4 — Est-il indispensable de mettre une URL ?

Actuellement, dans la pratique, les URL dans la ligne «doctype» ne jouent pas du tout le rôle prévu à l'origine par le W3C.

5 - Compléments

Principaux doctypes
Rappelons que ces doctypes ont la forme suivante
<!DOCTYPE HTML PUBLIC   "type_de_HTML"   "adresse_de_DTD"> 
où l'adresse est facultative. Le tableau ci-dessous donne une liste de quelques uns des éléments possibles
type_de_HTML adresse_de_DTD
-//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd
-//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/strict.dtd
-//W3C//DTD HTML 4.01 Frameset//EN http://www.w3.org/TR/html4/frameset.dtd
-//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
-//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
-//W3C//DTD XHTML 1.0 Frameset//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd

On peut prendre HTML 4.0 au lieu de HTML 4.01, mais le consortium W3C recommande ce dernier, plus récent. Pour les pages plus anciennes, si on tient à leur ajouter un doctype, on pourra prendre HTML 3.2 ou HTML 2.0.

Attention à ne pas laisser d'espace entre «Transitional» et le double slash final: le doctype est alors généralement non identifié et le navigateur quitte généralement le mode quirks qui pouvait être visé (par exemple, en HTML-4.0, Mozilla passe ainsi du mode quirks au mode standard).

Attention enfin en XHTML à ne pas précéder le doctype du prologue XML <?xml version="1.0"?>. Un bug de IE6 fait retourner celui-ci au mode «microsoft», ce qui n'est sûrement pas l'effet recherché en XHTML. Comme cette ligne est facultative, il vaut mieux s'en abstenir pour le moment.
Références externes

[1] le choix des modes de Mozilla selon le doctype
[2] un petit programme de test du mode de rendu de Mozilla (quirks, almost standard, full standard)
[3] les détails des modes quirks et almost standard de Mozilla
[4] passage au mode standard pour IE6
[5] le mode quirks et la commutation quirks/standard pour Opera-7

Charles
(merci à Pascal et François pour leurs avis)