Corregir «Elemento role=img sin alternativa» en HTML

Por qué es un problema

Con role="img" y sin nombre accesible, el lector de pantalla solo anuncia «imagen».

Cómo corregirlo — HTML

Añada aria-label o aria-labelledby; si es decorativa, quite el rol y use aria-hidden="true".

<span class="icon icon-alerte" role="img"></span>

<!-- Image porteuse d'information : un nom -->
<span class="icon icon-alerte" role="img" aria-label="Alerte : régression détectée"></span>

<!-- Icône décorative à côté d'un texte : masquée -->
<span class="icon icon-alerte" aria-hidden="true"></span> Régression détectée

Compruebe su sitio en 30 segundos

Conformly detecta este tipo de problema en todas sus páginas, de forma continua, y le avisa en cada regresión.

Otras correcciones

• Image sans alternative textuelle
• Bouton sans intitulé accessible
• Lien sans intitulé
• Champ de formulaire sans étiquette