Recursos · 66
Animación: verificar movimiento reducido, pausa y comprensión
Inventario de movimiento, ofrece comportamiento reducido y prueba que el progreso, el estado y la navegación siguen siendo comprensibles sin animación.
Actualizado · 3 min
Lo que esta guía ayuda a lograr
- Activadores de inventario
- Definir comportamiento reducido
- Criterios WCAG separados
- Probar todas las implementaciones
Comprobación rápida
- ¿El movimiento reducido prohíbe toda animación?
- ¿El criterio 2.3.3 es nivel AA?
- ¿Es suficiente una regla CSS global?
Método paso a paso
- 1
Activadores de inventario
Lista de movimientos automáticos, activados por interacción y vinculados por desplazamiento. Separe la información del estado de la decoración. Inspeccione también animaciones JavaScript, videos y elementos incrustados.
Entregable: registro de efectos y finalidades.
- 2
Definir comportamiento reducido
prefiere el movimiento reducido señala el deseo de reducir el movimiento no esencial. Ofrezca una alternativa estática o más silenciosa conservando información y controles. Evite reemplazar traducciones grandes con otro efecto de distracción.
Entregable: comportamiento reducido por componente.
- 3
Criterios WCAG separados
El criterio 2.3.3 de interacción-animación es nivel AAA. El criterio 2.2.2 del nivel A cubre, entre otros casos, determinados movimientos automáticos de más de cinco segundos de duración junto con otros contenidos, salvo que sean imprescindibles. Consultar las condiciones del criterio aplicable.
Entregable: criterios y controles para cada efecto.
- 4
Probar todas las implementaciones
Emular preferencia antes de cargar y durante una sesión. Inspeccione estilos, scripts y desplazamiento programático. Si el estado depende de la finalización de la animación, garantice una conclusión confiable cuando también se elimine la animación.
Entregable: pruebas de carga en frío, cambio en vivo y estado final.
- 5
Preservar información y controles
Lectura de ejercicios, teclado y retroalimentación de errores en ambos modos. Para el movimiento automático afectado, pruebe pausar, detener u ocultar y estabilidad durante la lectura. Documente las excepciones en lugar de etiquetar cada animación como esencial.
Entregable: evidencias y limitaciones.
Hoja de cálculo reutilizable
Complete con sus observaciones autorizadas. Estos campos son una plantilla de trabajo, no resultados observados.
| Campo | Información a registrar |
|---|---|
| Efecto | Disparador, duración e información |
| Alternativa | Versión reducida y estado final |
| Criterio | Nivel, condiciones y control |
| Prueba | Preferencia, teclado, resultado y límite |
Ejemplo trabajado ficticio
Situación ilustrativa
Ejemplo ficticio: un panel se activa solo después de que se completa su transición.
Decisión y pruebas esperadas
La aceptación en modo reducido revela la espera; el componente completa su cambio de estado sin depender de la duración de la animación.
Distinguir los mecanismos
| Mecanismo | Propósito | Verificación o limitación |
|---|---|---|
| Preferencia de movimiento reducido | Adaptarse a las opciones del sistema | Verificar scripts también |
| Control de pausa | Control de movimiento automático afectado | Hacerlo operable por teclado |
| Estado estático | Retener información sin movimiento | No eliminar comentarios de progreso o error |
Indicadores de gestión
| Indicador | Qué mide | Primera acción |
|---|---|---|
| Efectos adaptados | Moción con alternativas verificadas | Incluir incrustaciones y desplazamiento |
| Tareas preservadas | Recorridos realizados en modo reducido | Inspeccionar estados dependientes de la animación |
| Controles de trabajo | Pausa o parada efectivamente efectiva | Consultar currículum y teclado |
Errores comunes
- Verificar scripts también
- Hacerlo operable por teclado
- No eliminar comentarios de progreso o error
Preguntas frecuentes
¿El movimiento reducido prohíbe toda animación?
No. Expresa una preferencia; elegir una adaptación proporcionada y conservar la información necesaria.
¿El criterio 2.3.3 es nivel AA?
No, es AAA. Se pueden aplicar otros criterios al movimiento automático o al parpadeo.
¿Es suficiente una regla CSS global?
Puede reducir muchos efectos pero no puede controlar scripts, vídeos o integraciones. Pruebe los componentes reales.
Referencias oficiales
Las referencias respaldan el método. Adapte los controles a su contexto; no constituyen certificación. Los títulos de referencia originales y los documentos fuente pueden estar en otro idioma.
Referencias consultadas el .
