Useful motion answers a question
Did the action work? Which item is active? What changed? Motion can preserve context and improve understanding.
Decorative motion has a budget
Continuous movement competes with reading. Large parallax shifts, autoplay, and delayed entrances should be treated as costs.
Reduced motion must preserve meaning
The `prefers-reduced-motion` setting should remove nonessential movement without hiding content or disabling controls.
The accessible alternative is the same information with less movement—not an empty screen.
Test beyond the mouse
Keyboard focus, touch, zoom, mobile performance, and motion preferences are part of interaction quality.
Motion acceptance test
Keep an animation only when it passes these checks.
- It explains state, sequence, hierarchy, or feedback.
- Content remains available before and after the movement.
- Keyboard and touch users receive the same meaning.
- Reduced-motion mode removes nonessential movement without hiding information.
- The effect stays smooth on an ordinary mobile device.
If an effect delays reading, steals focus, or exists only to prove that animation is possible, it is consuming attention instead of creating value.