Les documents HTML doivent tous avoir une structure minimale. C'est-à-dire des balises qui sont toujours présentes et au milieu desquelles vous allez ajouter votre propre contenu. Ce chapitre présente cette structure en donnant quelques explications sur les mots-clefs principaux (aussi appelés balises).
Voici un exemple de page minimale :
<!DOCTYPE html>
<html>
 <head>
 <title>Titre affiché dans la barre de titre du navigateur</title>
 </head>
 <body>
 <!-- C'est ici que vous mettrez votre contenu -->
 </body>
</html>
Les balises.
Comme vous le savez, le HTML utilise ce que l'on nomme des balises afin de structurer les informations et pour transformer votre code source en document correct affiché à l'écran. Connaître toutes les balises par cœur n'est heureusement pas nécessaire mais il faut en avoir bien compris le principe pour pratiquer le HTML. On a de plus tendance à utiliser un nombre de balises plus restreint qu'il n'y paraît.
Pour rappel une balise est composée du nom de l'élément entouré des symboles « < » et « > ». Par exemple codice_1 est une balise.
Les balises viennent en général par deux. 
Certaines balises sont dites vides, c'est-à-dire qu'elles ne contiennent pas d'autres éléments. Ces balises ne possèdent donc pas de balises de fermeture.
Lorsqu'une balise n'est pas vide, vous pouvez mettre différentes choses entre la balise d'ouverture et la balise de fermeture comme du texte ou d'autres balises.
Il est interdit de « croiser les balises » c'est-à-dire qu'il n'est pas permis de fermer une balise alors qu'une autre, ouverte après elle, n'est pas encore fermée. Il faut toujours faire attention à bien les emboîter.
Un grand nombre de balises prennent des attributs. Ils servent à paramétrer finement la sémantique d'une balise (par exemple en indiquant la cible d'un lien). Après le mot-clef, il suffit de mettre le nom de l'attribut suivi du symbole = et d'une valeur à donner à l'attribut, placée entre guillemets.
Ainsi dans la balise codice_2 :
Les attributs sont toujours de la forme codice_3.
Chaque balise peut posséder plusieurs attributs différents. Bien sûr, comme pour les balises, il est inutile de connaître par cœur tous les attributs et toutes les valeurs.
Si ce qui précède n'est pas clair, retournez lire l'introduction.
La page minimale.
Voici une page minimale dont nous allons expliquer tous les éléments :
<!DOCTYPE html>
<html>
 <head>
 <title>Titre affiché dans la barre de titre du navigateur</title>
 </head>
 <body>
 <!-- C'est ici que vous mettrez votre contenu -->
 </body>
</html>
La définition de type de document.
Vous le savez, on en a parlé en long en large et travers dans l'introduction, il existe plusieurs versions du HTML et avec ça plusieurs variantes. On a aussi dit qu'une fois la version (et le cas échéant la variante) choisie, il fallait s'y tenir. Mais pour savoir si vous respectez bien les règles d'une certaines version, il faut dire la version que vous utilisez ! C'est à ça que sert la première ligne. Elle paraît barbare mais ne vous inquiétez pas, vous n'aurez pas à l'apprendre par cœur (franchement je me demande si quelqu'un la connaît). Cette première balise donc est la "déclaration de type document" (appelée couramment "doctype"). Dans le cas présent, c'est du HTML5.
Vous avez ci-dessous une liste des Doctype les plus utilisés que vous pouvez directement copier / coller.
Importance du DOCTYPE.
Sans un , vous ne pourrez pas faire passer votre page par un validateur.
Vous avez sûrement remarqué qu'il n'y a pas de / final. En effet, le DOCTYPE n'est pas une balise, en fait, mais a un statut bien particulier.
Les trois variantes du HTML 4.01.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd"> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
 "http://www.w3.org/TR/html4/frameset.dtd">
Les trois variantes du XHTML 1.0.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Le XHTML 1.1 (qui n'a pas de variantes).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Le HTML 5.
<!DOCTYPE html>
Les Balises.
Nous retrouvons ici notre exemple du haut de page, pour en expliquer les principales balises.
En HTML, pour le nom des balises, il n'y a pas de distinction entre majuscules et minuscules.
Cependant, par le passé la tendance était de mettre le nom tout en majuscules, tandis que la tendance actuelle est de mettre le nom tout en minuscules.
<!DOCTYPE html>
<html>
 <head>
 <title>Titre affiché dans la barre de titre du navigateur</title>
 </head>
 <body>
 <!-- C'est ici que vous mettrez votre contenu -->
 </body>
</html>
La balise codice_1.
Là, on entre dans le vif du sujet, les balises.
Un document HTML est entièrement compris dans une balise codice_5. Même si le navigateur s'y attend, vous êtes poli et vous lui dites que vous commencez votre document HTML, puis que vous le terminez. Ainsi la balise codice_1 sera toujours la toute première après le doctype, et la balise codice_7 la toute dernière. 
À l'intérieur on trouve deux parties principales : un en-tête et un corps, placé respectivement dans les balises codice_8 et codice_9. L'en-tête est constitué de déclarations générales concernant la page HTML, destinées au navigateur, aux moteurs de recherche etc. Le corps contient le document lui-même : ce qui sera affiché par le navigateur dans la fenêtre de rendu. Cette partie ne contient aucun élément obligatoire.
La balise codice_10.
La balise codice_10 délimite l'en-tête de la page dont on vient de parler. On y trouve des informations qui ne seront pas affichées directement dans la zone de rendu du navigateur. Par exemple le titre de la page, le lien vers la feuille de style, une description et des mots clés, etc...
L'en-tête des documents HTML est l'objet du chapitre "L'en-tête".
La balise codice_12.
L'en-tête contient un élément obligatoire : codice_13 qui indique le titre de la page. C'est le titre qui s'affiche ensuite en haut de la fenêtre du navigateur.
Essayez de mettre un titre pertinent et différent pour chaque page, qui permette d'identifier le site et la page en elle-même. Par exemple, "Sommaire" est un très mauvais choix. Quand votre page se retrouvera dans les favoris de quelqu'un, cette personne sera incapable de savoir de quelle page il s'agit rien qu'en regardant le nom. Préférez des choses du style "Accueil - www.ladressedemonsite.com".
La balise codice_14.
Tout le corps de notre document est dans la partie codice_9. Elle comprend donc le texte, les liens, la référence des images et tout ce qu'un auteur peut vouloir mettre dans un document HTML.
Les commentaires.
Les commentaires sont du texte écrit dans le code HTML qui n'est pas visible dans le rendu de la page. Les commentaires jouent habituellement le rôle de notes pour expliquer ce qui a été fait dans la page, ou bien tout simplement pour indiquer des modifications à faire ultérieurement. Ils sont biens sûr facultatifs, mais ils peuvent vous être utiles !
Un commentaire commence par les caractères codice_16.
Pratiquement n'importe quelle chaîne de caractères peut être placée à l'intérieur d'un commentaire : du texte, des balises, mais pas une suite de deux traits d'union adjacents (--).
Conclusion.
Dans cette partie vous avez appris vos premières vraies balises. Elles sont importantes car elles doivent toujours être présentes (en dehors des balises de commentaires, qui sont uniquement là à titre de... commentaires).