Le problème
Une div avec onclick réagit à la souris sans fournir automatiquement focus, rôle ou activation clavier. Un style de bouton ne crée aucun de ces comportements.
Exemple : mauvais et correct
Mauvais
<div onclick="submitForm()">Envoyer</div>Correct
<form action="/demande" method="post">
<label for="message">Votre demande (obligatoire)</label>
<textarea id="message" name="message" required></textarea>
<button type="submit">Envoyer</button>
</form>Le bouton natif soumet le formulaire. L’adresse est fictive : le serveur doit recevoir et valider la demande.
RGAA concerné
Les critères dépendent de l’élément, de son usage et des cas particuliers applicables. Voici les contrôles à examiner pour ce sujet.
- Critère 7.1 — Exposer le composant scripté.
- Critère 7.3 — Permettre son activation clavier.
- Critère 11.9 — Nommer les boutons de formulaire.
- Critère 10.7 — Rendre le focus visible.
Impact utilisateur
Une commande inaccessible au clavier peut bloquer une tâche. Un nom vague comme « OK » rend aussi les listes de commandes difficiles à comprendre au lecteur d’écran.
Correction
- Remplacez le faux bouton par button. Dans un formulaire, choisissez type="submit" pour envoyer et type="button" pour une action intermédiaire.
- Nommez l’action. Une icône seule exige un nom accessible adapté ; préférez le texte visible lorsqu’il facilite la compréhension.
- Conservez Entrée et Espace. Pour un bouton bascule, synchronisez aria-pressed avec son état réel.
Méthode de test
- Atteignez le bouton avec Tab : son focus doit être visible.
- Activez avec Entrée puis Espace : l’action doit se produire une seule fois.
- Inspectez nom et rôle dans l’arbre d’accessibilité. Pour une bascule, vérifiez aussi l’état avant et après activation au lecteur d’écran.
Points de vigilance
- role="button" ne fournit ni interactions clavier ni gestion du focus.
- Pour naviguer vers une URL, utilisez a avec href.
Sources officielles
Le RGAA fournit les critères de contrôle. Les ressources du W3C et du WHATWG complètent les méthodes de mise en œuvre ; elles ne remplacent pas les tests RGAA.