string

aria-roledescription

Fournit un nom lisible par l'humain pour le rôle d'un élément, remplaçant le nom de rôle ARIA par défaut annoncé par les technologies d'assistance.

Description

aria-roledescription permet de remplacer l’annonce du rôle technique (ex : “groupe”) par un texte plus explicite et contextualisé (ex : “diapositive”). C’est utile pour les widgets spécifiques à une application dont la terminologie standard ARIA ne reflète pas bien l’usage réel.

Syntaxe

<div role="group" aria-roledescription="diapositive" aria-label="Diapositive 1 sur 5">

</div>

Exemples

Carrousel avec description de rôle :

<section aria-roledescription="carrousel" aria-label="Dernières actualités">
  <div role="group" aria-roledescription="diapositive" aria-label="1 sur 3">

  </div>
  <div role="group" aria-roledescription="diapositive" aria-label="2 sur 3" aria-hidden="true">

  </div>
</section>

Notes

Utiliser avec parcimonie : aria-roledescription remplace complètement l’annonce du rôle natif. Si la description choisie n’est pas claire, l’utilisateur perd le contexte sémantique.

Localisation : la valeur est du texte dans la langue de l’interface. Adapter le texte pour chaque langue si le site est multilingue.

Ne pas redéfinir les rôles standards : ne pas utiliser aria-roledescription pour remplacer des rôles bien connus (button, link, checkbox) — cela désorientera les utilisateurs habitués aux annonces standards.

Support navigateurs