Leçon 1 / 15

Déclarer le document et sa langue

10 min HTML5 — structurer une page web Gratuit

Objectif : Écrire le début d’un fichier HTML avec le doctype, l’élément html et l’attribut de langue.

Un navigateur doit pouvoir reconnaître le type de document qu’il reçoit et la langue principale de son contenu. Sans ces indications, l’interprétation du fichier peut être moins prévisible et certains outils ne sauront pas correctement identifier la langue. Vous allez poser ces bases pour la page du programme du Festival des Rives.

Déclarer un document HTML5

La première ligne du fichier est la déclaration <!doctype html>. Elle indique au navigateur que le document suit le standard HTML5, sans ajouter de contenu visible à la page. Écrivez cette déclaration en minuscules et sans indentation : elle se place au début du fichier, avant toute balise HTML.

Après la déclaration, l’élément html constitue la racine du document : les éléments de la page se trouvent à l’intérieur de ses balises ouvrante et fermante. L’attribut lang précise la langue principale du contenu. Pour un document rédigé en français, écrivez lang="fr" sur la balise ouvrante html.

index.htmlHTML
<!doctype html>
<html lang="fr">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Festival des Rives — Programme</title>
    <link rel="stylesheet" href="style.css">
</head>
<body class="festival-page">
</body>
</html>
Aperçu du rendu
Chargement de l'aperçu…

Ce fichier reprend le début du projet fil rouge et forme un document complet. Les éléments placés après html sont nécessaires à cette page, mais les métadonnées, le titre et le contenu de la page seront étudiés dans les leçons suivantes. Pour cette étape, concentrez-vous sur les deux premières lignes et sur l’ouverture de l’élément racine, qui porte la langue du festival.

Respecter les conventions du projet

Dans le projet, écrivez les balises HTML en minuscules et placez quatre espaces devant chaque niveau imbriqué. L’élément html commence sans indentation ; ses éléments enfants sont décalés de quatre espaces, puis leur propre contenu est décalé de quatre espaces supplémentaires. Cette mise en forme rend plus facile le repérage des ouvertures et des fermetures, notamment lorsque la page du festival gagnera en contenu.

Vérifier le début du fichier

Avant de poursuivre, vérifiez que la toute première ligne est bien <!doctype html>, que l’élément racine s’ouvre avec <html lang="fr"> et qu’il se ferme avec </html>. Contrôlez également que les balises sont en minuscules et que l’imbrication est alignée avec des groupes de quatre espaces. Vous avez ainsi établi une base cohérente pour compléter ensuite la page du festival.

À retenir

  • Placez en première ligne pour déclarer un document HTML5.
  • Utilisez l’élément racine pour contenir le document.
  • Indiquez la langue principale avec l’attribut lang ; pour le français, écrivez lang="fr".
  • Respectez les balises en minuscules et l’indentation de quatre espaces du projet.

Envie d'aller plus loin ?

Les cours Enovatic sont gratuits et le resteront. Si vous cherchez un accompagnement encadré, nos formations professionnelles sont animées par les mêmes formateurs.