Navigation

Navigation au clavier

  • 12.13 [A] L’ordre de tabulation doit être cohérent.
  • 12.14 [A] Il ne doit pas exister de piège au clavier !

Zones de navigation et zone de contenu

12.10 [A] Identification des zones de navigation et de la zone de contenu.

  • Les liens de navigation doivent être inclus dans un élément <nav> ; cet élément doit être identifié au moyen d’un attribut id unique.
  • La zone de contenu principal (élément <main>) doit être identifiée au moyen d’un attribut id unique.

Les rôles ARIA suivants doivent être attribués aux différentes zones de la page :

  • en-tête : role="banner"
  • navigation : role="navigation"
  • recherche : role="search"
  • contenu principal : role="main"
  • pied de page : role="contentinfo"

Le rôle main doit être unique. Le rôle navigation doit être réservé aux zones de navigation (principale et secondaires).

N.B. : Les éléments HTML suivants possèdent un rôle ARIA implicite :

<header role="banner"></banner>
<nav role="navigation"></navigation>
<main role="main"></main>
<footer role="contentinfo"></footer>

Voir aussi Rôle des éléments HTML et Modèle de contenu des éléments HTML.

Voir aussi Structure du document au chapitre Structuration de l’information.

12.11 A Liens d’évitement ou d’accès rapide.

Dans chaque page, on doit trouver des liens permettant d’accéder directement à la zone de contenu et aux zones de navigation. Ces liens doivent :

  • se trouver au même endroit dans la page ;
  • se trouver dans le même ordre du code source ;
  • être visibles à la prise de focus de tabulation au moins.

Deux systèmes de navigation différents, au moins

12.1 [AA] L’utilisateur doit disposer de deux systèmes de navigation au moins, parmi les suivants :

  • un menu de navigation ;
  • une page  « plan du site » ;
  • une fonction de recherche.

Menu de navigation

  • 12.2 [AA] Le menu doit toujours se trouver au même endroit.
  • 12.3 [AA] La présentation du menu doit être cohérente.

Plan du site

  • 12.4 [AA] La page « plan du site » doit être pertinente.
  • 12.5 [AA] La page « plan du site » doit être accessible de manière identique depuis toutes les pages.

Recherche

12.6 [AA] Le formulaire de recherche doit toujours se trouver au même endroit dans la page (ou la fonction de recherche doit être accessible de manière identique depuis toutes les pages).

Navigation dans les collections de pages

12.7 [AA] Des liens doivent permettent de naviguer facilement d’une page à l’autre (page suivante / précédente…).

Fil d’Ariane

  • 12.8 [AAA] Un fil d’Ariane se trouve sur les pages.
  • 12.9 [AAA] Ce fil d’Ariane représente la hiérarchie des pages.

Page courante

12.12 [AAA] La page courante est indiquée dans le menu de navigation.