Development #40921
Development #36305: Améliorer l'accessibilité (RGAA) des thèmes
[RGAA] les étapes doivent avoir un role progressbar
0%
Description
Les processus à étapes, comme le formulaire de soumission de plainte, sont des systèmes de progression et doivent avoir un role=progressbar
pour pouvoir indiquer à l'utilisateur l'avancement du processus.
Pour indiquer l'avancement du processus aux technologies d'assistance, on peut utiliser l'exemple suivant :
<div role="progressbar" aria-valuenow="1" aria-valuemin="0" aria-valuetext="Etape 1 : Le demandeur" aria-valuemax="3"> <ul> <li> Etape 1</li> […] </ul> </div>
Fichiers
Demandes liées
Révisions associées
Historique
Mis à jour par Frédéric Péters il y a environ 4 ans
- Lié à Development #40934: accessibilité, attributs sur la barre d'étapes ajouté
Mis à jour par Frédéric Péters il y a environ 4 ans
- Fichier 0001-templates-add-aria-attributes-to-steps-markup-40921.patch 0001-templates-add-aria-attributes-to-steps-markup-40921.patch ajouté
- Statut changé de Nouveau à Solution proposée
- Patch proposed changé de Non à Oui
Suggestion prévue pour l'ancien balisage, actualisation pour le nouveau mais ça aurait intéressant d'avoir un retour concernant les améliorations déjà en place.
Mis à jour par Marie Kuntz il y a environ 4 ans
Frédéric Péters a écrit :
ça aurait intéressant d'avoir un retour concernant les améliorations déjà en place.
un retour de qui ?
Mis à jour par Frédéric Péters il y a environ 4 ans
Un retour de personnes spécialisées dans l'accessibilité.
Mis à jour par Serghei Mihai il y a environ 4 ans
- Statut changé de Solution proposée à Solution validée
- Assigné à mis à Frédéric Péters
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a environ 4 ans
- Statut changé de Solution validée à Solution proposée
- Assigné à
Frédéric Péterssupprimé
Lors de la mise à jour du module, je suis parti pour en faire un titre (ou sous titre).
Toutes les étapes non active sont en aria-hidden.
Seul l'étape active est retournée sur la forme
"Etape X sur X : label de l'étape en cours"
Je trouvais ça beaucoup plus efficace pour un lecteur d'écran que de devoir parcourir les labels de toutes les étapes. Aujourd'hui le lecteur d'écran d'écran ne retourne que l'étape en cours (ce qu'affiche la version mobile).
Et niveau sémantique je trouvais logique d'en faire un titre.
À voir comment le lecteur d'écran se comporte avec les attribut aria "progressbar".
Mais pour rester logique avec la version mobile, il faudrait que l'attribut progressbar soit uniquement sur l'élément actif.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a environ 4 ans
- Statut changé de Solution proposée à En cours
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a environ 4 ans
https://www.w3.org/WAI/tutorials/forms/multi-page/
En gros, aujourd'hui on est plutôt entre l'approche 2 et 4 (mais surtout 2 en version mobile).
Et l'audit nous conseil l'approche 3.
J'aurais préféré que le role progressbar soit placé sur l'élément ol, pour ne pas remplacer la sémantique de la balise header.
Mis à jour par Frédéric Péters il y a environ 4 ans
Ça me va très bien de ne rien faire si la situation actuelle est considérée correcte.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a environ 4 ans
Ça me va très bien de ne rien faire si la situation actuelle est considérée correcte.
J'en suis pas sûr sûr. On a une balise header mais l'étape active n'est pas un titre pour autant.
Je vais tester les retours de lecteurs d'écran avec et sans progressbar.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a presque 4 ans
suite à l'audit RGAA avec la CNIL, il s'avère que le role progressbar sur ce type de composant est devenu obligatoire depuis RGAA 4 de septembre dernier :
Critère 7.5 Dans chaque page web, les messages de statut sont-ils correctement restitués par les technologies d'assistance ?
Test 7.5.3 : Chaque message de statut qui indique la progression d'un processus utilise-t-il l'un des attributs WAI-ARIA role="log", role="progressbar" ou role="status" ?
Note technique. […] Dans le cas d'un message de statut indiquant la progression d'un processus et matérialisé graphiquement par une barre de progression, un rôle WAI-ARIA progressbar explicite est nécessaire.
Par contre, l'attribut "role" remplace bien la sémantique de la balise sur laquelle il est posé.
Il faudrait donc poser l'attribut "role" sur une balise div intermédiaire entre la balise header et la balise ol (et du coup décaler id et class du header sur cette div je pense)
Mis à jour par Robot Gitea il y a 12 mois
- Statut changé de En cours à Solution proposée
- Assigné à mis à Frédéric Péters
Frédéric Péters (fpeters) a ouvert une pull request sur Gitea concernant cette demande :
- URL : https://git.entrouvert.org/entrouvert/publik-base-theme/pulls/255
- Titre : templates: add progressbar role to form steps (#40921)
- Modifications : https://git.entrouvert.org/entrouvert/publik-base-theme/pulls/255/files
Mis à jour par Robot Gitea il y a 12 mois
- Statut changé de Solution proposée à Solution validée
Thomas Jund (tjund) a approuvé une pull request sur Gitea concernant cette demande :
Mis à jour par Robot Gitea il y a 12 mois
- Statut changé de Solution validée à En cours
Frédéric Péters (fpeters) a fermé une pull request sur Gitea concernant cette demande :
- URL : https://git.entrouvert.org/entrouvert/publik-base-theme/pulls/255
- Titre : templates: add progressbar role to form steps (#40921)
- Modifications : https://git.entrouvert.org/entrouvert/publik-base-theme/pulls/255/files
Mis à jour par Robot Gitea il y a 12 mois
- Statut changé de En cours à Résolu (à déployer)
Frédéric Péters (fpeters) a mergé une pull request sur Gitea concernant cette demande :
- URL : https://git.entrouvert.org/entrouvert/publik-base-theme/pulls/255
- Titre : templates: add progressbar role to form steps (#40921)
- Modifications : https://git.entrouvert.org/entrouvert/publik-base-theme/pulls/255/files
Mis à jour par Transition automatique il y a 12 mois
- Statut changé de Résolu (à déployer) à Solution déployée
templates: add aria attributes to steps markup (#40921)