- Se destaca el problema de usar texto de enlace genérico como "haz clic aquí"
- En relación con la accesibilidad, el texto del enlace debe transmitir con claridad el significado del contenido
- Esto genera un impacto negativo en los motores de búsqueda y en la experiencia de usuarios de lectores de pantalla
- Un texto de enlace claro y con contexto beneficia tanto a los usuarios como a la tecnología
- Desde 2001, se ha impulsado la recomendación de usar texto de enlace correcto desde la perspectiva de los estándares web y los principios de UX
Introducción
- El uso de texto de enlace genérico como "haz clic aquí" o "click here" se consolidó desde hace mucho como una práctica común entre desarrolladores web
- Sin embargo, este enfoque implica desventajas importantes en términos de accesibilidad, usabilidad y SEO
El significado del texto de enlace y sus problemas
- El texto de enlace debe cumplir la función de dar información para que el usuario pueda predecir a dónde lo llevará ese enlace antes de hacer clic
- Si simplemente se escribe algo como "haz clic aquí", el enlace existe sin contexto, lo que provoca confusión para el usuario y una disminución de la accesibilidad
Impacto en la accesibilidad y la experiencia de usuario
- Cuando los usuarios de lectores de pantalla recorren la lista de enlaces de una página, terminan escuchando el mismo contenido: "haz clic aquí", lo que dificulta obtener información
- Cuando el enlace se redacta con una frase específica que incluye significado, aumenta la eficiencia de la experiencia para usuarios con discapacidad visual y para usuarios en distintos contextos
Consideraciones de optimización para motores de búsqueda (SEO)
- Los motores de búsqueda también analizan el texto de enlace para determinar la relevancia y la calidad del contenido
- Un texto de enlace que incluye palabras clave importantes y contexto tiene un efecto positivo en el aumento del ranking de búsqueda y la visibilidad
Recomendaciones para redactar correctamente el texto de enlace
- Se recomienda usar texto de enlace que refleje con claridad el contexto
- Ejemplo: "revisar las pautas de accesibilidad más recientes"
- Este principio se ha enfatizado de forma continua desde 2001 durante la aparición de los estándares web y el fortalecimiento de la UX
Conclusión
- Usar texto con significado como enlace, en lugar de "haz clic aquí", es un criterio esencial tanto para la web actual como para la web del futuro
1 comentarios
Opiniones de Hacker News
Desde el punto de vista de la accesibilidad, los lectores de pantalla para personas con discapacidad visual leen la página de forma lineal.
Para salir de esa lectura lineal, muchas veces permiten explorar por separado listas de elementos como títulos o enlaces, sin el contexto de su ubicación original.
Si todos los enlaces dicen “click here”, en la práctica se les está quitando a esos usuarios el acceso no lineal.
Por eso algo como “get Amaya” o “go to the Amaya website” me parece aceptable.
Además, no es una buena práctica que el botón de descarga de github.io haga que se obtenga un ejecutable desde un sitio tratado como sitio de malware, como SourceForge. Me recuerda a wxMaxima.
No digo que haya que cambiar las herramientas, pero debería haber alguna forma de visualizar cómo funciona un lector de pantalla para quienes no van a meterse a investigarlo directamente.
Aunque no sé qué tan bien soportada esté la primera en lectores de pantalla.
Edición: actualicé los enlaces de WCAG 2.0 a 2.2.
Aun así, en vez de dejar solo “Amaya”, como en el ejemplo del artículo, incluiría más acción, como “Get Amaya”.
Por ejemplo, el usuario puede moverse entre landmarks, entre títulos, o por ambos en un modo de exploración de esquema.
El punto clave es que la navegación con lector de pantalla no es lo mismo que la navegación con teclado.
No estoy de acuerdo en absoluto. El ejemplo que ponen como malo, “To download W3C's editor/browser Amaya, click here.”, es muy claro.
Al hacer clic en el enlace, se descargará directamente o se irá a una página de descarga.
En cambio, “Get Amaya!” parece un enlace al sitio web de Amaya, no a una página de descarga, así que no es eficaz para descargar.
“Tell me more about Amaya: W3C's free editor/browser that lets you create HTML, SVG, and MathML documents.” tampoco me convence. No es una oración sobre descargar, y “tell me more” es una orden, pero justamente eso no es el enlace.
El uso convencional de la web, es decir, “To download W3C's editor/browser Amaya, click here.” o “Download Amaya, the W3C's editor/browser.”, está perfectamente bien.
La idea de que un enlace no debería ser un verbo me parece bastante extraña. Si incluye una acción, como descargar o saber más, un enlace obviamente puede ser un verbo.
Es distinto de los enlaces de referencia de Wikipedia, donde uno aprende más sobre algún tema.
“click here” deja muy claro que el enlace no es una simple referencia, sino un enlace de acción. Al ver “Get Amaya!”, no siento que me diga cómo obtener Amaya, sino que “Amaya” es un enlace de referencia, no un enlace de descarga.
Incluso si estuvieras creando un motor de búsqueda, ¿qué información le daría “click here” al índice?
No estoy de acuerdo con que el verbo en sí sea un gran problema, pero es distinto si el verbo es click y el objeto es here.
Puedo tolerar un texto de enlace como “Click Here to download Amaya”, pero si el enlace literalmente son solo las dos palabras “click here”, en muchos contextos no se puede distinguir de otros enlaces.
“Download Amaya” puede ser un enlace excelente. Que diga solo “Amaya” o solo “click here” no es bueno, salvo que lleve a una página de información sobre Amaya.
Al final, el problema de “click here” es de accesibilidad, como dicen otros comentarios, pero al mezclarlo con si el texto del enlace refleja correctamente el destino, el mensaje queda bastante diluido.
aria-describedbypuede ayudar, pero si se mejora el propio texto dentro del enlace se puede evitar necesitarlo.En cuanto al verbo, estoy de acuerdo.
El Government Digital Service del Reino Unido también hace una recomendación similar en sus pautas de accesibilidad: https://design.homeoffice.gov.uk/accessibility/links
Quizá no sean lo más bonito, pero la accesibilidad tiene prioridad sobre el diseño, más que cosas como los bordes gruesos negros/amarillos de los componentes de formularios.
El W3C dice “Get Amaya”, “Read more about Amaya”, mientras que el Home Office dice “Get Amaya”, “Read more about Amaya”.
Lo segundo parece mucho más razonable, pero al usarlo dentro de un contexto aparecen otros problemas.
Personalmente, creo que ambos confunden dos casos de uso distintos. Los enlaces se usan a menudo en línea dentro de una oración, y los casos que tratan el W3C y el Home Office sería mejor manejarlos más bien como botones fuera de la oración, por ejemplo
[Download],[Documentation].Pero en el caso de uso de hipervínculos dentro de texto en línea, ambos se ven forzados.
Por ejemplo, ¿cómo habría que corregir “PiPedal is a guitar effects pedal that runs on Raspberry Pi. To download PiPedal, click here. To read the documentation, click here.”?
Entiendo las razones para oponerse, pero me cuesta aceptar una corrección como “PiPedal is a guitar effects pedal that runs on Raspberry Pi. Get Pipedal. Read the documentation.”. No suena idiomática en inglés.
En la documentación real escribí algo como “To download PiPedal, visit the Download Page. To learn more about Pipedal, view the Documentation.”, pero por experiencia, nominalizar “click here” muchas veces es muy difícil.
Más todavía en una oración como “Ubuntu Server installs don't suffer from this problem; but before choosing an Ubuntu Server install, you should read the Ubuntu Server section of the "Installing on Ubuntu" page.”.
Entonces me pregunto qué tiene exactamente de malo usar “here” como pronombre del referente.
En este caso de uso, como el enlace está dentro de una oración que proporciona todo el contexto necesario, quizá no haya un problema real de accesibilidad.
El primer ejemplo también es una frase introductoria de una página web donde la concisión es importante.
¿“To download PiPedal, click here.” es realmente un problema de accesibilidad? Sobre todo si justo arriba hay botones
[ Download ] [ Documentation ].Aquí la métrica realmente importante es cuánta gente visita la página de descarga.
Desde ese punto de vista, tengo bastantes dudas de que “To download PiPedal, visit the Download Page.” sea mejor.
Personalmente, me gusta más el segundo ejemplo que ellos dicen que hay que evitar: “To download Amaya, go to the Amaya_Website and get the necessary software.”
Un enlace que solo dice “Amaya” no permite saber si es un enlace interno o externo, y aunque por el contexto quede claro que el objetivo es descargar Amaya, es difícil saber si va directo a un archivo o a una página de descarga.
No sé si será porque me estoy haciendo viejo, pero siempre pensé instintivamente que los enlaces apuntan a sustantivos.
Un enlace apunta a un lugar, y ese lugar tiene un nombre, no un verbo ni un adjetivo.
Por eso, un enlace a “mi sitio web” me parece bien, pero un enlace como “ir a mi sitio web” me parece intrínsecamente incorrecto.
También me disgusta mucho el tono imperativo, así que nunca escribo frases como “go to my website” o “follow this link”.
Aunque se vuelve ambiguo si el enlace inicia una acción, como una descarga. Aun así, si lo vemos como el sustantivo “descarga” o “descargador”, sigue siendo un sustantivo.
Este probablemente sea un debate de Internet que voy a sostener hasta el final.
Los llamados a la acción son un tema aparte, pero una página que pone como enlace solo la palabra “here” es un fracaso evidente de un autor que no entiende el medio hipertextual.
“click here” parece una indicación escénica que quedó por error.
La mayoría de los autores, al escribir, no piensan en un contexto de hipertexto; en vez de usar una notación de enlaces como Markdown, toman las indicaciones escénicas como valor predeterminado.
Me hizo pensar en un texto sobre un enlace que decía “I forgot my password”
Pensé si sería mejor escribir “click here if...”, pero intuitivamente supe que eso tampoco estaba bien
Ignorar los elementos inútiles de una página web es una habilidad que algunas personas no tienen, y no sé cómo enseñarla
Me viene a la mente cada vez que ayudo a usar la web a alguien sin conocimientos previos. Algunos usuarios, aunque el primer elemento literal de una página sea “Please enable notifications”, lo consideran detenidamente antes siquiera de ver el segundo elemento
Más aún ahora que la búsqueda de Google muestra varias pantallas de basura antes de los resultados reales
Como problema relacionado, hay casos en los que no se entiende el estatus epistemológico de los distintos tipos de texto dentro de una página
Por ejemplo, hay usuarios que ven un enlace clicable que dice “I forgot my password” y creen que es una frase que informa que ellos olvidaron su contraseña, no que significa que ese es el lugar donde se hace clic cuando olvidaste la contraseña
Por supuesto, la muerte de la estandarización de la UI empeora mucho este problema
https://mstdn.io/@mattskala/113188291223682980
Recuerdo cuando Microsoft eliminó muchos botones de su UI y los reemplazó por enlaces de texto con colores ambiguos. Después de eso se volvió mucho más difícil saber en qué había que hacer clic
Los usuarios se adaptan intuitivamente a la máquina, y los desarrolladores se adaptan a los usuarios, creando un ciclo de retroalimentación
Dicho de otro modo, como muchísimos sitios web y apps tenían un enlace “I forgot my password”, es muy posible que el significado del lenguaje también haya cambiado
Al menos en ese contexto, la mayoría de la gente se adaptará para entender la intención
Las generaciones más jóvenes, que no conocen otra forma, quizá ni siquiera lo consideren algo que valga la pena cuestionar
Por eso, aunque una convención no tenga sentido si se la mira de forma aislada, también existe valor en mantener la convención
Si todos los ejemplos parten de manera consistente de la premisa de que en realidad se descarga “Amaya”, entonces simplemente sería mejor el hipervínculo Download Amaya
Si es posible, también sería bueno tener un ícono de descarga que indique que lleva a un archivo real
Porque así se sabe que no es un enlace a otra página donde el verdadero botón de descarga está escondido entre 4 anuncios
Dragan Espenschied(despens) escribió en 2022 sobre cómo fue cambiando el texto de los enlaces con el tiempo: https://despens.systems/2022/06/button-pushes-you/
Señala el cambio desde llamados a la acción hacia textos de botón que describen al usuario
Algo así como: “En cambio, deben reconfigurar el estado del usuario. El usuario debe aceptar el conjuro escrito y cambiar de actitud antes de acceder a la siguiente información”
“Get Amaya.” y “Tell me more about Amaya.” no se ven elegantes