Accesibilidad: los enlaces de anclaje necesitan una etiqueta

Dado que acabaron de aparecer en la beta 7, me gustaría señalar que los enlaces a cada subtítulo en una publicación larga necesitan un atributo aria-label. Tal como están codificados, con solo la etiqueta a con nombre y probablemente una imagen de fondo incluida mediante la clase CSS .anchor, hace que el lector de pantalla lea algún número (probablemente el ID de la publicación) y fragmentos del encabezado. Es mejor ser explícito y tener algo como “Enlace permanente” o “Enlace permanente a” seguido del texto del subtítulo. De esta manera, los usuarios de lectores de pantalla que abren una lista de enlaces en una página obtienen enlaces correctamente nombrados.

Además, ¿sería posible colocar el ancla después del texto del encabezado dentro del elemento h, en lugar de antes? En este momento, el lector de pantalla, al navegar de un encabezado a otro, siempre lee el enlace primero, y especialmente si el texto del encabezado se repite en la etiqueta como se sugirió anteriormente, la lectura puede volverse bastante engorrosa. Dado que los usuarios de lectores de pantalla a menudo obtienen una visión general de una página a través de la estructura de encabezados (consulte varias encuestas a usuarios de lectores de pantalla de WebAIM), sería mejor colocar el enlace después del texto del encabezado.

¡Gracias por mejorar siempre la accesibilidad en Discourse!

4 Me gusta

Hmm, parece extraño que un número haya sido recogido de algún lugar…

Aparte de eso, todas estas sugerencias tienen sentido y no deberían ser un problema implementarlas. ¡Gracias de nuevo por el consejo!

1 me gusta

En ausencia de cualquier otra etiqueta en un enlace, los lectores de pantalla leerán el contenido del atributo href, de modo que los usuarios al menos conocerán el destino o la URL del enlace.

Hay un excelente análisis técnico sobre el tema de los enlaces ancla accesibles aquí: Are your Anchor Links Accessible? | Amber Wilson

2 Me gusta