Rôle alert
Le bouton suivant déclenche l'apparition d'un message d'erreur en bas de page et sa vocalisation grâce à la propriété role="alert" :
Remarque : le lecteur d'écran détecte les changements dans la live region. En conséquence, si le texte de la live region ne change pas lorsque l'utilisateur déclenche une seconde fois l'erreur, le message ne sera pas vocalisé.
<div id="errorText" class="alert" role="alert"></div>Rôle status
Le bouton suivant déclenche l'apparition d'un message de succès en bas de page et sa vocalisation grâce à la propriété role="status" :
Remarque : le lecteur d'écran détecte les changements dans la live region. En conséquence, si le texte de la live region ne change pas lorsque l'utilisateur déclenche une seconde fois l'erreur, le message ne sera pas vocalisé.
<div id="successText" class="status" role="status"></div>Rôle log
Le bouton suivant déclenche l'apparition de notifications s'empilant les unes à la suite des autres en bas de page et leur vocalisation grâce à la propriété role="log" (cliquez plusieurs fois) :
<div id="notifText" class="log" role="log"></div>