Titres HTML
Vous savez déjà écrire des éléments et des attributs. Cette leçon porte sur les titres — les balises qui marquent le titre principal et les titres de section d’une page. De bons titres aident à parcourir la page et aident navigateurs et outils d’assistance à comprendre le plan.
Que sont les titres HTML ?
Les titres HTML sont six niveaux : h1, h2, h3, h4, h5 et h6. h1 est le niveau le plus élevé de la page. h6 est le plus bas. Ces balises servent au sens et à la structure. La taille visuelle peut être changée plus tard avec CSS ; ne choisissez pas un niveau seulement parce que vous voulez un texte plus grand ou plus petit.
Réponse directe
Utilisez les titres pour construire un plan clair. Préférez un h1 clair pour le sujet de la page. Utilisez h2 pour les sections principales sous ce sujet, puis h3 pour les sous-sections, et ainsi de suite. Gardez les niveaux dans l’ordre quand vous le pouvez — passer de h1 directement à h4 rend souvent le plan plus difficile à suivre.
Niveaux de titres
html<h1>Titre principal de la page</h1>
<h2>Titre de section</h2>
<h3>Titre de sous-section</h3>
<p>Texte de paragraphe sous la sous-section.</p>Lire l’exemple
h1présente le sujet de toute la pageh2commence une section principale sous ce sujeth3commence une partie plus petite dans cette section- Le paragraphe est du texte de corps normal, pas un titre
Pourquoi l’ordre des titres compte
Les titres créent un plan de document, semblable à une table des matières. Les lecteurs d’écran et certains outils SEO utilisent ce plan. Si vous sautez des niveaux seulement pour l’apparence, la structure devient confuse même si la page vous « paraît bien ».
Un h1, puis des sections
Pour les pages débutantes de ce cours, gardez un h1 clair. Organisez ensuite le contenu avec h2 et des niveaux plus profonds si besoin. Des plans plus avancés viendront plus tard ; maîtrisez d’abord ce motif simple et lisible.
Un petit plan de page
html<h1>Guide de la ville</h1>
<h2>Se déplacer</h2>
<p>Conseils pour bus et trains.</p>
<h2>Nourriture</h2>
<h3>Street food</h3>
<p>En-cas locaux rapides.</p>
<h3>Restaurants assis</h3>
<p>Lieux pour un repas plus long.</p>Les titres ne sont pas pour l’espace vide
N’utilisez pas de balises de titre vides pour créer de l’espace vertical. N’enveloppez pas chaque phrase en gras dans un titre. Si le texte n’est pas un vrai titre de section, utilisez un paragraphe ou un autre élément adapté.
Essayez vous-même
- Créez ou ouvrez un fichier HTML avec le squelette de base
- Ajoutez un
h1qui nomme le sujet de la page - Ajoutez deux sections
h2avec un court paragraphe sous chacune - Sous un
h2, ajoutez unh3et un court paragraphe - Enregistrez et ouvrez la page — vérifiez que le plan est facile à parcourir
Erreurs fréquentes
- Choisir les niveaux de titre seulement selon la taille de police au lieu de la structure
- Sauter de
h1àh4sans raison - Utiliser plusieurs
h1sur une page débutante simple quand un titre principal clair suffit - Mettre de longs paragraphes dans des balises de titre
- Utiliser les titres comme espaceurs décoratifs sans vrai titre de section
Résumé
- Les titres utilisent
h1àh6pour les niveaux de titre - Ils construisent structure et plan, pas seulement la taille visuelle
- Préférez un
h1clair, puis des sectionsh2–h6ordonnées - Évitez de sauter des niveaux seulement pour le style
- Gardez le texte de titre court et semblable à un titre
- Stylez la taille plus tard avec CSS ; gardez les titres HTML sémantiques
🧠 Testez Vos Connaissances
Testez Vos Connaissances
Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet
📝 Instructions
- Lisez chaque question attentivement
- Sélectionnez la meilleure réponse pour chaque question
- Vous pouvez refaire le quiz autant de fois que vous le souhaitez
- Votre progression sera affichée en haut