Les titres

Lorsque le contenu de votre page va s'étoffer avec de nombreux paragraphes, il va devenir difficile pour vos visiteurs de se repérer. C'est là que les titres deviennent utiles.

En HTML, on est verni, on a le droit d'utiliser six niveaux de titres différents. Je veux dire par là qu'on peut dire « Ceci est un titre très important », « Ceci est un titre un peu moins important », « Ceci est un titre encore moins important », etc. On a donc six balises de titres différentes :

<h1> </h1> : signifie « titre très important ». En général, on s'en sert pour afficher le titre de la page au début de celle-ci.
<h2> </h2> : signifie « titre important », un sous-titre, donc.
<h3> </h3> : pareil, c'est un titre un peu moins important (on peut dire un « sous-sous-titre » si vous voulez).
<h4> </h4> : titre encore moins important.
<h5> </h5> : titre pas important.
<h6> </h6> : titre vraiment, mais alors là vraiment pas important du tout.

Attention : ne confondez pas avec la balise <title> ! La balise <title> affiche le titre de la page dans la barre de titre du navigateur comme nous l'avons vu. Les titres <h1> et compagnie, eux, servent à créer des titres qui seront affichés dans la page web.

Ne vous laissez pas impressionner par toutes ces balises. En fait, six niveaux de titres, c'est beaucoup. Dans la pratique, personnellement, je n'utilise que les balises <h1>, <h2> et <h3>, et très rarement les autres (je n'ai pas souvent besoin de six niveaux de titres différents). Votre navigateur affiche le titre très important en très gros, le titre un peu moins important en un peu moins gros, etc.

Ne choisissez pas votre balise de titre en fonction de la taille qu'elle applique au texte ! Il faut impérativement bien structurer sa page en commençant par un titre de niveau 1 (<h1>), puis un titre de niveau 2 (<h2>), etc. Il ne devrait pas y avoir de sous-titre sans titre principal !
Si vous voulez modifier la taille du texte, sachez que nous apprendrons à faire cela en CSS un peu plus tard.

Complétez votre page web avec des titres pour voir ce que cela donne, vous devez avoir quelque chose comme ça :

<!DOCTYPE html>

<html>

<head>

<title>Titre</title>

</head>

<body>

<h1>La montagne</h1>

<p>J'aime les diots et la polente.</p>

<p>J'aime la montagne et ma Vallée. <br />

La Maurienne, on y est bien. </p>

</body>

</html>

Voilà une page web qui prend forme !

Oui, mais moi je veux centrer mon titre, l'écrire en rouge et le souligner !

Nous ferons tout cela lorsque nous apprendrons le CSS (dès la deuxième partie du cours). Il faut savoir que <h1> ne signifie pas « Times New Roman, taille 16 pt », mais « Titre important ».

Grâce au langage CSS, vous pourrez dire « Je veux que mes titres importants soient centrés, rouges et soulignés ». Pour le moment, en HTML, nous ne faisons que structurer notre page. Nous rédigeons le contenu avant de nous amuser à le mettre en forme.

Créé avec HelpNDoc Personal Edition: Générer des livres électroniques EPub facilement