When Movement on Screen Becomes a Barrier

Motion is the one accessibility area where the harm is physical and immediate rather than a matter of difficulty. Somebody can be made genuinely unwell by your page, and they will leave and not come back, and they will not write to tell you why.

Which is why it is worth getting the rules right rather than roughly right. Four criteria across two guidelines cover motion, and they divide the territory in a way that does not match how designers think about it. The line that unlocks the rest is short. One rule covers motion the user sets off. A different rule covers motion the page starts by itself. Everything below follows from that.

Three Different Problems, and Which Rule Reaches Each One

Motion problems get lumped together, and they have different causes, different rules, different levels, and different fixes.

Read that third row twice, because it is where the money is. A parallax hero the visitor sets off by scrolling is a Level AAA question. The same parallax running on its own is Level A, under the distraction rule, and Level A is what every law that names WCAG asks for. Getting the two the wrong way round moves a legal obligation into the optional column.

Note the rest of the levels too. Seizure safety and pausing moving content are both Level A. The reduced-motion rule is Level AAA, which is why it gets skipped, despite being one of the cheapest things on this page to implement.

Why a Third-Party Widget Is Still Your Problem

WCAG names four criteria that apply to everything on a page, including content you never claimed conformance for. Two of the four are motion criteria, and a third is the audio rule that travels with autoplaying video.

So an embedded carousel that autoplays, or a third-party ad that flashes, breaks conformance for the entire page. Not for the widget. For the page it sits on, and for everything you did get right around it. "That is the vendor's script" is a true statement and not a defence, and it is the reason this is worth checking before you sign the contract rather than after.

The Seizure Threshold

Nothing should flash more than three times per second, unless the flash stays below the general flash and red flash thresholds. Those thresholds are one defined test rather than two separate excuses, and the area of the flash is one of the things the test measures. So a small flash passes because it comes in under the threshold, not because being small is its own exemption. This is the one rule on this page where getting it wrong can cause serious harm.

What the Threshold Actually Measures

The threshold is three measurements taken together, and all three are published numbers, which means this is something you can test rather than something you have to feel your way around.

• Rate. More than three general flashes, or more than three red flashes, in any one-second period.
• Area. No more than a quarter of a 10 degree visual field. For general web content that field is estimated as a 341 by 256 pixel rectangle, an area of 87,296 pixels, at a viewing size of 1024 by 768. A quarter of that is 21,824 pixels of flashing, counted together, anywhere inside the rectangle.
• Depth. A general flash is a pair of opposing changes in relative luminance of 10% or more of the maximum, where the darker of the two states sits below 0.80. A change that never gets that dark is not a flash for this purpose at all.

There is one exception written into the definition, and it is narrower than people hope when they hear the word exception. A fine, balanced pattern, such as white noise or an alternating checkerboard whose squares are smaller than 0.1 degree of visual field on a side, does not violate the thresholds. Television static passes. A strobing hero image does not.

One honest caveat about those pixel figures, because they rest on an assumption. The 341 by 256 rectangle estimates a 10 degree field for a 15 to 17 inch screen viewed from 22 to 26 inches away. Somebody on a smaller screen, sitting closer, or zoomed in, is taking a bigger flash into their eye than your measurement says they are. So treat 21,824 as the number an auditor will hold you to rather than as a margin of safety. When you cannot measure with confidence, keep the flashing under three per second and the area question stops mattering.

There is a stricter version at Level AAA that removes the escape entirely. Under it, nothing may flash more than three times a second at all, whatever proportion of the screen it covers. If you publish video for a general audience and want a simple internal rule, that is the one to adopt, because it needs no measurement.

Two Tools That Measure Flashing For You

You should not be eyeballing this, and you do not have to, because W3C names two analysers in its own guidance for the rule. PEAT, the Photosensitive Epilepsy Analysis Tool from the Trace Center, is free and built for exactly this job. Harding FPA is the analyser the broadcast industry runs, so anyone shipping video at scale is probably already inside a workflow that has one.

Use one of them, because your scanner will not cover for you here. The entire guideline covering seizures has no automated rule written against it anywhere, so a clean report has said nothing at all about the one failure on your site that can put somebody in hospital.

In practice most sites are nowhere near either line. Where it turns up is in video content, animated GIFs, loading spinners with a strobe effect, and autoplaying background video with rapid cuts. If you publish video, check rather than assume.

Vestibular Symptoms, and What Causes Them

Vestibular disorders affect balance and spatial orientation. Large movement on screen can trigger dizziness, nausea and migraine, because the eyes report motion the inner ear does not, and the mismatch is what makes people ill.

The patterns that cause it:

• Parallax scrolling, where layers move at different speeds.
• Full-page transitions that slide or zoom the whole viewport.
• Zooming backgrounds on scroll, sometimes called the Ken Burns effect.
• Large elements sliding in from off-screen as you scroll.
• Autoplaying background video behind text. This one triggers symptoms like the rest and is covered by the Level A distraction rule rather than the AAA one, because the page started it.
• Anything covering a large share of the viewport while moving.

Small movements are generally fine. A fade, a colour change, a button pressing in, a spinner. The trigger is scale, not the existence of animation.

One definition is worth knowing before you argue about a specific effect. As published, "motion animation" excludes changes of colour, blur and opacity that do not change the perceived size, shape or position of something. The working group has since approved an amendment taking blur out of that exclusion list, and the published text has not caught up yet. Do not wait for it. Drop heavy blur transitions across a large area under reduced motion anyway, because the reason to drop them is that they make people ill rather than that a definition names them.

The Fix Is One Media Query

People turn on a reduced-motion setting in their operating system precisely so software will calm down. Honouring it takes a few lines of CSS, and it is the highest-value thing on this page by a distance. Browser support has been widely available since January 2020, so there is no compatibility argument left against using it.

Reduce or remove the large movements when the preference is set. Do not remove everything, because a page where nothing responds at all is confusing in a different way. The setting asks for motion to be removed, reduced or replaced, and replaced is often the right answer. Keep the small feedback animations, swap a slide for a fade, and drop whatever moves a lot of the screen.

The same preference is readable from JavaScript, which matters because a lot of large motion is script-driven rather than CSS-driven. Our fix guides cover both, at respecting reduced motion in CSS and in JavaScript.

Carousels, Tickers, and Auto-Updating Content

Separate from the health question, anything moving, blinking or scrolling that starts on its own and runs for more than five seconds has to be pausable, stoppable or hideable. Auto-updating content is held to a stricter version of the same rule, because the five-second allowance does not apply to it at all. A feed that refreshes by itself is in scope from the first refresh.

For auto-updating content there is a fourth remedy the moving-content half does not offer, and it is usually the cheapest one. Letting somebody control how often the update happens satisfies the rule on its own. A "refresh every 5 minutes" control on a live feed does the job, with no pause button anywhere.

A third condition on both halves settles a lot of edge cases. The moving thing has to be presented in parallel with other content. A full-screen loading animation with nothing beside it sits outside the rule for exactly that reason, and the same spinner next to a paragraph somebody is trying to read sits inside it. There is an explicit allowance for the preload case too, where an animation shows progress during a phase nobody can interact with anyway. So no, your loading spinner does not need a pause button.

What is covered is hero carousels, news tickers, auto-advancing testimonials and live-updating feeds. Almost all carousel plugins autoplay by default and almost none ship a working pause control, which is why it is one of the most common Level A failures we find.

The simplest route to compliance is also the better design. Do not autoplay. A carousel that advances only when somebody asks it to satisfies the rule and stops moving your content away from people mid-sentence.

The Sound That Travels With the Video

Autoplaying video carries a second Level A rule that motion advice usually forgets. Where audio plays automatically for more than three seconds, you owe the visitor either a way to pause or stop it, or a volume control that works independently of the system volume.

Three seconds, not five. And the reason it matters more than it sounds is that a screen reader user hearing your background music is hearing it over the voice they are using to read the page. There is no way to turn one down without turning the other down too, so the page becomes unusable rather than annoying.