Shopify Motion theme — accessibility hot-spot audit
Accessibility hot-spots in Motion
Auto-advancing slideshow pause control
Auto-fixWCAG: 2.2.2 Pause, Stop, Hide
Auto-advancing hero slideshows need a visible Pause button per 2.2.2. Auto-fix injects a Pause button with aria-label.
Reduced-motion fallback
Auto-fixWCAG: 2.3.3 Animation from Interactions
All scroll animations and parallax need to respect prefers-reduced-motion. Auto-fix wraps animations.
Product image alt text passthrough
Auto-fixWCAG: 1.1.1 Non-text Content
The theme renders alt text from the Shopify Admin product-image setting. Merchants who upload images without setting alt text get an empty `<img alt="">`, which screen readers skip silently. Auto-fix populates alt text from product titles + AI-generated descriptions.
Color contrast on Motion
Auto-fixWCAG: 1.4.3 Contrast (Minimum)
Motion default palettes ship with body-text colors that frequently fall below the 4.5:1 luminance threshold once a merchant adjusts background tints or section backgrounds. The contrast failure compounds on muted seasonal palettes.
Cart drawer focus management
Auto-fixWCAG: 2.1.2 No Keyboard Trap
Cart-drawer modals open as overlays without enforcing a focus trap — keyboard users tabbing through the page after opening the drawer can land on background elements. Auto-fix patches the drawer JavaScript to trap focus, handle Escape, and restore focus to the trigger on close.
FAQ
Is the Shopify Motion theme accessible by default?
Shopify has not published a Theme VPAT for Motion. The theme is engineered with accessibility in mind, but accessibility regressions appear in standard merchant customizations (color palette, section layouts, third-party apps). The hot-spots above are the most common predictable regressions based on the theme's structural patterns.
What WCAG criteria does Motion most often fail?
Across stores running Motion, the most-frequently-cited criteria are 1.1.1 Non-text Content (alt text), 1.4.3 Contrast Minimum (color contrast), 4.1.2 Name, Role, Value (icon-only buttons), and 2.5.8 Target Size Minimum (mobile tap targets). Each maps to a deterministic theme-code fix.
Can AccessComply fix Motion accessibility issues automatically?
Yes. AccessComply scans the live Motion storefront, identifies WCAG 2.1 + 2.2 AA failures, and writes source-code fixes directly to the theme files via the Shopify Admin API. Roughly 70-80% of common violations auto-fix; the remainder are flagged for manual review with suggested code changes.
Will AccessComply break my Motion customizations?
No. Every fix is preceded by a full theme backup. Fixes are scoped to specific WCAG-relevant attributes and styles — not the merchant's custom layout, copy, or branding. If a fix introduces a regression, the post-fix re-scan triggers automatic rollback.
Run a real Motion scan
AccessComply scans your live Motion storefront for the hot-spots above and writes source-code fixes directly to your theme files.