Aller au menu - Aller au contenu

Icône Choisir le bon Doctype

Avatar
Par Avatar le_stoppeur
Mise à jour : 22/08/2008
175 visites depuis 7 jours, classé 441/786
Bonjour à vous, :)

J'ai créé ce tutoriel dans le but de vous aider à choisir le bon DOCTYPE, vu que c'est une question qui revient assez souvent sur les forums et qu'il y a parfois de grosses erreurs d'interprétation... :-°

Je vais tout simplement vous expliquer ce qu'est exactement un DOCTYPE, puis vous détailler les principaux DOCTYPES existants.

Bonne lecture ! :D
Retour en haut
Sommaire du tutoriel :
Icône du chapitre
Retour en haut

Introduction

Qu'est-ce que c'est ?



Un DOCTYPE est en fait, en français, une déclaration du type de document.
Vous savez que vous écrivez votre page Web en HTML ou en XHTML.
Eh bien maintenant sachez qu'il existe plusieurs versions de l'HTML ou de l'XHTML.

Le DOCTYPE permet justement de spécifier, à l'attention du navigateur, la version de l'HTML ou de l'XHTML utilisée par les pages Web que vous avez créées.

Il se présente sous cette forme :
Code : HTML
1
<!DOCTYPE HTML PUBLIC   "type_de_HTML"   "adresse_de_DTD">

où
  • "type_de_HTML" est la version utilisée de l'HTML.
  • "adresse_de_DTD" est l'url de la DTD utilisée. Une DTD fixe les règles du langage que vous utilisez.



Dans ce tutoriel, nous allons nous intéresser plus particulièrement au cas de l'XHTML, puisque c'est le balisage enseigné dans les cours présents sur ce site.

Les différentes versions du XHTML sont :
  • XHTML 1.0 Strict
  • XHTML 1.0 Transitional
  • XHTML 1.0 Frameset
  • XHTML 1.1
Nous allons les étudier plus en détail dans ce tutoriel. ;)

À quoi ça sert ?



De votre point de vue et celui du validateur



La plupart du temps, et pour la plupart d'entre vous, ça sert à valider vos pages Web.
Voici l'adresse du validateur. Si elle n'est pas dans vos favoris, il va falloir y penser, et vite ! :p
Le validateur n'accepte de valider vos pages que si le DOCTYPE est présent en haut de la page. Et si elle est valide, vous recevrez le (Oh ! Joie !) message très connu :

Image utilisateur


C'est un exemple. Vous savez pertinemment que le XHTML 1.0 Strict n'est pas la seule forme de l'XHTML possible... ;)
Ça semble logique quand on y réfléchit...

Comment voulez-vous que ce sacré validateur puisse essayer de valider votre page s'il ne connaît pas la version que vous utilisez ?

Du point de vue du navigateur



Le DOCTYPE n'est pris en compte que par les navigateurs les plus récents (comme Mozilla Firefox, Opera 7, IE5 sur Mac ou IE6 sur Windows).
À la base, il doit servir, lorsque le navigateur rencontre une instruction « illégale », c'est-à-dire non reconnue par le DOCTYPE, à ignorer l'instruction.
Sans DOCTYPE, le navigateur tente de donner un sens à l'instruction dite « illégale », en cherchant dans d'autres versions une équivalence, ou tout simplement en reconnaissant des habitudes de développeurs...

C'est pour cette raison, qu'en XHTML, lorsque l'on tape <img src="mon_image.jpg" alt="Mon image"> (notez l'absence de slash de fin), le navigateur comprend qu'il s'agit de l'équivalence de la balise <img /> en XHTML !


D'habitude, le navigateur ne s'en sort pas trop mal, car il n'y a pas eu de grand changement d'une version de l'HTML à une autre, bien que le résultat puisse légèrement différer. ^^
Retour en haut

Les DOCTYPE existants (XHTML)

Et voilà, vous pouvez maintenant savoir quel type de DOCTYPE vous allez choisir ! ;)

XHTML 1.0



XHTML 1.0 Strict


Code : HTML
1
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


Ce DOCTYPE (c'est celui que j'utilise généralement :p ) est utilisé par le Site du Zér0. C'est le XHTML enseigné dans les cours Site Web du site.
C'est du XHTML pur, contrairement à l'XHTML Transitional, c'est-à-dire qu'il ne gère que le contenu et pas l'affichage.

XHTML 1.0 Transitional


Code : HTML
1
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Ce DOCTYPE permet d'utiliser en XHTML des balises qui gèrent l'affichage, comme <b>, <font>...
Il sert à faire la transition entre l'HTML et l'XHTML, pour les webmasters connaissant l'HTML, souhaitant se mettre au goût du jour et passer à l'XHTML. ^^

XHTML 1.0 Frameset


Code : HTML
1
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">


Ce DOCTYPE sert à utiliser les frames en XHTML, car elles ne sont pas acceptées avec les deux DOCTYPES du dessus... Mais bon, ce DOCTYPE est à utiliser uniquement dans les cas extrêmes ; puisque vous aimez construire des sites accessibles, vous n'utilisez donc pas les frames. ;)

XHTML 1.1



Pour l'instant, il n'y en a qu'un seul ! :D

XHTML 1.1


Code : HTML
1
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
           "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">


Il y a seulement de petits changements par rapport à l'XHTML 1.0 Strict, qui le rapprochent encore plus de l'XML ou des recommandations du W3C, tout le monde n'est pas d'accord sur le sujet. ^^
  • Sur tous les éléments, l'attribut lang a été éliminé en faveur de l'attribut xml:lang.
  • Sur les éléments a et map, l'attribut name a été effacé en faveur de l'attribut id.
  • La collection « ruby » d'éléments a été ajoutée.
Retour en haut
Et voilà, ce tutoriel touche à sa fin : j'espère que vous dormirez moins bêtes ce soir et que vous savez, maintenant, quel est le DOCTYPE le plus adapté à votre site ! ;)

Au revoir ! :)
Retour en haut

Partager

Retour en haut
37 commentaires pour "Choisir le bon Doctype"
Note moyenne : 3.50 / 4 (18 votes)
Pseudo Commentaire
Hors ligne diaboliv # Posté le 18/10/2008 à 11:46:50

Et bien moi avant de vous lire, j'étais content de faire mes petites pages web (sans doctype puisque je savais même pas que ça existait).
Maintenant que je sais que ça existe, je me sens moins con mais j'ose plus rien faire parce que je sais pas quel doctype utilisé ?
Hors ligne automatik # Posté le 05/06/2009 à 18:40:26
Ubuntu 10.10 + Linux 2.6.35-28
Avatar

 Diaboliv, je te conseille Le strict.
(Ton message date de 2008?)
Hors ligne anonyme # Posté le 03/10/2010 à 23:19:01

Bonjour,

Très bon tuto, clair et concis. Une partie sur les versions du HTML comme HTML 4.01 ou HTML5 n'aurait pas été de refus ... ^^ . Merci beaucoup.
Il y a une chose que je ne comprends pas : tu dis que le xHTML 1.0 strict est utilisé par le Site du Zéro :

Citation : le tuto
Ce DOCTYPE (c'est celui que j'utilise généralement :p ) est utilisé par le Site du Zér0.


Or, si l'on regarde le code source du SdZ :

Code : HTML
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


Peut-être qu'entre-temps, le DOCTYPE du site - ce xHTML 1.1 strict, je crois - a changé, dans ce cas le tuto serait à mettre à jour ;) . A noter, ce DOCTYPE est aussi conseillé dans le tuto de M@teo21 sur le xHTML/CSS - en fait je viens de le découvrir dans mon site :o :-° .

Amicalement,

altos.
Hors ligne X@v # Posté le 17/07/2011 à 22:12:13
documentcloud.fr
Avatar

Ville : Lupiac
Pays : France métropolitaine

 Il serait temps de mettre à jours ce tuto en proposant le nouveau doctype pour le HTML5 et le plus simple !!
Code : HTML
1
<!DOCTYPE html>


http://w3c.britoweb.net/html5-diff/200 [...] .html#doctype

==================>Mon projet<==================

Image utilisateur


 
Hors ligne G'orgio # Posté le 12/11/2011 à 14:43:27
Geek in progrees
Avatar

Avis : Mitigé

Ville : Montréal
Pays : France métropolitaine

 Faut le mettre à jour et peut être le compléter avec les doctypes des précedente versiOn du HTML.
Sans code l'aide est impossible.

Quand votre problème est résolue indique le avec la réponse qui vous à aidé.

Image utilisateur
 

Voir tous les commentaires
Ce tutoriel a été corrigé par les zCorrecteurs.