Aller au contenu
Bouzid Krita.
← Toutes les notes

· 3 min

Accessibilité : un bouton icône doit avoir un nom

aria-label et aria-hidden en pratique pour les lecteurs d'écran.


Un bouton avec uniquement une icône peut être annoncé simplement comme « bouton » par un lecteur d’écran, sans préciser l’action.

À éviter :

<button><svg>...</svg></button>

Mieux :

<button aria-label="Supprimer le document">
  <svg aria-hidden="true">...</svg>
</button>

aria-label donne un nom accessible, aria-hidden évite d’annoncer l’icône décorative. Une interface compréhensible ne doit pas dépendre uniquement du visuel.