Maintenant qu'on a une structure propre (<head> et <body>), on peut remplir la page.
Les deux fondations du contenu texte sont : les titres (pour structurer) et les paragraphes (pour développer).
La hiérarchie des titres : la famille des h
En HTML, on ne dit pas "je veux du texte gros et en gras". On dit "ce texte est un titre de niveau 1, 2, 3...".
Cette hiérarchie est importante pour l'utilisateur, mais aussi pour le SEO (quand les moteurs lisent ta page).
Il existe 6 niveaux de titres : de <h1> à <h6>.
<h1> : le titre principal
Dans la plupart des pages, on utilise un seul <h1>.
Il représente le sujet principal du document.
<h2>, <h3>, ... : les sous-titres
Tu peux en utiliser autant que nécessaire pour découper ton contenu en sections et sous-sections.
<h1>Recette du gratin de pommes de terre</h1>
<h2>1. Ingrédients</h2>
<h3>1.1. Pommes de terre</h3>
<h3>1.2. Crème fraîche</h3>
<h2>2. Préparation</h2>
Important : ferme toujours la même balise que celle que tu as ouverte.
Si tu ouvres <h2>, tu fermes </h2>.
Point clé N'utilise pas
<h4>à la place de<h2>juste parce que le style visuel te plaît plus. HTML sert au sens (sémantique), pas au design. Le design vient avec le CSS.
Les paragraphes : la base du texte (<p>)
Tout bloc de texte descriptif se place dans un paragraphe <p>.
<p>
Le gratin dauphinois est un plat traditionnel français. Il se prépare au four avec des pommes de terre et de la crème.
</p>
Le navigateur ajoute automatiquement des espacements autour des paragraphes pour améliorer la lisibilité.
Dans la prochaine leçon, on verra comment mettre en valeur certaines parties du texte (<strong>, <em>, etc.).
Laisser un commentaire