El desenfoque de spoiler no es compatible con lectores de pantalla

Activa VoiceOver de iOS, luego navega a una publicación que contenga un desenfoque de spoiler, como este.

Desliza el dedo hacia el texto y haz que el lector de pantalla lea el texto.

Real: VoiceOver simplemente lee el texto del spoiler, ignorando el desenfoque del spoiler.

Esperado: Debería tener un rol ARIA (¿botón?) y una lectura ARIA alternativa, “leer spoilers” o algo similar.

(Algo similar ocurre en JAWS y NVDA).

6 Me gusta

No creo que haya nada en ARIA sobre spoilers, … puede que me equivoque. Entiendo que lo más cercano que podemos hacer es implementar algo usando las etiquetas detail y summary para poner esto en marcha.

Abierto a cambiar nuestra implementación.

Parece que hay una cantidad razonable de flexibilidad para estilizar detail/summary, sin embargo, precalcular el ancho probablemente no será factible.

1 me gusta

Ah, ahora veo que prácticamente abrí un problema duplicado para el problema de accesibilidad de las alertas de spoiler mencionadas aquí, lamento eso. Aunque el mío se centró más en la accesibilidad del teclado, mi solución también arreglaría este problema porque, como sugirió @dfabulich, utilizaría un patrón de widget de divulgación activado por un botón.

No creo que quieras usar details/summary aquí, ya que quieres mostrar el contenido en la página cuando está “oculto”, solo quieres difuminarlo también. Usar aria-hidden="true" en el contenido difuminado lo ocultaría a los usuarios de lectores de pantalla, pero aún permitiría que se mostrara en la página (como difuminado). Y luego el botón puede alternar aria-hidden para hacerlo accesible a la tecnología de asistencia.

No creo que haya nada en ARIA sobre spoilers
La alerta de spoiler es básicamente un widget de divulgación para el cual la Guía de Prácticas de Autoría de ARIA proporciona pautas.

1 me gusta

Creo que esto debería resolverse con este commit:

4 Me gusta

Este tema se cerró automáticamente después de 25 horas. Ya no se permiten nuevas respuestas.