The 10 Most Common WCAG 2.1 AA Violations on Shopify Stores
After scanning hundreds of Shopify stores, these are the violations we see most often. Understanding these patterns is the first step toward building a compliant storefront.
After scanning hundreds of Shopify stores across verticals — apparel, beauty, home goods, electronics, and more — we've identified the violations that appear most consistently. These are not edge cases. They are structural patterns baked into how most themes are built and how merchants configure their stores.
1. Insufficient Color Contrast
WCAG 1.4.3 requires a contrast ratio of at least 4.5:1 for normal text. The most common failures we see: light gray text on white backgrounds, amber or yellow CTAs with white text, and product price labels that fall below threshold. This single criterion accounts for roughly 30% of all violations we surface.
2. Missing Image Alt Text
Product images without meaningful alt text fail WCAG 1.1.1. Shopify makes it easy to add alt text in the media library, but most merchants either leave it blank or copy the filename. Decorative images should have empty alt attributes (alt=""), not absent ones.
3. Inaccessible Form Labels
Search fields, email inputs, and quantity selectors that rely on placeholder text alone fail WCAG 1.3.1 and 3.3.2. Placeholders disappear on focus and are not reliably announced by screen readers. Every input needs a programmatically associated label.
4. Keyboard Navigation Traps
Modal dialogs — size selectors, quick-view panels, cookie banners — that do not trap focus correctly, or that trap it and never release it, fail WCAG 2.1.2. Keyboard users can become completely stuck. This is one of the most severe functional failures we encounter.
5. Missing Skip Navigation Links
Without a skip link, keyboard users must tab through your entire navigation on every page before reaching content. WCAG 2.4.1 requires a mechanism to bypass repeated blocks. A single visually-hidden "Skip to main content" link resolves this entirely.
6. Ambiguous Link Text
"Click here," "Read more," and "Shop now" links fail WCAG 2.4.6 when their purpose cannot be determined from context. Screen reader users often navigate by listing all links on a page — ambiguous text makes this mode unusable.
7. Auto-Playing Media
Hero videos and animated banners that play automatically without a pause control fail WCAG 1.4.2 (for audio) and 2.2.2 (for motion lasting more than five seconds). This is especially common on newer Shopify themes emphasizing full-bleed video.
8. Touch Target Size
WCAG 2.5.5 recommends touch targets of at least 44×44 CSS pixels. Navigation icons, close buttons on modals, and quantity increment/decrement controls are frequently undersized — particularly on mobile. WCAG 2.2 raised this to a formal AA criterion.
9. Missing Focus Indicators
Removing the default browser focus outline without providing a custom visible replacement fails WCAG 2.4.7. This is extremely common — many themes suppress :focus styles to avoid the visual interruption, leaving keyboard users with no indication of where they are on the page.
10. Dynamic Content Not Announced
Add-to-cart confirmations, filter result counts, and error messages that update without a page reload often go unannounced to screen reader users. ARIA live regions (role="status" or aria-live="polite") are the standard fix, but most Shopify themes do not implement them.
The pattern here is consistent: these are all addressable, they all have well-documented solutions, and none of them require rebuilding your store. A prioritized remediation plan targeting these ten categories will resolve the majority of the violation surface on most Shopify storefronts.