Cuando redactamos enlaces en una página web, pocas veces pensamos en cómo los interpreta una persona con discapacidad visual que navega con un lector de pantalla. Frases como “haz clic aquí” o “más información” pueden parecer inofensivas, pero para muchas personas representan una barrera.
En este artículo aprenderás cómo escribir enlaces accesibles, descriptivos y comprensibles, alineados con las pautas de accesibilidad web (WCAG) y con las buenas prácticas de UX Writing.
¿Cómo navega un lector de pantalla por los enlaces?
Los usuarios de lectores de pantalla —como JAWS, NVDA o VoiceOver— pueden acceder a una lista de todos los enlaces de una página, sin contexto. En esa lista, solo se lee el texto de anclaje de cada enlace.
¿Qué pasa si todos dicen «haz clic aquí»?
Exactamente: no hay forma de saber a dónde llevan. Por ejemplo:
- “Haz clic aquí”
- “Más info”
- “Ver más”
Así es imposible entender el propósito de los enlaces. Esto rompe con el criterio 2.4.4 de las WCAG, que establece que el propósito de cada enlace debe poder determinarse por su texto, solo o en conjunto con su contexto inmediato.
¿Por qué “haz clic aquí” es una mala práctica?
- No es descriptivo: No indica hacia dónde lleva el enlace.
- Depende del contexto visual: Las personas sin visión no pueden “ver” lo que rodea al enlace.
- Es problemático para la navegación por teclado o pantalla táctil: El término «clic» es específico de mouse.
- No ayuda al SEO ni al escaneo rápido del contenido.
- Reduce la usabilidad y accesibilidad general del sitio.
En resumen: es una práctica obsoleta e inclusivamente excluyente.
Entonces… ¿Cómo escribir enlaces accesibles?
La regla general es sencilla:
El texto del enlace debe describir claramente el destino o la acción esperada.
Algunos consejos clave:
- Usa verbos activos y precisos.
- No repitas la URL como texto del enlace.
- Evita frases genéricas como «aquí», «esto», «leer más».
- Si el enlace está dentro de una imagen o botón, añade un atributo alt o aria-label descriptivo.
Antes y Después: Ejemplos de Enlaces Accesibles
| ANTES (NO ACCESIBLE) | DESPUÉS (ACCESIBLE) |
|---|---|
| Haz clic aquí | Descarga la guía completa de accesibilidad web |
| Más información | Conoce cómo funciona un lector de pantalla |
| Lee esto | Consulta las pautas WCAG oficiales |
| Ver video | Mira el video sobre diseño inclusivo |
| Esto te puede interesar | Descubre buenas prácticas de enlaces accesibles |
Tip Pro: ¿Y si el enlace está en una imagen o botón?
- Cuando usas una imagen como enlace, debes asegurarte de que el atributo alt describa la acción. Por ejemplo:
<a href=»manual-accesibilidad.pdf»>
<img src=»descargar-icono.png» alt=»Descargar manual de accesibilidad en PDF»>
</a>
- Si estás usando un botón (por ejemplo, en React o con JavaScript), puedes usar aria-label:
<button aria-label=»Ir al formulario de contacto»>Enviar</button>
Así, un lector de pantalla leerá lo que debe, no simplemente «imagen», «botón», o peor aún: nada.
Recursos Recomendados
- Documentación WCAG 2.4.4 – Propósito del Enlace (en contexto)
- Extensión WAVE para auditar accesibilidad web
- Guía de accesibilidad de WebAIM
- axe DevTools para Chrome y Firefox
Buenas Prácticas Finales para Enlaces Web Accesibles
- Revisa tus enlaces con lectores de pantalla o herramientas como WAVE.
- Asegúrate de que todos los enlaces tengan propósito claro fuera de contexto.
- Si usas enlaces en serie (por ejemplo, en listas), varía el texto de anclaje.
- Integra los enlaces de forma natural en la redacción (no al final como “leer más”).
- Añade enlaces semánticos en HTML (<a href=»»>) y no con <div> o <span> simulados.
Preguntas Frecuentes (FAQs)
Es un enlace cuyo texto permite identificar claramente su propósito o destino, incluso sin ver el contexto visual de la página.
Los lectores de pantalla agrupan y leen solo el texto del enlace. Si el texto es genérico, no se entiende el propósito, lo que dificulta la navegación.
Porque no describe el destino del enlace y depende del contexto visual. Además, no es usable en pantallas táctiles ni navegación por teclado.
El criterio 2.4.4 de las WCAG exige que el propósito de un enlace pueda determinarse por su texto o su contexto inmediato. Usar textos genéricos lo incumple.
Utiliza herramientas como axe, WAVE, Lighthouse, o prueba tu sitio con un lector de pantalla para asegurarte de que los enlaces tienen sentido por sí solos.
La normativa que regula en España que los enlaces sean accesibles, además de muchos más requisitos, es el Real Decreto 1112/2018.