motion-animation-accessibility-audit

Audits web animation and motion behavior for WCAG accessibility barriers.

Updated Jul 7, 2026
One-click install
npx skills add https://github.com/vmitsaras/Agent-Skills --skill motion-animation-accessibility-audit-vmitsaras
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: motion-animation-accessibility-audit
Source: https://github.com/vmitsaras/Agent-Skills/tree/main/skills/frontend-a11y/motion-animation-accessibility-audit
Command: npx skills add https://github.com/vmitsaras/Agent-Skills --skill motion-animation-accessibility-audit-vmitsaras

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Motion, animation, and time-based interface behavior can create accessibility barriers for users with vestibular disorders, attention differences, or reading difficulties, and these issues are hard to review systematically. This Skill provides a structured audit workflow that inspects CSS animations, JavaScript timelines, autoplay, carousels, parallax, and flashing content, then produces evidence-bounded findings mapped to WCAG criteria. ## Core Features & Use Cases - Motion inventory and source inspection: Traces every animation source, trigger, reduced-motion branch, and control wiring across CSS, JavaScript, GSAP timelines, and third-party embeds. - Runtime test protocol: Defines tests for prefers-reduced-motion, autoplay pause/stop/hide controls, scroll-jacking, focus disruption, interruption, and no-JavaScript fallback behavior. - WCAG mapping with boundaries: Separates confirmed WCAG failures (2.2.2, 2.3.1, 2.5.4, and others) from comfort and usability recommendations, with a structured finding contract including severity, confidence, and verification steps. - Use Case: A frontend team ships a landing page with GSAP scroll animations and an autoplaying carousel. Run this audit to verify reduced-motion handling, test pause controls with keyboard input, and receive a findings report distinguishing WCAG violations from vestibular comfort recommendations. ## Quick Start Audit the animations and autoplay behavior on the checkout flow for reduced-motion support and WCAG 2.2 motion criteria, and report findings with evidence and remediation guidance.

Frequently Asked Questions about motion-animation-accessibility-audit

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit website animations for accessibility?▼

Inventory every motion source in CSS, JavaScript, and animation libraries, then test runtime behavior with default and reduced-motion preferences. Verify pause controls, focus stability, and fallback states, and map confirmed failures to specific WCAG criteria with reproducible evidence.

How to test prefers-reduced-motion support in web apps?▼

Enable the platform reduced-motion setting before loading the page and while the interface is active, then repeat critical tasks. Confirm the preference reaches dynamically mounted content, inline styles, timeline configurations, and third-party integrations rather than relying on a single global media query.

Does WCAG require reduced motion support for animations?▼

Prefers-reduced-motion is not itself a WCAG success criterion. WCAG 2.3.3 Animation from Interactions is a Level AAA criterion, while 2.2.2 Pause, Stop, Hide covers auto-moving content; reduced-motion support is the standard implementation mechanism and strong practice at all levels.

Can GSAP animations cause WCAG accessibility failures?▼

Yes, when timelines lack preference-aware initialization, run unbounded loops, gate meaning behind animation events, or restart after user interruption. The audit checks cancel and cleanup behavior, safe final states, and whether non-motion cues convey the same information.

What are the limitations of a source-only motion accessibility review?▼

Static inspection identifies declared animations, preference branches, and control wiring but cannot confirm rendered timing, flash thresholds, actual control operation, or browser preference handling. Those items must be marked needs-validation until runtime testing or flash measurement is performed.