Rôle et attributs ARIA
Rôles et attributs ARIA générés par défaut
- Élément principal : <nav role=”navigation”>
- Attributs ARIA utilisés :
- aria-labelledby pointant vers le libellé
- Liste de liens : role=”list”
- Parent de chaque lien : role=”listitem”
Attributs de l’élément ayant un impact sur l’accessibilité
|
Attribut |
Impact |
|---|---|
|
label |
Modifie le libellé du sommaire. Par défaut, “Sommaire” ou sa traduction. |
|
mobile |
Donne au libellé les attributs role=”button”, tabindex=”0”, aria-controls (pointant vers la liste), et aria-expanded avec la valeur de open. Affiche une barre de progrès avec role=”progressbar” et aria-hidden=”true”. |
|
open |
Avec l’attribut mobile, affiche la liste de liens et modifie la valeur de aria-expanded. |
Navigation et interaction clavier
Touches supportées :
- Avec l’attribut mobile :
- Esc → Ferme le panneau, et déplace le focus sur l’élément déclencheur
- Tab → Fermeture du panneau si le focus devait en sortir
- Espace, Entrer → Sur l’élément déclencheur, ouverture/fermeture du panneau
Bonnes pratiques et pièges à éviter