Enlaces adyacentes
Silktide detecta pares de enlaces que están uno junto al otro y apuntan al mismo destino. Estos duplicados casi siempre deben combinarse en un único enlace.
El patrón más común es un enlace de imagen seguido de un enlace de texto al mismo destino:
<!-- Problema: dos enlaces independientes al mismo destino -->
<a href="news.html">
<img src="photo.jpg" alt="">
</a>
<a href="news.html">
News
</a>
<!-- Solución: un único enlace combinado -->
<a href="news.html">
<img src="photo.jpg" alt="">
News
</a>
Por qué es importante
Muchas personas recorren una página de forma secuencial: quienes usan el teclado avanzan con Tab por cada enlace y las personas usuarias de oyen cada enlace anunciado. Los enlaces adyacentes duplicados duplican ese trabajo sin aportar beneficio: el mismo destino se anuncia dos veces, las listas de enlaces se llenan de repeticiones y un enlace de imagen con vacío junto a su gemelo de texto puede anunciarse sin nombre alguno, lo cual resulta confuso.
Combinar el par en un único enlace ofrece a todo el mundo un destino único y claramente nombrado, y simplifica tu .
Cómo solucionarlo
- Coloca la imagen y el texto dentro de un único elemento
<a>, como en el ejemplo anterior. - Asigna a la imagen dentro del enlace combinado un
alt="", ya que el texto junto a ella ya nombra el destino; consulta Texto alternativo duplicado. - Si tu o tema genera los enlaces duplicados (común en listados de noticias y diseños de tarjetas), corrige la plantilla una vez para resolver todas las instancias.
Cómo lo comprueba Silktide
- Busca todos los enlaces en cada página.
- Ignora los enlaces que apuntan a
#, que casi siempre son marcadores de posición para , y los enlaces que no pueden recibir el , que no se exponen como enlaces a la . - Para cada enlace, mira qué le sigue inmediatamente. Si cualquier cosa distinta de espacio en blanco separa los dos enlaces, no son adyacentes y no se informan.
- Informa del par cuando el siguiente enlace se resuelve en la misma URL absoluta.
Resolución de problemas
Los dos enlaces realizan acciones diferentes
No se informan los enlaces que comparten una URL pero ejecutan JavaScript distinto cuando la diferencia es
visible en sus atributos onclick. Si un par se comporta de forma diferente de un modo que Silktide no puede ver,
puedes el hallazgo; pero valora si la distinción es igual de invisible para tus visitantes.
Los enlaces no están juntos visualmente
La adyacencia se mide en el código de la página, no en la pantalla. Dos enlaces pueden parecer muy separados tras el estilo y aun así ser adyacentes en el HTML; y la tecnología de asistencia lee el orden del HTML, por lo que la duplicación es real para esas personas.