Shopify Turbo theme — accessibility hot-spot audit
Accessibility hot-spots in Turbo
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.
"Added to cart" status messages
Auto-fixWCAG: 4.1.3 Status Messages
Toast notifications announcing "Item added to cart" appear visually but lack `role="status"` / `aria-live` wrapping, so screen readers do not announce them. Auto-fix wraps the toast container in `role="status"` and ensures dynamically-injected text passes through the live region.
Multi-step quick-buy redundant entry
Partial auto-fixWCAG: 3.3.7 Redundant Entry
Quick-buy flows that re-prompt for email or shipping fail 3.3.7. Auto-fix carries values forward.
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.
Focus-visible styling on theme buttons
Auto-fixWCAG: 2.4.7 Focus Visible
Custom button styling sometimes overrides browser default focus rings without replacing them. Auto-fix scopes a high-contrast focus ring to `:focus-visible` so it shows for keyboard users without leaving a lingering ring after mouse clicks.
FAQ
Is the Shopify Turbo theme accessible by default?
Shopify has not published a Theme VPAT for Turbo. 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 Turbo most often fail?
Across stores running Turbo, 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 Turbo accessibility issues automatically?
Yes. AccessComply scans the live Turbo 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 Turbo 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 Turbo scan
AccessComply scans your live Turbo storefront for the hot-spots above and writes source-code fixes directly to your theme files.