En HTML, l'élément DOCTYPE
doit venir en premier, suivi d'un seul <html>
qui doit contenir un élément <head>
contenant un élément <title>
suivi d'un élément <body>
élément. Voir la description de la structure globale d'un document HTML dans HTML 4.01 y le projet HTML5 les exigences réelles sont en grande partie les mêmes, à l'exception de la DOCTYPE
mais ils sont décrits différemment.
Les balises réelles ( <html>
, </html>
, <head>
etc) sont facultatifs ; les éléments seront créés automatiquement si les balises n'existent pas. <title>
est la seule balise obligatoire en HTML. Le document HTML 4.01 valide le plus court (du moins, celui que j'ai pu générer) est (nécessite une balise <p>
parce qu'il doit y avoir quelque chose dans le <body>
pour être valide) :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><title></title><p>
Et le document HTML5 valide le plus court :
<!DOCTYPE html><title></title>
Notez qu'en XHTML, toutes les balises doivent être spécifiées explicitement ; aucun élément ne sera inséré implicitement.
Les navigateurs effectuent un reniflage du type de contenu dans certaines circonstances pour déterminer le type d'une ressource qui n'a pas été spécifiée à l'aide d'une balise Content-Type
HTTP, ainsi que le reniflage du codage des caractères si l'en-tête Content-Type
n'a pas été fourni ou ne comporte pas d'en-tête charset
(vous devez généralement essayer d'inclure ces en-têtes, et vous assurer qu'ils sont corrects, mais il existe certaines circonstances dans lesquelles vous ne pouvez pas, comme les fichiers locaux qui ne sont pas transférés par HTTP). Ils ne reniflent qu'un nombre limité d'octets au début du document à ces fins, donc tout ce qui est destiné à affecter le reniflage du contenu ou le reniflage du codage des caractères doit se trouver vers le début du document.
Pour cette raison, HTML5 spécifie que tout meta
qui est utilisé pour spécifier le jeu de caractères (soit <meta http-equiv="Content-type" content="text/html; charset=...">
ou simplement <meta charset=...>
) doit se trouver dans les 1024 premiers octets du fichier pour prendre effet. Ainsi, si vous souhaitez inclure des informations sur le codage des caractères dans votre document, vous devez placer la balise au début du fichier, peut-être même avant la balise <title>
élément. Mais rappelez-vous que cette balise est inutile si vous spécifiez correctement un élément Content-type
en-tête.
En CSS, les déclarations de style ultérieures ont la priorité sur les précédentes toutes choses égales par ailleurs. Ainsi, vous devriez généralement placer les feuilles de style les plus génériques qui peuvent être remplacées plus tôt, et les feuilles de style plus spécifiques plus tard.
Pour des raisons de performances, il peut être judicieux de placer les scripts en bas de la page, juste avant le bouton </body>
car le chargement des scripts bloque le rendu de la page.
Évidemment, <script>
doivent être ordonnées de manière à ce que les scripts qui dépendent de chaque ordre voient leurs dépendances chargées en premier.
Dans l'ensemble, hormis les contraintes que j'ai déjà spécifiées, l'ordre des balises au sein de <head>
ne devrait pas avoir trop d'importance, si ce n'est pour la lisibilité. J'ai tendance à aimer voir le <title>
vers le haut, et mettez l'autre <meta>
dans une sorte d'ordre logique.
La plupart du temps, l'ordre dans lequel vous devez placer les éléments dans le corps d'un document HTML est l'ordre dans lequel ils doivent être affichés, ou l'ordre dans lequel ils doivent être consultés. Vous pouvez utiliser les CSS pour réorganiser les éléments, mais les lecteurs d'écran lisent généralement les éléments dans l'ordre de leur source, les index de recherche extraient les éléments dans l'ordre de leur source, etc.