---
title: "Structure des titres : comment lecteurs d’écran et moteurs de recherche lisent votre page"
description: "Ce sujet se rattache à notre dossier accessibilité numérique. Un titre sert d’abord à s’orienter Une personne aveugle ne parcourt pas votre page ligne après ligne. Son lecteur d’écran lui propose la liste de tous les titres, et elle choisit d’un coup la partie qui répond à sa question. Pour elle, vos h2 et vos […]"
url: "https://www.newp.fr/accessibilite-numerique/structure-des-titres/"
author: ""
date: "2026-09-20T09:27:36+00:00"
modified: "2026-09-21T18:33:16+00:00"
lang: "fr_FR"
---

# Structure des titres : comment lecteurs d’écran et moteurs de recherche lisent votre page

 Ce sujet se rattache à notre dossier [accessibilité numérique](/accessibilite-numerique/).

 

## Un titre sert d’abord à s’orienter

 Une personne aveugle ne parcourt pas votre page ligne après ligne. Son lecteur d’écran lui propose la liste de tous les titres, et elle choisit d’un coup la partie qui répond à sa question. Pour elle, vos `h2` et vos `h3` *sont* le plan du document.

 Si l’on choisit le niveau pour son rendu visuel (on garde un `h3` parce qu’il « fait plus joli »), ce plan devient trompeur et la navigation par titres ne sert plus à rien.

## Trois principes à respecter

1. **Une page, un `h1`** : il annonce le thème traité, et rien d’autre.
2. **On descend d’un niveau à la fois.** Un `h2` peut être suivi d’un autre `h2` ou d’un `h3`, mais pas d’un `h4`. Remonter de deux ou trois niveaux d’un seul coup reste tout à fait correct : cela signifie simplement que plusieurs sections se terminent en même temps.
3. **La place dans le plan fixe le niveau**, pas la taille des caractères. Si l’aspect ne vous plaît pas, modifiez la CSS plutôt que la balise.
 
 Titres simulés et titres détournés Une ligne en gras, en corps 24, a toute l’allure d’un intitulé. Pour un lecteur d’écran, c’est pourtant un paragraphe ordinaire : absente du plan, elle reste inaccessible par les raccourcis de navigation. Nous la rencontrons dans presque tous les contenus saisis à la main, et personne ne la remarque en regardant simplement la page.

 Le défaut symétrique existe : une balise de titre posée sur une citation ou un slogan, uniquement pour l’agrandir. Le plan se remplit alors d’entrées qui n’annoncent aucune section.

 

## Quand le gabarit décide à votre place

 Sur un site produit à grande échelle, ce n’est pas l’auteur qui choisit les niveaux, c’est le modèle de page. Deux défauts reviennent sans cesse :

- **Un bloc latéral titré en `h3`** qui s’affiche avant le premier `h2` du contenu : le saut de niveau se reproduit alors sur chaque page du site.
- **Un composant dont le niveau est figé dans le code.** Un encart « à lire aussi » écrit en dur en `h2` devient incorrect dès qu’on le place à l’intérieur d’une sous-section. Le niveau doit se régler au moment de l’insertion.
 
## Contrôler la hiérarchie

 Première vérification, manuelle : affichez uniquement les titres de la page et lisez-les comme un sommaire. Si ce squelette ne vous permet pas de deviner le contenu, le plan doit être retravaillé.

 Seconde vérification, automatisée : c’est l’un des rares critères qu’un robot évalue sans se tromper. Nous conseillons de l’intégrer à la chaîne de publication, pour que toute page comportant plusieurs `h1` ou un niveau sauté soit bloquée avant sa mise en ligne.

## Un gain qui dépasse le handicap

 Les robots d’indexation et les moteurs de réponse s’appuient eux aussi sur les titres pour découper un texte en passages cohérents. Nous expliquons ces points communs dans notre page consacrée à [l’accessibilité et le référencement naturel](/accessibilite-numerique/accessibilite-et-seo/).

  [ Sujet précédent Rédiger les alternatives textuelles ](/accessibilite-numerique/alternatives-textuelles/) [ Sujet suivant Les attributs ARIA ](/accessibilite-numerique/aria/)

---

*Source : [www.newp.fr](https://www.newp.fr/accessibilite-numerique/structure-des-titres/)*