Cours 1.5. Structure globale d'une page HTML

Architecture générale

Une page HTML contient un grand nombre d’informations cachées. On y trouve des informations qui ne s’affichent pas directement dans le navigateur, mais qui sont malgré tout de première importance. Ces informations sont structurées à l’intérieur de la page et séparées par des balises selon l’architecture suivante :

<!doctype html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <title>Titre de la page</title>
        <meta name="description" content="Une description synthétique de la page" />

    </head>
    <body>
        ...
        <!-- Le contenu de la page qui s'affiche -->
        ...
    </body>
</html>

<doctype>

La balise <!doctype html> est le type de document. Ici, il s'agit bien sûr d'un document de type HTML. Cette balise permet la compatibilité entre le HTML et le XML qui est également un format de fichier à balises, mais plus général.

<html>

La balise <html> marque le début du code HTML. Elle est généralement composée de deux sections :

<head> est l'en-tête de la page, elle contient des métadonnées (titre, description, scripts ...) ;
<body> est le corps de la page, cette section contient le contenu de la page qui va s'afficher dans le navigateur.

Il est recommandé d'ajouter l'attribut lang="xx" dans la balise <html> afin de préciser la langue de la page.

<head>

L'en-tête de la page va contenir des meta-données, il s'agit d'informations qui ne vont pas s'afficher directement dans le navigateur, mais qui seront nécessaires pour que le navigateur puisse interpréter correctement le contenu. Cette section peut également contenir des informations que les moteurs de recherche analyseront pour référencer la page. Pour un bon référencement, il est conseillé d'inclure à minima les deux balises suivantes :

<title> contient le titre de la page qui s'affichera dans l'onglet du navigateur
<meta name="description" content="..."> contient la description de la page qui s'affichera dans les résultats des moteurs de recherche.

Ces informations peuvent paraître superflues, puisqu’elles n’apparaissent pas directement dans la page, elles sont pourtant très importantes puisqu’elles servent, entre autre, au référencement des pages dans les moteurs de recherche.

Cours 1.4 Sommaire Cours 1.6

Voir aussi

Dernière mise à jour : 23/05/2021