Objectif

• Veiller à ce que les actions possibles ou indisponibles pendant la saisie d'un formulaire soient compréhensibles pour tous les utilisateurs.
• Ne pas créer d’incohérence entre ce qui est affiché et ce qui est utilisable.
• Expliciter pour tous les utilisateurs la présence et l’état d’une bouton d’action, quel que soit le mode d’accès.

Mise en œuvre

Pour que l’interface soit compréhensible, l’élément et son statut (désactivé/activé) doivent être restitués quel que soit le mode d’interaction (outils d'assistance ou non). L’action étant empêchée jusqu'au moment où le formulaire peut être validé, la raison et l'état du bouton doivent être explicites :

• Ne pas utiliser l’attribut HTML disabled, pour que l’utilisateur ne soit pas déconcerté par l’éventuelle absence de bouton de soumission, notamment quand un bouton (visible pour certains) n'est plus atteignable lors de la navigation au clavier,
• Utiliser l’attribut aria-disabled="true" pour que le bouton reste perceptible, atteignable et signalé comme tel,
• Utiliser JavaScript pour bloquer l’action sur le bouton au clic et au clavier, puis sa réactivation,
• Utiliser aria-describedby ou aria-label pour expliquer pourquoi le bouton est indisponible/disponible.
• Utiliser JavaScript pour expliquer pourquoi le bouton "grisé" est indisponible lors du survol ou de l'accès clavier, via un tooltip ou autre.

Contrôle

Auteur Opquast - Consulter la licence

Découvrez la certification Opquast

• Une formation et une certification 100% en ligne
• 14 heures en ligne en autonomie, disponible 24h/24, 7j/7
• guide de 200 pages, des quiz, un glossaire, des examens blancs, des articles des videos
• Pour tous les professionnels du Web : marketing, commerciaux, UX, chefs de projet, designers, développeurs, ingénieurs informatiques.
• Une approche multidisciplinaire : SEO, accessibilité, sécurité, écoconception… pour tous les professionnels, débutants comme confirmés.

Module de sensibilisation
Inscription gratuite