41Mag - Tout savoir sur le Doctype HTML 5

Tout savoir sur le Doctype HTML 5

Devenu obsolète pour les navigateurs modernes, le Doctype HTML5 à subit un rajeunissement avec l’arrivée de cette nouvelle version. La ligne de code est devenu concise, identique pour tous et sans url à ajouter. Un manière simple et efficace de respecter les normes.

Qu’est ce qu’un Doctype et à quoi sert-il ?

Un Doctype est une ligne de code servant a indiquer le Type de votre document. Le Doctype précise les normes définis que vous allez donc utilisé dans ce document. Lorsque vous codez une page web en HTML, vous devez définir son Doctype.

La ligne de code contenant le Doctype s’insère en tout début de page. Vous pouvez la placez à la première ligne de votre document HTML si vous souhaitez. Le Doctype doit toujours se situer avant la balise <HTML>.

Pour un développeur, le Doctype lui sert à valider ses pages suivant les normes W3C choisis. Mais son principal but est d’indiquer aux navigateur comment interpréter le document – ou page web.

L’arrivé des navigateurs modernes à tous bouleversé. Ils ne portent que peu d’intérêt à cette balises mise à part le cas particuliers des quirks modes. HTML 5 allant dans le sens de ses évolutions, le doctype fût donc simplifié au maximum.

Qu’est ce que le HTML 5 ? En quoi est-il nouveau ?

Le HTML est un langage de programmation pour créer une page web. C’est le langage de base que chaque vrai créateur de site a appris à ses débuts. Le HTML 5 est un évolution logique du HTML 4.01 en le simplifiant sur certain point (comme le doctype) et en l’actualisant en fonction de son utilisation et de sa distribution.

La principales nouveauté – hormis la naissance de nouvelles balises et le black-listage d’autres – réside au niveau structurel des éléments. Les notions de type « en ligne » et « bloc » sont remplacé par un système de catégorisation des éléments HMTL.

Pourquoi respecter les normes du W3C

Bien que le strict respect des normes W3C n’est pas d’effet particulier sur le référencement, il parait préférable de les suivre au maximum. Néanmoins, certaines erreurs peuvent nuire grandement à l’indexation de votre site. Par exemple, ne pas mettre de balise <title> entre les balises <head> ne gênera pas vos visiteurs mais affectera votre positionnement sur Google.

Les normes ont été créer pour éviter que tout le monde se disperse et chacun y gagne en compatibilité.

Une page web respectant les standards réduira son risque d’incompatibilité entre les différents navigateur et la plateforme sur laquelle il tourne (téléphone mobile, grand écran, tablette ….).

Structure d’un document en HTML 5

1
2
3
4
5
<!DOCTYPE html>
<html>
 <head></head>
 <body>Corps de la page</body>
</html>

Un Doctype simplifié en HTML 5

Le Doctype a été simplifié au maximum. Il ne s’agit plus d’un ligne de code à rallonge, bien souvent différente pour beaucoup, et devenu inutile au yeux des navigateurs. Le doctype n’est ainsi plus relié à une adresse relative à celui-ci.

Pour déclarer un document en HTML 5 on utilise la ligne de code ci-dessous :

<!DOCTYPE html>

Rappel des précédents doctype utilisé en HTML

HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frame
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
xHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
xHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
xHTML 1.0 Frame
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
xHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

[cadreHTML5]

Article du même thême : .

Copyright © 2013 | 41Mag. All rights reserved. Contact.
Integrated by Créa-troyes. Powered by WordPress.