Check prefers-reduced-motion before animating
SCR40 is a sufficient technique, and its scope is narrower than the way it usually gets quoted. It applies to JavaScript animation whose motion is triggered by user interactions, so a parallax effect driven by scrolling is inside it and a hero transition that plays on its own is not. The method is one line. Read prefers-reduced-motion with window.matchMedia before you start the animation, and if the user has asked for less motion, do not start it. Then there is an escape most write-ups drop. Motion that is essential to the content may play regardless, and the published test accepts either outcome, so an implementation where animation continues under a reduced-motion setting is not automatically a defect. Ask what the motion is for first. If the same information survives without it, it was never essential.
How we find it in an audit
Reviewers turn reduced motion on at the operating system level, not in a browser flag, and then work the page. Anything that still moves gets a second question rather than an immediate finding. Is this motion carrying information the page cannot deliver another way, or is it decoration that never asked. Decoration that ignores the setting is the defect. Automated tools can confirm the media query appears somewhere in your CSS or your bundle, and cannot confirm it guards the animation that is actually running.
How affected users experience it
Vestibular disorders are more common than most owners have been told. The symptoms are physical. Large parallax movement, content flying in from the edges, a page that slides under the reader as they scroll. All of it produces dizziness and nausea that can outlast the visit. Somebody who has set reduced motion on their machine has told every application they use that motion makes them ill. A site that reads the setting and ignores it has been told and has decided the animation matters more.
Passes vs. fails
Passes
var reduce = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
if (!reduce) { window.addEventListener("scroll", runParallax); }
// The static page carries the same content, so nothing is lost by skipping it.Fails
window.addEventListener("scroll", runParallax);
// Runs for everyone. The preference is never read.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 SCR40: Using the CSS prefers-reduced-motion query in JavaScript 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.