Identifiant aria-controls manquant

Silktide vérifie chaque attribut aria-controls sur vos pages et confirme que les identifiants d'élément qu'il répertorie existent bien. Cet attribut indique quelle partie de la page un contrôle agit, par exemple le panneau qu'un onglet affiche ou le menu qu'un bouton ouvre.

<!-- Problème : aucun élément de la page n'a id="filter-panel" -->
<button aria-expanded="false" aria-controls="filter-panel">Filtres</button>

Pourquoi c'est important

L' aria-controls permet aux de relier un contrôle au contenu qu'il affecte - certains proposent un raccourci pour aller directement à l'élément contrôlé. Quand la référence est rompue, cette relation disparaît silencieusement. Des références rompues signifient généralement qu'un identifiant a été renommé ou qu'un composant a été supprimé ; c'est aussi un signal précoce que le widget lui-même peut ne plus fonctionner comme prévu.

Comment le corriger

Faites en sorte que chaque identifiant listé dans aria-controls corresponde à l'attribut id d'un élément réel sur la même page. L'attribut peut lister plusieurs identifiants séparés par des espaces ; vérifiez chacun d'eux.
Si l'élément contrôlé est ajouté dynamiquement, soit incluez-le dès le départ (masqué), soit définissez aria-controls une fois qu'il existe.
Si l'élément contrôlé a définitivement disparu, supprimez l'attribut.

Comment Silktide teste cela

Trouver chaque élément de la page avec un attribut aria-controls.
Comparer chaque identifiant référencé aux identifiants d'élément présents sur la page.
Signaler chaque référence qui ne correspond à aucun élément.

Dépannage

La cible est créée plus tard par un script

Silktide teste la page lors de son chargement. Si le panneau référencé n'apparaît qu'après une interaction utilisateur, la référence est rompue jusque-là - il est préférable de conserver la cible dans la page (masquée) afin que la référence se résolve toujours.

Ce contrôle ne signale rien alors que je m'attends à des anomalies

Les tests ARIA peuvent être désactivés site par site. Vérifiez les paramètres avancés du site.