image-redundant-alt
El texto alternativo de la imagen no debe duplicar el texto visible adyacente
Comprueba que el texto alternativo de un <img> no sea idéntico a otro texto visible ya presente en su elemento padre inmediato.
Ámbito de aplicación. Se aplica a los elementos <img> con texto alternativo no vacío cuyo elemento padre inmediato también tiene otro contenido de texto visible (es decir, nodos de texto además de la propia imagen, habitualmente un <a> o <button> que envuelve tanto una imagen de icono como una etiqueta de texto). Si no encuentra nada por lo que preguntar, devuelve notApplicable, no pass: solo se aplica a lo que su comprobación señala, y no encontrar nada ahí no demuestra que todo esté bien.
Resultado esperado. El texto alternativo de la imagen no es igual (sin distinguir mayúsculas y minúsculas, normalizado) al otro texto visible ya presente en el mismo padre. Cuando ambos están presentes, la tecnología de asistencia anuncia las mismas palabras dos veces para un único control (por ejemplo, un enlace de icono más texto donde el alt del icono duplica el texto del enlace).
Qué informa un hallazgo.
alt: el texto alternativo de la imagen, con los espacios colapsados. Coincide con el texto que tiene al lado.
Estos campos de data.details ayudan a leer y reproducir un hallazgo. Salvo reasonCode y los pocos campos que Esquema de salida indica como estables, no son un contrato estable: un campo puede cambiar de nombre o desaparecer en una versión menor, así que no construyas sobre ellos.
Ejemplos
<a href="/"><img alt="Home" src="home.png">Home</a>
El texto alt de la imagen ("Home") duplica palabra por palabra el texto visible adyacente del enlace; un lector de pantalla lo anuncia dos veces.
<a href="/"><img alt="Home icon" src="home.png">Home</a>
El texto alt ("Home icon") difiere del texto adyacente ("Home").
Cómo comprobarlo
Cuando esta regla no puede decidir, informa cantTell y deja la pregunta a una persona. Cada pregunta que puede plantear aparece aquí bajo su código de motivo, con los pasos para responderla. Un hallazgo lleva los mismos pasos en howToCheck, en el idioma del análisis. Consulta Esquema de salida.
IMAGE_ALT_REDUNDANT
- Localizar la imagen que indica el informe y el texto que la acompaña en el mismo enlace, botón o elemento padre.
- Con un lector de pantalla, desplazarse hasta ese enlace o botón, o leer su nombre calculado en el panel Accesibilidad, y escuchar si las palabras se dicen dos veces.
- Si la imagen ya está oculta a las tecnologías de apoyo, tener en cuenta que no se repite nada.
Se cumple. Las palabras se leen una sola vez: la imagen está oculta o tiene alt="", o su alt añade algo que el texto no dice.
No se cumple. El alt de la imagen repite el texto que la acompaña, así que las mismas palabras se leen dos veces, un incumplimiento de buena práctica (H2).