Novedades en WCAG 2.1
Acerca de esta Traducción
Esta traducción voluntaria puede que no refleje de forma adecuada las intenciones de la versión original en inglés.
Versión en inglés actualizada posteriormente a esta traducción: registro de cambios.
Versión en inglés actualizada: 2023-10-05. Traducción actualizada: 2019-07-11.
Traductor/a: Carlos Muncharaz .
WAI les da las gracias a estos/as traductores/as y da la bienvenida a otras traducciones.
Introducción
Puede consultar una introducción a las Pautas de Accesibilidad para el Contenido Web y saber más sobre las versiones 2.0 y 2.1 en la [Introducción a WCAG].
Todos los requisitos (criterios de conformidad) de la versión 2.0 están incluidos en 2.1. Los criterios de conformidad 2.0 son exactamente iguales (literalmente) en 2.1.
WCAG proporciona 17 criterios de conformidad adicionales que hay que tener en cuenta:
- [Accesibilidad móvil]
- Personas con baja visión
- [Personas con discapacidades cognitivas y del aprendizaje]
Pauta 1.3 Adaptable
Cree contenido que pueda presentarse en diferentes formas (por ejemplo, con una disposición más simple) sin perder información ni estructura.
1.3.4 Orientación (AA)
El contenido no restringe su vista y operación a una única orientación de pantalla, como por ejemplo retrato o paisaje, salvo que una orientación específica sea esencial.
Un cómico con parálisis cerebral que usa una silla de ruedas:
Problema:
No puedo rotar mi tableta, está fijada a la silla de ruedas.
Funciona bien:
La aplicación funciona tanto si mi tableta está fijada de forma horizontal como vertical.
1.3.5 Identificación del Propósito de Entrada (AA)
El propósito de cada campo de entrada que recoge información sobre el usuario puede ser determinado por software cuando:
- El campo de entrada sirve a un propósito identificado en los propósitos de entrada de los componentes de la interfaz de usuario; y
- El contenido se implementa usando tecnologías con soporte para identificar el significado esperado de los datos de entrada en formularios.
Un auxiliar de supermercado con dislexia y discalculia:
Problema:
Mi dirección es muy complicada. Tiene muchos números y palabras largas. Me resulta difícil teclearlo todo sin cometer errores.
Funciona bien:
Me encantan los sitios web que automáticamente rellenan todo eso por mí. De esta forma, no tengo que esforzarme tanto para asegurar que los números y las palabras están bien.
Nota: Esto funciona porque los campos utilizan autocompletado.
Comprender la Identificación del Propósito de Entrada
1.3.6 Identificación del Propósito (AAA)
En contenido implementado con lenguajes de marcado, el propósito de los componentes de la interfaz de usuario, iconos y regiones puede determinarse por software.
Un jugador con discapacidad para procesar el lenguaje:
Problema:
Tengo un programa que cambia las palabras de la navegación por símbolos. No funciona con todos los sitios web.
Funciona bien:
Funciona bastante bien con algunos sitios web.
Comprender la Identificación del Propósito
Pauta 1.4 Distinguible
Facilite que los usuarios puedan ver y oír el contenido incluyendo la separación entre el primer plano y el fondo.
1.4.10 Reajuste (AA)
El contenido se puede presentar sin perder información ni funcionalidad, y sin necesidad de desplazamiento en dos dimensiones, para:
- Contenido en desplazamiento vertical con una anchura equivalente a 320 píxeles en CSS;
- Contenido en desplazamiento horizontal con una altura equivalente a 256 píxeles en CSS;
Excepto para aquellas partes del contenido que debido a su uso o significado requieran desplazamiento bidimensional.
Un padre con baja visión – 20/400:
Problema:
Es casi imposible leer el texto si tengo que desplazarme de derecha a izquierda con cada línea. Me siento desorientado y pierdo la posición. Hace que sea difícil entender lo que estoy leyendo.
Funciona bien:
Aumento el tamaño del texto al 400% y se reajusta dentro de la anchura de la ventana. Puedo leerlo fácilmente sin necesidad de desplazarme adelante y atrás.
1.4.11 Contraste no Textual (AA)
La presentación visual de los siguientes elementos tiene un ratio de contraste de al menos 3:1 con respecto a los colores adyacentes:
- Componentes de la interfaz de usuario
- Información visual necesaria para identificar los componentes de la interfaz de usuario y los estados, excepto aquellos componentes inactivos o cuya apariencia sea determinada por el agente de usuario y no modificada por el autor;
- Objetos gráficos
- Partes de gráficos necesarias para comprender el contenido, excepto cuando una presentación particular de los gráficos sea esencial para la información transmitida.
Un jubilado con poca sensibilidad al contraste:
Problema:
No pude usar el formulario de pedidos, no había cajas de texto. Después de una larga llamada con el servicio de atención al cliente, supe que las cajas de texto tenían un borde muy claro que yo no podía ver.
Funciona bien:
Puedo ver los iconos, botones y todo lo demás fácilmente, incluso bajo la luz del sol.
Comprender el Contraste no Textual
1.4.12 Espaciado de Texto (AA)
En contenido implementado con lenguajes de marcado que soporten las propiedades de estilo del texto siguientes no se produce ninguna pérdida de contenido o funcionalidad al ajustar todas estas propiedades y sin cambiar ninguna otra propiedad de estilo:
- Altura de la línea hasta al menos 1,5 veces el tamaño de la fuente;
- Espacio tras párrafo hasta al menos 2 veces el tamaño de la fuente;
- Espacio entre letras (tracking) hasta al menos 0,12 veces el tamaño de la fuente;
- Espacio entre palabras hasta al menos 0,16 veces el tamaño de la fuente.
Excepción: Los lenguajes humanos y el código que no usen una o más de estas propiedades en forma escrita pueden cumplir usando solamente las propiedades que existan para esa combinación de lenguaje y código.
Un estudiante con dislexia:
y un jubilado con baja visión:
Problema:
La mayor parte del texto es difícil de leer. Está tan amontonado que no puedo concentrarme. Solamente aumentando el espacio entre líneas ya noto una diferencia. Cuando estoy muy cansado, también aumento el espacio entre palabras.
Funciona bien:
De acuerdo, sé que soy un poco raro, pero he creado una hoja de estilos que establece el espaciado de texto adecuado para mí. Es un alivio cuando los sitios web funcionan con mi CSS.
Comprender el Espaciado de Texto
1.4.13 Contenido en Puntero Flotante o en Foco (AA)
Si mover y alejar el puntero o el foco del teclado con respecto a un elemento resulta en contenido adicional que se muestra y después se oculta, entonces lo siguiente debe ser cierto:
- Descartable
- Debe existir un mecanismo para descartar el contenido adicional sin mover el puntero o el foco del teclado, salvo que el contenido adicional informe acerca de un error de entrada o no oculte ni sustituya otro contenido;
- Superponible
- Si cuando el puntero flota sobre un elemento se muestra contenido adicional, entonces el puntero debe poder moverse sobre este contenido adicional sin que desaparezca;
- Persistente
- El contenido adicional debe permanecer visible hasta que el puntero o el foco lo abandonen, el usuario lo descarte o la información ya no sea válida.
Excepción: la presentación visual del contenido adicional es controlada por el agente de usuario y no es modificada por el autor.
Un profesor con baja visión que usa un programa de magnificación de pantalla:
Problema:
Estaba moviendo el ratón para seguir lo que veía en el sitio web. Me ayuda a concentrarme. De repente, ¡bum!, apareció un cuadro pequeño. Cubría lo que estaba intentando leer y no pude hacerlo desaparecer.
Funciona bien:
Posé el puntero sobre una palabra y se abrió un cuadro con su definición, pero se encontraba prácticamente fuera de la pantalla debido a mi magnificación. Moví el puntero del ratón hasta el cuadro de definición magnificado y me desplacé por éste, que permaneció visible y de esta forma pude leerlo.
Comprender Contenido en Puntero Flotante o en Foco
Pauta 2.1 Accesible por Teclado
Proporcione acceso a toda la funcionalidad mediante el teclado.
2.1.4 Atajos de Teclado (A)
Si el contenido implementa un atajo de teclado que solamente hace uso de letras (tanto mayúsculas como minúsculas), signos de puntuación, números o símbolos, entonces al menos una de las siguientes condiciones debe ser cierta:
- Desactivación
- Existe un mecanismo para desactivar el atajo de teclado;
- Modificación
- Existe un mecanismo que modifica el atajo para usar una o más teclas de caracteres no imprimibles (por ejemplo Ctrl, Alt, etc)
- Activo solamente en foco
- El atajo de teclado perteneciente a un componente de la interfaz de usuario solamente está activo cuando dicho componente tiene el foco.
Un periodista con trastorno musculoesquelético que usa un programa de reconocimiento de voz:
Problema:
Usando mi aplicación de correo electrónico, borraba los mensajes en lugar de abrirlos.
Nota: Había un atajo de teclado para borrar los mensajes que se activaba por algo que él estaba diciendo y no había manera de desactivarlo.Funciona bien:
En mi aplicación de hojas de cálculo puedo desactivar o modificar los atajos de teclado.
Comprender los Atajos de Teclado
Pauta 2.2 Tiempo Suficiente
Proporcione a los usuarios tiempo suficiente para leer y usar el contenido.
2.2.6 Límites Temporales (AAA)
Los usuarios son informados de la duración del periodo de inactividad que podría provocar una pérdida de datos, salvo que los datos se mantengan durante más de 20 horas desde que el usuario no realiza acciones.
Un auxiliar de supervisión en un colegio con discapacidad cognitiva:
Problema:
Estaba seleccionando los beneficios de los empleados y comparando diferentes planes. Cuando volví para seleccionar el plan de salud, la sesión caducó y perdí toda la información que había introducido.
Funciona bien:
Al iniciar la aplicación de beneficios de los empleados, fui informado de cuántos minutos disponía para rellenar los formularios.
Comprender los Límites Temporales
Pauta 2.3 Convulsiones y Reacciones Físicas
No diseñe contenido de una forma que sea conocida por causar convulsiones o reacciones físicas.
2.3.3 Interacciones Animadas (AAA)
Las animaciones activadas por alguna interacción pueden desactivarse, salvo que la animación sea esencial para la funcionalidad o la información transmitida.
Un artista con trastorno vestibular:
Problema:
En la aplicación de impuestos en línea, según muevo el ratón o el cursor a diferentes campos, un bocadillo con el balance actual me sigue por toda la pantalla. Me provoca mareos y náuseas.
Funciona bien:
Me alegro de contar con una opción para desactivar todas las animaciones.
Comprender las Interacciones Animadas
Pauta 2.5 Modalidades de Entrada
Facilite que los usuarios puedan operar la funcionalidad a través de diferentes entradas además del teclado.
2.5.1 Gestos del Puntero (A)
Toda funcionalidad que para su operación use gestos basados en múltiples puntos o recorridos puede ser operada con un puntero sencillo sin gestos basados en recorridos, salvo que los gestos basados en múltiples puntos o recorridos sean esenciales.
Un cómico con parálisis cerebral que tiene movimiento limitado en los dedos:
Problema:
No puedo mover mis dedos así. Necesito otro método para ampliar el mapa.
Funciona bien:
Es bueno que haya botones para ampliar y reducir.
Comprender los Gestos del Puntero
2.5.2 Cancelación del Puntero (A)
Aquella funcionalidad que pueda operarse con un puntero sencillo debe cumplir al menos una de las siguientes condiciones:
- Sin evento “down”
- El evento “down” del puntero no se usa para ejecutar ninguna parte de la funcionalidad;
- Abortar o deshacer
- La función se completa con el evento “up”, y existe un mecanismo para abortar la función antes de que sea completada o para deshacerla después de completada;
- Inversión en “up”
- El evento “up” invierte cualquier resultado del evento “down” precedente;
- Esencial
- Es esencial que la función se complete con el evento “down”.
Un político con discapacidad motora y baja visión:
Problema:
Quise pulsar el botón de “Silenciar” pero accidentalmente toqué el de “Terminar llamada”. Se cortó inmediatamente.
Funciona bien:
En otra aplicación de videoconferencias, si accidentalmente toco el botón de “Terminar llamada”, puedo deslizar el dedo fuera de ese botón y así no se termina la llamada.
Comprender la Cancelación del Puntero
2.5.3 Etiqueta en el Nombre (A)
En los componentes de la interfaz de usuario con etiquetas que incluyan texto o imágenes de texto, el nombre contiene el texto que se presenta visualmente.
Un periodista con trastorno musculoesquelético que usa un programa de reconocimiento de voz:
Problema:
Entendió casi todos mis comandos de voz hasta que llegué al botón de enviar. Estuve repitiendo “enviar” pero no funcionó.
Nota: visualmente, estaba etiquetado como “Enviar” pero el “nombre” en el código era “Entregar”. Habría funcionado si el nombre hubiera empezado con “Enviar”.
Comprender la Etiqueta en el Nombre
2.5.4 Actuación del Movimiento (A)
La funcionalidad que puede operarse a través del movimiento del dispositivo o del usuario también puede operarse a través de componentes de la interfaz de usuario y la respuesta al movimiento puede desactivarse para evitar actuaciones accidentales, excepto cuando:
- Interfaz soportada
- El movimiento se usa para operar la funcionalidad a través de una interfaz con soporte para la accesibilidad;
- Esencial
- El movimiento es esencial para la función y cualquier otra forma invalidaría la actividad.
Un cómico con parálisis cerebral que usa silla de ruedas:
Problema:
No puedo agitar mi móvil; está conectado a mi silla de ruedas. Así que tiene que existir otra forma para activar esa característica, un botón por ejemplo.
Problema:
Tengo temblores y por eso debo deshabilitar la activación por movimiento, y después debería ser capaz de hacer cosas sin actuación del movimiento.
Funciona bien:
Mi amiga tiene una aplicación interesante que parece una cerradura giratoria. Ella tiene que rotar el móvil para cambiar la combinación. Yo puedo usar la misma aplicación, pero tecleando los números directamente.
Comprender la Actuación del Movimiento
2.5.5 Tamaño del Objetivo (AAA)
El tamaño del objetivo para entradas de puntero es de al menos 44x44 píxeles de CSS, excepto cuando:
- Equivalente
- El objetivo está disponible a través de un enlace equivalente o un control en la misma página que tenga al menos 44x44 píxeles de CSS;
- En línea
- El objetivo es una frase o bloque de texto;
- Controlado por el Agente de Usuario
- El tamaño del objetivo queda determinado por el agente de usuario y no es modificado por el autor;
- Esencial
- Una presentación particular del objetivo es esencial para la información transmitida.
Un jubilado con temblores en las manos (y dedos grandes):
Problema:
Los botones son tan pequeños que pulso en “Cancelar” cuando quiero pulsar “Enviar”. Entonces, tengo que volver a empezar otra vez.
Funciona bien:
Los botones del sitio web son suficientemente grandes y no me equivoco al pulsarlos incluso cuando viajo en un autobús traqueteante.
Comprender el Tamaño del Objetivo
2.5.6 Mecanismos de Entrada Concurrentes (AAA)
El contenido web no restringe el uso de las modalidades de entrada disponibles en la plataforma excepto cuando las restricciones sean esenciales, necesarias para la seguridad del contenido o necesarias para respetar los ajustes del usuario.
Un periodista con trastorno musculoesquelético que usa un programa de reconocimiento de voz:
Problema:
Cuando mi trastorno se hace evidente, alterno bastante entre teclado, ratón, lápiz digital y voz. Esta aplicación no me deja usar el lápiz digital cuando el teclado está conectado.
Comprender los Mecanismos de Entrada Concurrentes
Pauta 4.1 Compatible
Maximice la compatibilidad con agentes de usuario actuales y futuros, incluyendo las ayudas técnicas.
4.1.3 Mensajes de Estado (AA)
En el contenido implementado usando lenguajes de marcado, los mensajes de estado se pueden determinar por software a través de roles o propiedades tales que puedan ser presentados al usuario de tecnologías de apoyo sin necesidad de recibir el foco.
Un contable ciego que usa un lector de pantalla:
Problema:
He seleccionado una clase para la conferencia, pero no puedo decir si se ha añadido a mi agenda.
Funciona bien:
Cuando añado una reunión en mi calendario, oigo una confirmación.
Comprender los Mensajes de Estado
Sobre las citas de las personas
Los roles de personas enlazan con las [Historias de usuarios web]. Dicha página contiene otras personas con diferentes discapacidades. Se podrían añadir más en el futuro.
Una vez estas personas se hayan revisado suficientemente, planeamos añadirlas a los documentos de “Comprender”.
Ir Arriba