Respect the reduced-motion preference in CSS
prefers-reduced-motion is an operating system setting a person turns on because movement makes them ill, and a media query lets a stylesheet honor it. W3C attaches C39 to one criterion, 2.3.3 Animation from Interactions, which is Level AAA, and lists it as sufficient there. It is worth being precise about what that criterion covers, because it is often confused with the flashing rule. This is about motion triggered by what the user does, scroll-linked parallax above all, and about vestibular disorders. It is not the seizure rule, and honoring the preference does nothing about a page that flashes. W3C also carves out the movement of scrolling itself, which is under the reader's control and is not the problem. Write the motion inside a no-preference block, so the still version is the default and the animation is what gets added.
How we find it in an audit
Turning the operating system setting on and reloading is the whole test, and it takes a minute per template. Everything should hold still. Scanners can list animation and transition declarations and cannot tell you whether the query is respected, so this one is watched rather than read.
How affected users experience it
For somebody with a vestibular disorder, a parallax hero is not an annoyance. It is nausea, dizziness and sometimes hours of being unable to work. They turned the setting on precisely so this would stop happening, and a site that ignores it has overruled a medical accommodation to keep a decorative effect.
Passes vs. fails
Passes
@media (prefers-reduced-motion: no-preference) {
.hero { animation: parallax linear;
animation-timeline: scroll(); }
}Fails
.hero { animation: parallax linear;
animation-timeline: scroll(); }Other ways to satisfy this rule
2 guides on this site are filed under 2.3.3 Animation from Interactions. W3C lists this one as sufficient for that rule on its own. Implement it correctly, in a way your readers' software actually supports, and the rule is met.
This guide is our interpretation of W3C technique C39: Using the CSS prefers-reduced-motion query to prevent motion. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.