heading-order
Les niveaux de titre ne doivent pas sauter de niveau
Vérifie que les niveaux de titre augmentent d’au plus un à la fois dans l’ordre du document.
Applicabilité. S’applique dès que la page contient deux éléments de titre ou plus (<h1>-<h6> natifs, ou role="heading" explicite avec aria-level ; niveau 2 par défaut selon la spécification ARIA lorsque aria-level est absent ou invalide). Un <hx> natif doté d’un aria-level valide (un entier positif) prend ce niveau, comme l’exposent les navigateurs ; sinon, il prend le niveau de sa balise. Un <hx> natif marqué role="none" ou "presentation" reste un titre lorsqu’il peut recevoir le focus ou porte un attribut ARIA global, car la résolution des conflits des rôles de présentation de WAI-ARIA amène alors les navigateurs à ignorer ce rôle. Un élément personnalisé auquel ses ElementInternals donnent le rôle heading (this.attachInternals().role) compte comme role="heading", au niveau que donne son attribut aria-level ou l’ariaLevel de ses ElementInternals.
Attendu. Dans l’ordre dans lequel les technologies d’assistance lisent la page, le niveau de chaque titre ne dépasse pas de plus d’un celui du titre précédent exposé aux technologies d’assistance. Descendre de plus d’un niveau (p. ex. un <h1> directement suivi d’un <h3>, en sautant <h2>) casse le plan du document sur lequel s’appuient les utilisateurs de technologies d’assistance qui naviguent par titres. Remonter à un niveau moins profond est toujours admis, à tout moment.
Ce que rapporte un constat.
fromLevel: le niveau du titre exposé précédent (3 pour un <h3>).toLevel: le niveau de ce titre, plus profond de plus d’un niveau quefromLevel.
Ces champs de data.details aident à lire et à reproduire un constat. À part reasonCode et les quelques champs que la page Schéma de sortie donne comme stables, ils ne constituent pas un contrat stable : un champ peut être renommé ou supprimé dans une version mineure, ne vous appuyez donc pas dessus.
Exemples
<h1>Title</h1><h2>Section</h2><h3>Subsection</h3>
Chaque niveau de titre augmente d’au plus un à la fois.
<h1>Title</h1><h3>Subsection</h3>
Le niveau de titre passe de 1 à 3, en sautant le niveau 2.
Comment vérifier
Quand cette règle ne peut pas trancher, elle renvoie cantTell et laisse la question à une personne. Chaque question qu’elle peut poser figure ici sous son code de raison, avec les étapes pour y répondre. Un constat porte les mêmes étapes dans howToCheck, dans la langue de l’analyse. Voir Schéma de sortie.
HEADING_ORDER_SKIPPED_LEVEL
- Repérez le titre indiqué par le rapport et notez son niveau ainsi que celui du titre précédent (d’après le rapport ou le panneau Accessibilité).
- Listez les titres de la page dans l’ordre, avec la liste des titres d’un lecteur d’écran ou en les inspectant, et regardez la section autour du saut.
- Déterminez si le titre se situe un niveau en dessous du titre précédent, ou s’il manque un niveau.
Réussite. Chaque titre est au plus d’un niveau plus profond que le titre précédent : la structure n’a donc pas de trou.
Échec. Le titre descend de plus d’un niveau par rapport au précédent (un h2 suivi d’un h4), ce qui laisse un trou dans la structure, un manquement aux bonnes pratiques (G141).