Texte alternatif du bouton image
Silktide repère les boutons image dans vos formulaires qui n’ont pas de . Un bouton image sans texte alternatif ne donne aucun moyen aux personnes qui ne peuvent pas le voir de savoir ce que fera le fait de l’activer.
<!-- Problème : pas d’attribut alt -->
<input type="image" src="button.png">
<!-- Problème : alt vide -->
<input type="image" src="button.png" alt="">
<!-- Corrigé : le texte alternatif nomme l’action -->
<input type="image" src="button.png" alt="Envoyer un message">
Pourquoi c’est important
Un bouton image (<input type="image">) utilise une image à la place d’une étiquette textuelle, son attribut alt est donc le seul nom qu’un peut annoncer. Sans cet attribut, le bouton est annoncé simplement comme « bouton » ou par son nom de fichier. Un formulaire dont le bouton d’envoi ne peut pas être identifié est un formulaire que certains visiteurs ne peuvent pas remplir en toute confiance — un obstacle direct aux demandes, aux inscriptions et aux achats.
Contrairement aux images ordinaires, un bouton ne peut jamais être décoratif : il fait toujours quelque chose, il a donc toujours besoin d’un nom.
Comment corriger
- Ajoutez un attribut
altqui nomme l’action effectuée par le bouton, par exemple « Rechercher » ou « Envoyer un message », comme dans l’exemple ci-dessus. - Ne laissez pas l’attribut vide — un
alt=""vide masque le nom du bouton sans masquer le bouton. - Vous pouvez aussi remplacer le bouton image par un élément
<button>contenant du vrai texte, plus simple à styliser et accessible par défaut.
Comment Silktide teste cela
- Trouver chaque bouton image (
<input type="image">) sur chaque page. - Ignorer les boutons masqués aux lecteurs d’écran.
- Signaler chaque bouton dont l’attribut
altest manquant ou vide.
Les boutons dont le texte alternatif existe mais semble peu utile sont couverts par la vérification distincte Texte alternatif du bouton d’envoi.