Qu'est-ce que DOCTYPE?

174
  • Qu'est-ce que DOCTYPE et pourquoi est-ce que je souhaite l'utiliser?
  • Quels sont les différents DOCTYPE que je peux utiliser?
  • Quelle est la différence entre le mode standard et le mode bizarreries, et quelles sont les bizarreries que je peux rencontrer avec des DOCTYPE définis différemment?

Enfin, quel est le DOCTYPE approprié que je devrais utiliser?

Bob
la source
9
Cela ne devrait-il pas être un wiki?
Alex le

Réponses:

76

Fondamentalement, le DOCTYPE décrit le HTML qui sera utilisé dans votre page.

Les navigateurs utilisent également le DOCTYPE pour déterminer comment rendre une page. Ne pas inclure un DOCTYPE ou en inclure un incorrect peut déclencher le mode bizarreries.

Le kicker ici est que le mode quirks dans Internet Explorer est assez différent du mode quirks dans Firefox (et d'autres navigateurs); ce qui signifie que vous aurez un travail beaucoup plus difficile, en essayant de vous assurer que votre page s'affiche de manière cohérente avec tous les navigateurs si le mode bizarreries est déclenché, que si elle est rendue en mode standard.

Wikipedia propose un résumé plus détaillé des différences de rendu lors de l'utilisation de divers DOCTYPE . XHTML est activé par certains DOCTYPE, et il y a pas mal de débat sur l'utilisation de XHTML qui est bien couvert dans XHTML - mythes et réalité .

Il existe des différences subtiles entre les différents DOCTYPE de rendu «conformes aux normes», tels que le DOCTYPE HTML5 ( <!DOCTYPE html>, avant HTML5, uniquement connu sous le nom de «doctype skinny» qui ne déclenche pas le rendu standardisé dans les navigateurs plus anciens) et les autres DOCTYPE tels que celui-ci pour HTML 4.01 transitionnel:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Walter Rumsby
la source
39
Ces jours-ci, je préfère le DOCTYPE HTML5: <! DOCTYPE html> il fonctionne dans tous les navigateurs modernes, y compris IE6.
Walter Rumsby
53
IE6 ∉ navigateurs modernes
26

Le DOCTYPE indique à l'agent utilisateur consommateur (navigateurs Web, robots d'exploration Web, outils de validation) le type de document du fichier. Son utilisation garantit que le consommateur analyse correctement le code HTML comme vous le souhaitez.

Il existe plusieurs DOCTYPES différents pour HTML, XHTML et Framesets et chacun d'eux a deux modes Strict et Transitional. Strict indique que votre balisage utilise exactement les normes définies. Voir la page des DTD du W3C pour plus de détails.

Quirksmode est essentiellement la méthode de mise en page de l'époque de la guerre des navigateurs où les normes étaient beaucoup moins respectées et définies. En règle générale, une page en mode standard, qui est valide, sera mise en page de manière plus cohérente dans différents navigateurs, mais peut ne pas comporter certaines fonctionnalités dont vous avez besoin. L'une de ces fonctionnalités est l'attribut cible de la balise d'ancrage. Le site Quirksmode est une excellente ressource pour ces différences.

Une dernière réflexion est que le nouveau standard HTML5 propose d'utiliser un DOCTYPE très simple:

<!DOCTYPE html>

L'utilisation de ce DOCTYPE est un moyen compatible en aval de spécifier que vos pages sont en mode standard et sont HTML. C'est la méthode que Google utilise et elle est raisonnablement facile à retenir. Je recommande d'utiliser ce DOCTYPE sauf si vous prévoyez d'utiliser XHTML.

Rob
la source
2
La balise HTML DOCTYPE est-elle? Si oui, pourquoi en avons-nous besoin au départ?
CuriousMind
2
@vipinkoul la balise DOCTYPE spécifie le type de document HTML que vous envoyez à l'agent utilisateur. Il peut s'agir de HTML ou XHTML ou d'un jeu de cadres. Et cela pourrait être HTML / XHTML / Frameset strict ou HTML / XHTML / Frameset de transition. Cela affecte principalement la réaction de l'analyseur lorsqu'il rencontre une erreur.
Rob
6

Un doctype définit la version HTML / XHTML utilisée par votre document. Vous voudriez utiliser un doctype pour que lorsque vous exécutez votre code via des validateurs, les validateurs sachent quelle version de HTML / XHTML vérifier. Cette page donne un bon aperçu:

N'oubliez pas d'ajouter un doctype

Les doctypes courants que vous pouvez utiliser sont répertoriés ici:

Liste recommandée des DTD

Le type de doctype à utiliser dépend du code que vous utilisez, mais pour vous faire une idée, essayez d'exécuter votre code via le validateur W3C et utilisez le menu déroulant Type de document dans le menu "Plus d'options" pour essayer différents types de doct. .

Service de validation du balisage W3C


la source
3

En HTML (y compris XHTML) tel qu'utilisé sur les pages Web, DOCTYPE est une chaîne qui déclenche l'un des quelques modes de navigation (mode quirks, mode standard, mode presque standard), en fonction de l'orthographe exacte du DOCTYPE. Vous souhaitez l'utiliser pour sélectionner un mode de navigateur qui convient le mieux à votre page.

Formellement, en SGML et XML, une déclaration DOCTYPE est une référence à une définition de type de document (DTD), qui spécifie les règles de syntaxe formelle du langage de balisage. Aucun navigateur n'a jamais utilisé les DTD pour quoi que ce soit ni même y a accédé. Cependant, ils sont utilisés par les validateurs de balisage SGML et XML tels que le validateur de balisage W3C , sauf en mode HTML5. Par conséquent, le choix de DOCTYPE détermine le fonctionnement d'un validateur si le document lui est soumis. Cependant, le mode de fonctionnement du validateur peut également être sélectionné dans son interface utilisateur. (Les processeurs SGML et XML peuvent également utiliser les DOCTYPE de différentes autres manières, mais la question est apparemment censée être limitée au contexte HTML et aux navigateurs Web et aux logiciels étroitement liés.)

Il n'y a pas de liste de DOCTYPE faisant autorité. Chaque spécification ou brouillon HTML définit son propre DOCTYPE ou DOCTYPE. L'ensemble des DOCTYPE reconnus par les navigateurs lors de la sélection du mode varie selon le navigateur. En pratique, il n'y a aucune raison d'utiliser un DOCTYPE autre que <DOCTYPE html> celui défini dans HTML5 , bien que HTML5 répertorie également quelques «anciens DOCTYPE». Vous pouvez utiliser ce DOCTYPE si vous voulez le mode standard (recommandé pour les nouvelles pages) et n'utiliser aucun DOCTYPE si vous voulez le mode bizarreries (dont vous pourriez avoir besoin pour les pages héritées).

Le «mode standard» désigne généralement le mode de fonctionnement dans lequel un navigateur suit au mieux les spécifications HTML, CSS, DOM et autres. Cela ne signifie généralement pas une conformité totale. Le «mode bizarreries» est différent selon les navigateurs, mais il s’agit généralement d’une tentative d’imiter le comportement de très vieux navigateurs comme IE 5. Le but est de faire fonctionner les anciennes pages, en supposant qu’elles peuvent s'appuyer sur des fonctionnalités et des bogues dans le anciens navigateurs. Voir la description Que se passe-t-il en mode Quirks? Notez qu'il existe un concept assez différent, plus limité de «mode quirks» en HTML5, qui ressemble étroitement au document appelé Quirks Mode Living Standard .

Un problème typique est que les largeurs d'élément sont calculées différemment en mode quirks et en mode standard. Cela signifie que la mise en page d'une page peut être plus ou moins modifiée ou même totalement foirée, si une page conçue pour fonctionner en mode bizarreries est visualisée en mode standard (ou vice versa).

Vous devez donc utiliser <!DOCTYPE html>pour les nouvelles pages et conserver le DOCTYPE (le cas échéant) que vous avez utilisé pour les anciennes pages.

Cependant, le mode bizarreries signifie, dans certains navigateurs, que de nombreuses nouvelles fonctionnalités de CSS ne sont pas prises en charge. Cela signifie que si vous souhaitez améliorer une ancienne page avec une fonctionnalité CSS3, il peut être nécessaire de passer à un DOCTYPE qui déclenche le mode standard. Dans un tel cas, vous devez examiner et tester la page pour voir si elle fonctionnera en mode standard.

Jukka K. Korpela
la source
Merci pour les détails supplémentaires, spécialement ceux-ci: «Aucun navigateur n'a jamais utilisé les DTD pour quoi que ce soit ni même accédé à eux» et «il n'y a aucune raison d'utiliser un DOCTYPE autre que <DOCTYPE html>celui défini en HTML5 ».
Armfoot
2

Les doctypes indiquent au navigateur dans quelle langue la page est écrite, que ce soit HTML ou XHTML. Par exemple,

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

dites au navigateur de rendre la page sous la forme HTML4 strict. Les anciens navigateurs utilisés pour afficher les pages de manière incorrecte et donc les navigateurs plus récents simulent les erreurs des anciens navigateurs lorsqu'ils trouvent un ancien doctype.

Aujourd'hui, vous devez utiliser au moins HTML4 ou mieux XHTML.

Une entrée de blog sur doctypes est Fixez votre site avec le bon DOCTYPE! (à partir d' une liste à part ).

Georg Schölly
la source
1

Tout d'abord, il n'y a pas de doctype que vous devriez utiliser, mais la plupart des concepteurs essaient de le faire fonctionner dans XHTML 1.0 Strict.

Un doctype n'est rien de plus qu'une déclaration des balises que vous pouvez utiliser dans votre html (bien que les navigateurs puissent utiliser plus ou moins que ce qui est défini) Vous pouvez en fait ouvrir le fichier doctype et commencer à lire ( XHTML 1.0 Strict )

Si vous ne spécifiez pas de doctype, le navigateur fera de son mieux pour deviner mais n'atteindra pas toujours le type correct.

Le mode Quirks est juste une technique utilisée par les navigateurs pour être rétrocompatible, un excellent exemple de mode Quirks est la façon dont IE rend les boîtes

Ólafur Waage
la source
1

Un doctype est un document qui décrit à quoi peut ressembler le contenu d'un document de type xhtml (comme une page Web). Remarque: ceci ne définit que la syntaxe de ladite page, le rendu de la page n'est PAS défini par la DTD!

Par exemple, un doctype pourrait définir comment le <table> peut ressembler -tag - quels attributs il accepte, et quelles valeurs / types de valeur sont acceptés pour chaque attribut. Considérez-le comme un lexique de votre page Web actuelle.

Wikipédia a une page informative sur les différents types de Doctypes couramment utilisés. Attention, rien ne vous empêche de créer votre propre doctype. Il est cependant probable que le navigateur ne sache probablement pas comment rendre votre document.

La DTD à utiliser dépend de ce que vous allez écrire. XHTML a une DTD complètement différente de HTML, par exemple.

Henrik Paul
la source
1

Sur le Web, un doctype ne fait rien d'autre que dire au navigateur si vous voulez des standards, presque des standards ou un mode bizarreries.

Les changements en mode bizarreries dépendent du navigateur: Firefox, Opera, Safari et Chrome implémentent un ensemble limité de bizarreries, comme la suppression de l'espace pour les descendants de texte dans le code comme <table><tr><td><img></td></tr></table>(solution:) td img { vertical-align:bottom; }. IE, d'autre part, revient au moteur de rendu dans IE5.5. Cela signifie que vous ne pourrez plus utiliser aucune des nouvelles fonctionnalités implémentées depuis 2000.

Pour déclencher le mode standard, je suggère d'utiliser le doctype HTML5 <doctype html>, car c'est le plus facile à retenir.

Ms2ger
la source