Chargement...

Titre de page HTML

Les emojis vivent dans le flux de texte de la page. Le titre de page fait un autre travail : il nomme tout le document pour le chrome du navigateur et pour les systèmes de découverte. Les utilisateurs le voient sur l’onglet, dans l’historique et quand ils ajoutent un favori. Les moteurs de recherche s’en servent souvent comme indice fort pour le texte du lien de résultat. Les sites d’apprentissage et la documentation produit doivent bien le faire tôt, car un titre faible gaspille l’attention avant même la lecture du premier paragraphe.

Ce qu’est l’élément title

L’élément HTML title appartient au head du document. Son contenu textuel est une métadonnée pour la page entière. Ce n’est pas un titre stylé qui apparaît dans le body. Vous avez toujours besoin de h1 (et d’autres titres) pour le plan visible que les lecteurs parcourent sur la page elle-même.

Réponse directe

Placez exactement un <title>...</title> à l’intérieur de <head>. Écrivez un texte court, précis et lisible par un humain — par exemple City Guide — Home ou HTML Page Title — pas Untitled, pas un nom de fichier brut, et pas un tas de mots-clés que personne ne voudrait sur un onglet. Le title ne remplace pas le h1 visible. Les deux partagent souvent un thème ; ils restent des éléments différents avec des rôles différents.

Où il vit dans le document

Une page minimale montre clairement la relation : DOCTYPE, html, head avec title, puis body avec un titre visible et du contenu.

Title dans le head

html

HTML Code

<!DOCTYPE html>
<html>
<head>
<title>City Guide — Home</title>
</head>
<body>
<h1>Welcome to the City Guide</h1>
<p>The h1 is visible on the page; the title labels the browser tab.</p>
</body>
</html>

Lecture de l’exemple

<title>City Guide — Home</title> se trouve dans head
L’onglet du navigateur devrait afficher ce libellé (l’UI exacte varie un peu selon le navigateur)
<h1>Welcome to the City Guide</h1> est ce que les lecteurs voient dans le corps de la page
Les balises fermantes et l’imbrication restent du HTML ordinaire — aucune syntaxe spéciale pour title au-delà de l’élément lui-même

title vs h1 en un coup d’œil

📊 title versus h1

Sujet	title	h1
Place dans le document	Dans head	Dans body
L’utilisateur le voit comme	Onglet / favori / beaucoup de titres de résultats	Titre principal sur la page
Rôle SEO	Signal fort de libellé du document	Aide le plan de page et la pertinence
Combien	Un par document	En général un h1 principal (d’autres titres existent en h2+)
Remplace l’autre ?	Non	Non

Pourquoi un bon title compte

Les onglets se remplissent vite quand on apprend avec de nombreuses pages ouvertes. Un titre précis aide à retrouver la bonne leçon. Les favoris héritent du même texte. Les listes de recherche affichent souvent le title comme titre cliquable. Des titres vagues comme Document ou Page 2 forcent l’utilisateur à ouvrir l’onglet juste pour se souvenir de quoi il s’agissait.

Écrire un texte de title clair

Visez une formulation qu’un humain reconnaîtrait dans une bande d’onglets bondée. Incluez le sujet et, quand c’est utile, le contexte du site ou de la leçon. Gardez-le lisible à voix haute. Évitez d’entasser tous les synonymes dans une seule chaîne. Préférez HTML Lists — Practice à lists ul ol html tutorial best seo lists lists.

Title clair versus title faible

html

HTML Code

<!-- Prefer -->
<title>HTML Lists — Practice</title>

<!-- Avoid -->
<title>Untitled</title>
<title>aaaaaaaa</title>
<title>lists lists lists seo seo seo</title>

Schémas qui marchent pour les débutants

Le sujet d’abord, puis un court contexte : Forms — Contact page
Cours ou marque après un tiret cadratin quand plusieurs sites partagent des sujets proches
Respectez la promesse de la page : si la leçon parle des titres, dites-le
Mettez à jour le title quand vous dupliquez un fichier pour une nouvelle leçon — ne gardez pas le libellé d’hier

Un seul élément title par page

Les documents HTML sont conçus pour avoir un seul title dans head. Plusieurs éléments title embrouillent les outils et ne créent pas d’onglet multi-lignes utile. Si un modèle produit par erreur deux titles, corrigez le modèle plutôt que d’« ajouter encore des libellés ».

Title et SEO sans mythes

Un title clair aide les moteurs à comprendre la page et aide les humains à cliquer sur le bon résultat. Ce n’est pas un code magique de classement. Bourrer de mots-clés au point de ruiner l’expérience d’onglet fait en général plus de mal que de bien. Écrivez d’abord pour la personne qui parcourt les onglets et les résultats ; le bénéfice recherche suit un libellé honnête.

Pratiquez dans votre éditeur

Créez une page HTML minimale avec head et body.
Définissez <title> avec une formulation claire sur votre page d’exercice.
Ajoutez un h1 qui partage le thème mais utilise un autre libellé.
Ouvrez le fichier et lisez le texte de l’onglet du navigateur.
Changez uniquement le title, enregistrez, actualisez — confirmez que l’onglet se met à jour tandis que le h1 reste identique.
Réécrivez un title faible (Untitled) en un title précis et comparez le ressenti de l’onglet.

Erreurs faciles

Placer title dans le body au lieu du head
Laisser Untitled document ou un nom de fichier temporaire pour toujours
S’attendre à ce que title s’affiche comme le grand titre sur la page (c’est h1)
Bourrer le title de mots-clés répétés jusqu’à le rendre illisible comme libellé d’onglet
Copier le même title sur de nombreuses leçons différentes pour que chaque onglet se ressemble
Utiliser uniquement des emojis ou uniquement de la ponctuation comme title entier

Résumé

title appartient au head et libelle tout le document
Les utilisateurs le rencontrent sur les onglets, les favoris et souvent les résultats de recherche
h1 est le titre visible principal dans body — thème lié, rôle différent
Écrivez un title clair et précis par page
Préférez des libellés lisibles par un humain à Untitled ou aux tas de mots-clés

🧠 Testez Vos Connaissances

Prêt à Commencer

Testez Vos Connaissances

Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet

❓

Questions

🎯

70%

Pour Réussir

♾️

∞

Temps

🔄

∞

Tentatives

📝 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

Langue