Accesibilidad por defecto: qué significa para PanelWave

En la mayoría de las aplicaciones de lectura, la accesibilidad es una página de ajustes. En PanelWave es una propiedad del formato. La diferencia suena abstracta hasta que ves lo que aporta: texto alternativo traducido porque todo el texto se traduce, movimiento reducido que funciona porque las transiciones son datos, y una novela gráfica que se puede leer de principio a fin solo con el teclado, porque la historia es un grafo que un teclado puede recorrer. Este artículo explica cómo recorre la accesibilidad las tres capas, del manifiesto al reproductor y al CMS, qué hace por los lectores, qué pide a los creadores y dónde siguen estando las carencias.

Empieza en el formato

El manifiesto lleva la información de accesibilidad en campos propios, no en un anexo opcional. Cada recurso del catálogo puede tener texto alternativo, un pie de imagen y una transcripción para audio y vídeo, y los tres son LocalizedStrings, así que lo que leen los lectores de pantalla sigue el idioma del lector exactamente igual que los diálogos (Recursos, Localización). Una viñeta tiene una descripción que se lee en voz alta en lugar de la ilustración y un bloque de accesibilidad con una descripción alternativa de toda la viñeta (AccessibilityHints). Una zona interactiva lleva su propia etiqueta ARIA, de modo que una región interactiva anuncia lo que hace y no dónde está (Zonas interactivas).

Los avisos de contenido se declaran una vez en los metadatos de la obra con una etiqueta localizada y un indicador defaultBlur, y después se referencian por id desde cada viñeta a la que se aplican (ContentWarning). Como la declaración está en el formato, cualquier implementación de lectura puede respetarla, no solo la nuestra. Ese es el patrón que se repite: pon la información donde todas las herramientas puedan verla, y la accesibilidad deja de depender de qué aplicación abra el archivo.

Lo que recibe un lector en el reproductor

El reproductor de código abierto convierte esos campos en comportamiento. Cada botón de la barra de herramientas lleva un aria-label traducido y los interruptores exponen aria-pressed. El área de visualización es una región etiquetada que quien usa el teclado activa con Enter o la barra espaciadora; en la vista de página, cada viñeta colocada es un botón que puede recibir el foco con un indicador de foco visible. Las teclas de flecha avanzan por la historia, T muestra u oculta la barra de herramientas, Escape cierra las ventanas modales y los atajos se ignoran mientras el lector escribe en un campo (Accesibilidad, Métodos de entrada).

Las zonas interactivas que dibuja el creador están en el orden de tabulación: Tab pasa de una a otra, Enter o la barra espaciadora las activa, y cada una anuncia su etiqueta localizada. Quien ve la pantalla percibe un contorno que pulsa suavemente para descubrirlas; con movimiento reducido el pulso se desactiva y el contorno aparece al pasar el ratón o al recibir el foco (Zonas interactivas).

El movimiento reducido se respeta desde dos fuentes, el ajuste prefers-reduced-motion del sistema operativo y la entrada reducedMotion del sitio anfitrión, y cambia algo más que la velocidad de la animación. Las transiciones entre viñetas se desactivan, el vídeo que se inicia al aparecer pasa a reproducirse al hacer clic, y en la vista de lienzo la cámara nunca se desliza: los reencuadres son instantáneos con un breve fundido cruzado, y una transición alternativa definida por el creador tiene prioridad cuando existe. Las viñetas que no son la actual llevan aria-hidden e inert, así que un lienzo virtualizado nunca atrapa el foco, y los lectores de pantalla siguen el orden lineal del grafo mientras el lienzo sigue siendo solo presentación (Vista de lienzo, Configuración).

Los lectores también tienen controles directos. La ventana de ajustes ofrece el modo manga para leer de derecha a izquierda, movimiento reducido y alto contraste, junto con los bocadillos, el audio y los tiempos de reproducción automática, con una opción para restablecer los valores predeterminados (Ventana de ajustes). Cambiar de idioma también es una función de accesibilidad, y es instantáneo: texto, bocadillos, recursos localizados y audio se vuelven a resolver sin recargar (Localización en el reproductor).

Cómo lo mantenemos así

Afirmaciones como las anteriores se deterioran si nada las comprueba. La batería de pruebas de extremo a extremo con Playwright del reproductor ejecuta axe-core sobre la vista de viñeta con la barra de herramientas abierta, la vista de página y la ventana de idiomas, y falla ante infracciones graves; los informes se adjuntan a cada ejecución. La navegación por teclado y el comportamiento con movimiento reducido tienen sus propias pruebas. La batería se ejecuta en proyectos de navegador de escritorio y móvil como parte de la integración continua (Desarrollo: pruebas). No sustituye a las pruebas con un lector de pantalla, que también hacemos a mano antes de cada versión, pero impide que las regresiones se cuelen en silencio.

Lo que tiene que hacer un creador

El formato solo puede llevar lo que escribe un autor, así que el CMS integra esa escritura en el flujo de trabajo normal en lugar de convertirla en una auditoría aparte.

Nada de esto exige saber qué significa ARIA. Los campos están donde está el contenido, la comprobación se ejecuta antes de publicar y la corrección está a un enlace de distancia.

• Describe tus viñetas. Title y Description del inspector de viñetas se editan por idioma; la descripción es lo que leen los lectores de pantalla, así que una frase sobre lo que ocurre en la viñeta hace la obra accesible para lectores ciegos y con baja visión (Propiedades de la viñeta).
• Añade texto alternativo a las ilustraciones. Defínelo una vez en el recurso mediante Edit Metadata, o en la capa desde la pestaña A11y del inspector; la misma pestaña cubre los subtítulos de audio y vídeo y la accesibilidad de los elementos interactivos (Texto alternativo y accesibilidad, Inspector derecho).
• Etiqueta tus zonas interactivas. Cada zona interactiva tiene un campo Label por idioma y un campo ARIA Label en Basic Properties (Nombres y accesibilidad).
• Marca el contenido sensible. Los avisos de contenido se configuran por viñeta desde el árbol de estructura o la sección Content Settings, y el árbol muestra una etiqueta W en cada viñeta marcada (Páginas y viñetas).
• Ejecuta Preflight. La categoría Accessibility señala las capas de imagen sin texto alternativo y el audio sin subtítulos; la falta de texto alternativo es un aviso, la falta de subtítulos es un error que bloquea la publicación. Cada incidencia enlaza con la viñeta que usa el recurso y con la referencia del código (Validación, Falta texto alternativo, Faltan subtítulos).

La herramienta de creación también tiene que ser accesible

Un creador con baja visión o con una discapacidad motora debería poder crear un cómic accesible, no solo leerlo. El editor tiene un estándar de foco visible en toda la aplicación, trampas de foco en cada diálogo, semántica ARIA en el árbol de estructura con navegación completa por flechas y una lista de atajos de teclado que se abre con la tecla «?» (Atajos). La paleta de comandos con Ctrl+K da acceso a la mayoría de las acciones del editor sin ratón, y un navegador de capas por teclado anuncia las capas a los lectores de pantalla a medida que las recorres. Los temas incluyen System, Light, Dark y una paleta High Contrast que se aplica tanto a la aplicación como al marco del lienzo del editor (Cuenta: tema). El tema de alto contraste llegó este mes junto con un conjunto de componentes de interfaz compartidos, y es el que más esperamos pulir a medida que recibamos comentarios.

Verificación de edad y muros de pago, con respeto

La comodidad no es solo cuestión de movimiento y contraste. Cuando una obra necesita una verificación de edad, el reproductor ofrece un componente de verificación con una edad mínima y un mensaje configurables, y la decisión se delega en el adaptador de derechos de acceso del anfitrión, que puede verificar la edad o recurrir a una variable de usuario de solo lectura introducida al arrancar. Sin ninguna de las dos, la verificación deniega el acceso en lugar de adivinar (Muro de pago y derechos de acceso). Las superposiciones de muro de pago siguen la misma regla: se le dice al lector con claridad qué está restringido y por qué, en su idioma, y la historia nunca se salta contenido en silencio.

Lo que queda pendiente

Enumeramos estos puntos porque una afirmación de accesibilidad que oculta sus carencias vale menos que una que las nombra.

• Preflight todavía no emite todas las comprobaciones que enumera. La integridad de la localización y la cobertura de audio por bocadillo se muestran como categorías, pero sus códigos de incidencia aún están planificados; el texto alternativo y los subtítulos ya funcionan (Códigos de validación).
• Tres casillas de ajustes se guardan, pero aún no se aplican. Los interruptores Audio y SFX de la barra de herramientas ya funcionan: Audio silencia todo el reproductor, incluido el sonido de los vídeos, SFX silencia el bus de efectos, Speech silencia también la voz en off, y los tres recuerdan tu elección (Controles de la barra de herramientas). Las casillas de modo manga, movimiento reducido y alto contraste de la ventana de ajustes se guardan, pero el shell todavía no actúa en consecuencia; en su lugar, el movimiento reducido se respeta a partir del ajuste del sistema operativo y de la entrada del anfitrión.
• La presentación de los avisos de contenido depende de cada implementación. El formato declara el aviso y si una viñeta debe mostrarse difuminada por defecto; cómo presenta un reproductor la opción de verla es cosa del reproductor, y el nuestro aún se está afinando con obras reales.

Por qué desde el primer día

Añadir la accesibilidad a posteriori significa tocar todas las capas a la vez: el formato tiene que ganar campos, el reproductor tiene que leerlos, la herramienta de creación tiene que recogerlos, y las obras existentes siguen siendo inaccesibles hasta que alguien vuelve atrás. Integrarla desde el principio convirtió la mayor parte en consecuencias de decisiones que ya habíamos tomado. El texto alternativo está localizado porque todo es un LocalizedString. El movimiento reducido es fiable porque una transición es un campo de datos que un motor puede saltarse. El recorrido por teclado es completo porque la historia es un grafo con un «siguiente» y un «anterior» definidos. El grafo narrativo, el modelo de localización y los campos de accesibilidad se diseñaron juntos, y en ese sentido la accesibilidad aquí viene de serie: no es una función más.

Para seguir leyendo

• Interfaz de lectura: todos los controles, métodos de entrada y comportamientos de accesibilidad del reproductor.
• Viñetas y Recursos: los campos de accesibilidad del formato.
• Validación y Preflight: las comprobaciones que se ejecutan antes de publicar.
• ¿Por qué navegación por grafo?: el modelo que hace completo el recorrido por teclado.