Principio 1/1.1 Texto Alternativo/1.1.1-H

1.1.1-H. Combinación de enlaces e imágenes

1_Perceptible 1.1_Textos_alternativos

• Nivel: A
• Versión: 2.0
• Principio: 1_Perceptible
• Pauta: 1.1_Textos_alternativos
• Grupo: Contenido
• Subgrupo: No-texto

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

• Visual total – Barrera grave

Enunciado del criterio (Observatorio de Accesibilidad Web)

• Cuando un enlace y una imagen actúan como enlace al mismo recurso, deben combinarse en un solo enlace para simplificar la navegación.

Comprensión del criterio

Descripción resumida

Si una imagen y un texto apuntan al mismo recurso, ambos deben estar dentro del mismo enlace.

Esto evita que las tecnologías de apoyo anuncien dos enlaces iguales consecutivos, lo cual genera confusión y navegación ineficiente.

Objetivo

Optimizar la claridad y la eficiencia de la navegación para usuarios de lectores de pantalla o teclado, evitando redundancias innecesarias.

Importancia de cumplir el criterio

Cuando los enlaces están duplicados, un usuario con discapacidad visual puede escuchar dos veces el mismo destino.

Esto dificulta la comprensión y ralentiza la navegación.

Unirlos en un solo enlace evita confusiones.

Referencias WCAG

• Understanding Success Criterion 1.1.1
• Technique H2 – Combining adjacent image and text links

Recursos de apoyo

No hay

Evaluación del criterio

Tipo de evaluación

Evaluación Semiautomática

Procedimiento de evaluación

Usa la herramienta de Web Developer Toolbar.

1. Paso 1. Seleccionar Images – Display alt attributes.
2. Paso 2. Localizar las imágenes que actúan como enlaces.
3. Paso 3. Usando la herramienta de inspección de código del navegador, verificar que no existan enlaces consecutivos al mismo recurso.

Resultado esperado

Imagen y texto enlazados al mismo destino están unidos en un solo enlace accesible, evitando duplicación de enlaces.

Ejemplo

Se indica en el texto alternativo el tipo de documento que se descargará el informe anual.

<a href="informe.pdf"><img src="pdf.gif" alt="en formato PDF"> Informe anual</a>

Otras herramientas de evaluación

• Lector de pantalla: JAWS, NVDA, VoiceOver Verificar que solo se anuncia un enlace.
• Inspector del navegador: Confirmar que imagen y texto están dentro del mismo <a>.

Comentarios

A continuación se muestran comentarios sobre el criterio 1.1.1-H. Combinación de enlaces e imágenes

Loading comments...