Description
Cette technique présente l’utilisation du rôle alertdialog
role.
Le rôle alertdialog
est utilisé pour notifier à l’utilisateur des informations urgentes qui requièrent son attention immédiate. Comme le nom l’indique, alertdialog
est un type de boîte de dialogue. Cela signifie que la plupart des instructions fournies à propos de l’utilisation du rôle dialog
s’appliquent également au rôle alertdialog
:
- La boîte de dialogue d’alerte doit toujours avoir un nom accessible (attribué à l’aide de
aria-labelledby
ou dearia-label
) et, dans la plupart des cas, le texte d’alerte sera marqué comme étant la description accessible de la boîte de dialogue d’alerte (définie avec de l’attributaria-describedby
). - Contrairement aux alertes classiques, une boîte de dialogue d’alerte doit avoir au moins un contrôle pouvant recevoir le focus et ce dernier doit s’y placer lors de l’affichage de la boîte de dialogue. Généralement les boîtes de dialogues d’alertes ont au moins un bouton de confirmation, de fermeture ou d’annulation qui peut être utiliser pour recevoir le focus. De plus, les boîtes de dialogues d’alerte peuvent avoir d’autres contrôles interactifs tels que des champs de saisie, des onglets ou des cases à cocher. Le contrôle sur lequel placer le focus dépendra de l’objet de la boîte de dialogue.
- L’ordre de tabulation dans la boite de dialogue de l’alerte doit boucler.
La différence avec les boîtes de dialogues classiques réside dans le fait que le rôle alertdialog
devrait uniquement être utilisé lorsque des alertes, des erreurs ou des avertissements ont lieu. En d’autres termes, lorsque les informations et les contrôles d’une boîte de dialogue nécessitent l’attention immédiate de l’utilisateur il est préférable d’utiliser le rôle alertdialog
plutôt que dialog.
Il revient au développeur de faire la distinction entre les deux.
Du fait de sa nature urgente, les boîtes de dialogues d’alertes doivent toujours être modales. Pour plus d’informations, consultez le guide Gérer les dialogues modaux et non modaux.
alertdialog
n’est probablement pas le rôle le plus judicieux à utiliser. Le rôle alert
est plus adapté pour ce cas (comme décrit dans l’article sur la technique d’utilisation du rôle alert
).Effets possibles sur les agents utilisateurs et les technologies d’assistance
Lorsque le rôle alertdialog
est utilisé, l’agent utilisateur devrait suivre les étapes suivantes :
- Présenter l’élément comme une boîte de dialogue à l’API d’accessibilité du système d’exploitation.
- Déclencher un évènement d’alerte accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.
Lorsque la boîte de dialogue de l’alerte apparaît, les lecteurs d’écran devraient annoncer l’alerte.
Lorsque la boîte de dialogue est correctement labélisée et que le focus se place sur un contrôle qu’elle contient, les lecteurs d’écran devraient annoncer le rôle accessible de la boîte de dialogue, son nom et éventuellement sa description, avant d’annoncer l’élément qui a reçu le focus.
Exemples
Exemple 1 : Une boîte de dialogue d’alerte
L’extrait de code ci-dessous présente la façon de baliser une boîte de dialogue d’alerte qui ne contient d’un message et un bouton OK
.
<div role="alertdialog" aria-labelledby="dialog1Titre" aria-describedby="dialog1Desc"> <div role="document" tabindex="0"> <h2 id="dialog1Titre">Votre session est sur le point d’expirer</h2> <p id="dialog1Desc">Pour prolonger votre session, cliquez sur le bouton OK</p> <button>OK</button> </div> </div>
Exemples concrets :
À définir
Notes
Attributs ARIA utilisés
Techniques ARIA connexes
Compatibilité
À définir : ajouter les informations de prise en charge pour les combinaisons les plus courantes d’agents utilisateurs et de produits de technologies d’assistance.