Reduced Motion
Large-scale motion can cause nausea and dizziness, so the system preference must be honoured.
Definition
People with vestibular disorders can experience genuine physical symptoms from parallax, zoom and large movement. The prefers-reduced-motion media query exposes an operating system preference that products are expected to respect.
Established research. Originates in published research and has been replicated. The effect is real. Its size in your product still needs measuring.
What triggers symptoms
- Parallax scrolling, which is the most frequently reported trigger.
- Large elements zooming or scaling across the viewport.
- Full-screen transitions with movement.
- Continuous background animation.
- Fast spinning or rotating elements.
Related criteria
- 2.3.3 Animation from Interactions, level AAA, requires motion animation triggered by interaction to be disableable.
- 2.2.2 Pause, Stop, Hide requires control over moving content that lasts more than five seconds.
- 2.3.1 Three Flashes covers seizure risk, which is a different and more severe hazard.
Sources
Where a source establishes something narrower than the popular reading of it, the note says so.
MDN Web Docs
Understanding Success Criterion 2.2.2: Pause, Stop, Hide
W3C, WCAG 2.1
Continue from here
Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.
Applies when you are designing
Check your work
Review passes that test whether this was done properly.
- Accessibility ChecklistChecklist
Related concept
Connected closely enough to change how you apply this.
- Selective AttentionPsychology
- Adaptive LayoutUI foundation
- MotionUI foundation