Test 12.6.1

Les zones de regroupement de contenus présentes dans plusieurs pages web (à l’exception des zones principales constituant la structure du document) respectent-elles au moins une de ces conditions, si nécessaire ?

La zone possède un rôle WAI-ARIA de type landmark correspondant à sa nature.

La zone possède un titre dont le contenu permet de comprendre la nature du contenu de la zone.

La zone peut être masquée par le biais d’un bouton précédent directement la zone dans l’ordre du code source.

La zone peut être évitée par le biais d’un lien d’évitement précédent directement la zone dans l’ordre du code source.

La zone peut être atteinte par le biais d’un lien d’accès rapide visible ou, à défaut, visible à la prise de focus.

Méthodologie 12.6.1

  1. Retrouver dans le document les zones de regroupement de contenus présentes dans plusieurs pages web (à l’exception des zones principales constituant la structure du document).
  2. Pour chaque zone, vérifier que la zone :
    • soit possède un rôle WAI-ARIA de type landmark correspondant à sa nature ;
    • soit possède un titre de hiérarchie dont le contenu permet de comprendre la nature du contenu de la zone ;
    • soit peut être masquée au moyen d’un bouton précédant directement la zone dans l’ordre du code source ;
    • soit peut être évitée au moyen d’un lien d’évitement précédant directement la zone dans l’ordre du code source ;
    • soit peut être atteinte au moyen d’un lien d’accès rapide soit visible par défaut, soit visible à la prise de focus lors d’une tabulation.
  3. Si c’est le cas pour chaque zone de regroupement de contenus, le test est validé.

Tests suivants et précédents au clavier

Test précédent : Maj + ←

Test suivant : Maj + →

Avec ces raccourcis clavier, atteindre

Définitions

Landmarks

WAI-ARIA propose des rôles permettant d’identifier des repères de navigation. Ces rôles sont très profitables aux utilisateurs de lecteurs d’écran notamment, mais également aux utilisateurs de la navigation au clavier qui peuvent ainsi bénéficier de fonctionnalités de navigation rapide.

Les rôles doivent être définis dans le document en fonction de la nature de la zone (grâce à l’attribut WAI-ARIA role ou une balise HTML ayant un rôle implicite, voir la notion de rôle calculé à ce sujet). WAI-ARIA désigne 8 landmarks.

5 landmarks sont exploités dans la structure du document (critère 9.2) :

  • banner
  • contentinfo
  • main
  • navigation
  • search

3 landmarks sont disponibles pour identifier d’autres régions :

  • form (<form> ou role="form")
  • complementary (<aside> ou role="complementary")
  • region (<section> ou role="region").

Les landmarks form et region ne sont identifiés comme repère de navigation que s’ils possèdent un nom accessible.

Voir la section Landmark Roles dans la documentation.

Note 1 : compte tenu du support variable des landmarks form, complementary et region, s’ils sont utilisés dans la page en tant que repères de navigation, ils devront faire l’objet de tests de navigation et de restitution sur l’environnement de test.

Note 2 : Il n’est pas obligatoire d’identifier des repères de navigation autre que ceux requis par le critère 9.2 si le contexte ne le nécessite pas. Par exemple, il n’est pas obligatoire d’identifier tous les formulaires avec un élément form, mais seulement si un contexte de navigation plus ou moins complexe (applicatif par exemple) nécessiterait d’offrir plus de repères de navigation que ne le réclame déjà le critère 9.2.

Liens d’évitement ou d’accès rapide

Liens dont la fonction est de permettre de naviguer à l’intérieur de la page (lien d’évitement, lien d’accès au formulaire de recherche ou au menu…). Ces liens peuvent soit permettre d’accéder à une zone de la page (lien d’accès rapide) ou de sauter une zone dans la page (lien d’évitement).

Note 1 : Un lien d’évitement ou d’accès rapide fonctionnel est un lien dont l’activation permet de reprendre la lecture et la navigation clavier à partir de la cible du lien lors de l’utilisation des navigateurs et des aides techniques retenus dans l’environnement de test (ou « base de référence ») de l’audit.

Note 2 : les liens d’évitements ou d’accès rapide doivent être situés à la même place dans la présentation et dans le même ordre relatif dans le code source afin de satisfaire au critère 12.2.

Rôle calculé

Le rôle ARIA d’un élément peut être calculé de deux façons :

  • sur la base du rôle implicite de l’élément. Par exemple, l’élément <header> a le rôle implicite de banner, l’élément <nav> a le rôle implicite de navigation, etc.
  • sur la base du rôle explicite donné par la valeur de l’attribut WAI-ARIA role sur la balise ouvrante : <div role="banner">.

Lorsque le référentiel indique qu’un élément « a le rôle calculé de », ce peut-être du fait d’un rôle implicite ou explicite.

Par exemple : « L’élément a un rôle calculé de banner » indique que l’élément peut-être un élément HTML5 <header> ou tout autre élément possédant l’attribut WAI-ARIA role="banner". À l’inverse, s’il est indiqué « L’élément est pourvu d’un attribut WAI-ARIA role="banner" », alors c’est bien l’attribut role uniquement qui est attendu.

Voir la documentation : Implicit WAI-ARIA semantics.

Ci-dessous la liste des rôles implicites WAI-ARIA des éléments HTML5 permettant de structurer le document :

  • <footer> : role="contentinfo"
  • <header> : role="banner"
  • <main> : role="main"
  • <nav> : role="navigation"
  • <search> : role="search"

Note : Pour <footer> et <header>, le rôle ne sera calculé que s’ils ne sont pas inclus dans un élément ayant le rôle calculé de article, complementary, main, navigation ou section.

Structure du document

Ensemble d’éléments permettant de définir les grandes zones d’une page HTML telles que la zone d’en-tête de la page, les zones de navigation principale et secondaire, la zone de contenu principal et la zone de pied de page.