demarches-simplifiees / demarches-simplifiees.fr

Dématérialiser et simplifier les démarches administratives
https://www.demarches-simplifiees.fr
GNU Affero General Public License v3.0
190 stars 89 forks source link

Dans chaque page web, les messages de statut sont-ils correctement restitués par les technologies d'assistance ? (7.5) #6780

Open tchak opened 2 years ago

tchak commented 2 years ago

Dans chaque page web, les messages de statut sont-ils correctement restitués par les technologies d'assistance ?

Au moins un message de statut n'est pas correctement restitué aux technologies d'assistance.

Messagerie

Par exemple :

Corrections :

Création dossier

Par exemple :

Corrections :

Authentification

Par exemple :

Corrections :

inseo commented 3 months ago

Préambule

Les zones live doivent impérativement être présentes au chargement de la page : elles ne peuvent pas être injectées à la volée en même temps que le message à restituer, faute de quoi ces derniers ne seront pas restitués.

L'attribut aria-live="assertive" (équivalent à un attribut role="alert") est à utiliser pour les informations devant être restituées sans délai à l'utilisateur. Leur vocalisation est immédiate et interrompt l'utilisateur dans sa tâche. L'attribut aria-live="polite" (équivalent à un attribut role="status") est à utiliser pour les informations moins critiques et dont la vocalisation peut attendre que l'utilisateur soit inactif.

Dans tous les cas l'utilisation de l'attribut aria-live doit s'accompagner de l'attribut aria-atomic=”true” qui indique au lecteur d'écran qu'il doit présenter l'ensemble de la zone live, même si une partie seulement a été modifiée.

État des lieux

Les message de status sont tous affichés dans le conteneur suivant : <div aria-live="assertive" id="flash_messages">.

Dans certains cas, ce conteneur reçoit comme contenu une nouvelle zone live : <div role="status">.
Ce qui a pour effet de les imbriquer :

<div id="flash_messages" aria-live="assertive">
  <div id="flash_message" class="center">
    <div class="alert alert-success" role="status">
      Vous êtes connecté(e) ! Vous pouvez à tout moment alterner entre vos différents profils : administrateur, instructeur, expert, usager.
    </div>
  </div>
</div>

Correctif à apporter

La solution la plus simple à implémenter consiste certainement à prévoir deux zones live différentes :

<div id="flash_messages">
  <div id="flash_message" class="center">
    <div role="alert"></div>
    <div role="status"></div>
  </div>
</div>

Suivant la nature du message, ce dernier sera injecté dans la zone live correspondante, en même temps que les classes lui conférant le rendu attendu (class="alert alert-success", par exemple).

inseo commented 3 months ago

Messages informatifs

Éléments à injecter dans la zone live role="status".

controllers/application_controller.rb

users/dossiers_controller.rb

users/sessions_controller.rb

users/activate_controller.rb

manager/users_controller.rb

manager/procedures_controller.rb

manager/outdated_procedures_controller.rb

manager/instructeurs_controller.rb

manager/gestionnaires_controller.rb

manager/administrateurs_controller.rb

instructeurs/procedures_controller.rb

instructeurs/groupe_instructeurs_controller.rb

instructeurs/dossiers_controller.rb

gestionnaires/groupe_gestionnaires_controller.rb

manager/groupe_gestionnaires_controller.rb

gestionnaires/groupe_gestionnaire_gestionnaires_controller.rb

gestionnaires/groupe_gestionnaire_children_controller.rb

gestionnaires/groupe_gestionnaire_administrateurs_controller.rb

administrateurs/groupe_instructeurs_controller.rb

administrateurs/experts_procedures_controller.rb

instructeurs/archives_controller.rb

administrateurs/archives_controller.rb

administrateurs/api_tokens_controller.rb

manager/administrateur_confirmations_controller.rb

inseo commented 3 months ago

Messages importants

Éléments à injecter dans la zone live role="alert".

users/dossiers_controller.rb

controllers/release_notes_controller.rb

instructeurs/batch_operations_controller.rb

experts/avis_controller.rb

groupe_instructeurs_signature_concern.rb

administrateurs/services_controller.rb

users/sessions_controller.rb

users/activate_controller.rb

manager/procedures_controller.rb

manager/gestionnaires_controller.rb

manager/administrateurs_controller.rb

instructeurs/procedures_controller.rb

instructeurs/groupe_instructeurs_controller.rb

gestionnaires/groupe_gestionnaires_controller.rb

manager/groupe_gestionnaires_controller.rb

gestionnaires/groupe_gestionnaire_gestionnaires_controller.rb

gestionnaires/groupe_gestionnaire_administrateurs_controller.rb

administrateurs/groupe_instructeurs_controller.rb

instructeurs/archives_controller.rb

administrateurs/archives_controller.rb

administrateurs/api_tokens_controller.rb

manager/administrateur_confirmations_controller.rb

inseo commented 3 months ago

Reste à déterminer

gestionnaires/groupe_gestionnaire_children_controller.rb

manager/procedures_controller.rb

manager/users_controller.rb

administrateurs/ineligibilite_rules_controller.rb

experts/avis_controller.rb

instructeurs/contact_informations_controller.rb

instructeurs/export_templates_controller.rb

manager/confirmation_urls_controller.rb

manager/dossiers_controller.rb

shared_exemples_for_dossier.rb