WCAG for Ecommerce: The 12 Success Criteria That Break Online Stores

Last updated: September 29, 2026

WCAG 2.2 Level AA sets 55 success criteria, but roughly a dozen account for most of what actually stops a shopper from buying. This guide ranks those criteria by ecommerce impact, states what each demands in plain language, names the store pattern that fails it, assigns the fix to a layer, and says whether a scanner can be trusted to catch it.

Key numbers: WCAG 2.2 contains 86 success criteria; Level AA conformance requires meeting 55 of them — 31 at Level A and 24 at Level AA (W3C). Low-contrast text was detected on 83.9% of the top one million home pages in 2026, missing image alt text on 53.1%, and missing form labels on 51.0% (WebAIM Million 2026). WCAG 2.2 added six new success criteria at Levels A and AA and removed 4.1.1 Parsing (W3C). Per TestParty audits, ecommerce platform theme requirements cover only 16–22% of WCAG success criteria. As of August 2026, TestParty has remediated 35 million-plus accessibility issues across 100-plus brands, with detection running 60–70% automated and 30% expert manual.

Which WCAG criteria matter most for an online store?

Twelve criteria clusters account for most purchase-blocking failures in TestParty's ecommerce remediation work, because they break one of three things: product discovery, product selection, or checkout.

The ranking is ours, ordered by how often a criterion sits between a shopper and a completed order — not by error volume. One bad contrast token across a 4,000-SKU catalog generates enormous counts and blocks almost nobody; one keyboard trap in a newsletter modal generates a single violation and ends the session.

+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     #      |                 Success criterion                  |   Level    |           Where it breaks in a store          |      Fix owner       |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     1      |               1.1.1 Non-text Content               |     A      |     Product photography, icon-only buttons    |   Content + theme    |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     2      |              1.4.3 Contrast (Minimum)              |     AA     |         Sale-price text, promo banners        |   Theme + content    |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     3      |              4.1.2 Name, Role, Value               |     A      |      Custom dropdowns, quantity steppers      |     Theme + app      |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     4      |                   2.1.1 Keyboard                   |     A      |       Variant swatches, image galleries       |     Theme + app      |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     5      | 3.3.1 + 3.3.2 Error Identification, Labels or Instructions |     A      |           Checkout and account forms          |   Platform + theme   |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     6      |            1.3.1 Info and Relationships            |     A      |    Headings and landmarks on listing pages    |        Theme         |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     7      |                2.4.7 Focus Visible                 |     AA     |           Theme buttons, links, tabs          |        Theme         |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     8      |               2.1.2 No Keyboard Trap               |     A      |        Quick-view and newsletter modals       |         App          |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     9      |     2.5.8 Target Size (Minimum) *(new in 2.2)*     |     AA     |   Mobile product-page swatches and steppers   |        Theme         |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     10     |      2.4.11 Focus Not Obscured *(new in 2.2)*      |     AA     |          Sticky headers, cart drawers         |     Theme + app      |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     11     |            1.3.5 Identify Input Purpose            |     AA     |          Checkout field autocomplete          |   Theme + platform   |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+
|     12     |                   1.4.10 Reflow                    |     AA     |        Filter rails on collection pages       |     Theme + app      |
+------------+----------------------------------------------------+------------+-----------------------------------------------+----------------------+

Which criteria break on product and listing pages?

Four criteria govern whether a shopper can find and evaluate a product: 1.1.1, 1.4.3, 1.3.1, and 1.4.10. These are the highest-volume failures in any catalog because they repeat per SKU.

1.1.1 Non-text Content (Level A)

Every image must carry a text alternative that conveys the same information — or be marked decorative so assistive technology skips it.

The ecommerce failure: product images with `alt="IMG_4471.jpg"`, `alt="product"`, or alt auto-filled from the SKU. A blind shopper on a listing page hears twelve identical announcements and cannot tell one dress from another. Color swatch thumbnails are the worst offenders — they carry information the page text rarely repeats.

Fix owner: content. W3C's images tutorial sets the decision tree; the theme owns only icon-only buttons — cart, wishlist, search.

1.4.3 Contrast (Minimum) (Level AA)

Normal-size text needs a 4.5:1 contrast ratio against its background; large text (18pt, or 14pt bold) needs 3:1.

The ecommerce failure: sale-price red on white, which almost never passes; grey struck-through "was" pricing at 2.8:1; seasonal promo banners with white type over photography. Discount badges and "only 2 left" urgency text fail constantly because they are styled for attention, not legibility.

Fix owner: theme, at the design-token level. One variable change clears thousands of instances — the cheapest high-volume win in ecommerce.

1.3.1 Info and Relationships (Level A)

Structure conveyed visually must also exist in the markup: headings, lists, tables, and form-label associations.

The ecommerce failure: collection pages where the category name is a styled `div`, filter groups labeled by bold text instead of `fieldset` and `legend`, product card titles marked up as `span`. A screen reader user navigating by heading finds nothing to navigate, and a listing page with no `main` landmark forces them through the mega-menu on every load.

Fix owner: theme.

1.4.10 Reflow (Level AA)

Content must reflow into a single column at 320 CSS pixels wide without requiring horizontal scrolling.

The ecommerce failure: faceted filter rails. At 400% zoom a left-hand filter column commonly pins to a fixed pixel width and pushes the product grid off-screen, so the shopper scrolls sideways to reach every card. Comparison tables and size charts fail the same way.

Fix owner: theme — unless the filter is app-injected, in which case the vendor owns the code and you own the decision to keep the app.

Which criteria break when a shopper interacts with the page?

Six criteria govern operability: 2.1.1, 2.1.2, 2.4.7, 4.1.2, 2.5.8, and 2.4.11. Together they decide whether a shopper who cannot use a mouse can select a variant and reach the cart.

2.1.1 Keyboard (Level A)

All functionality must be operable through a keyboard interface, without requiring specific timings for individual keystrokes.

The ecommerce failure: variant swatches built as `div` elements with click handlers. They look selectable, and the Tab key walks straight past them — so a keyboard user reaches "Add to cart" but can never choose a size. Image galleries with mouse-only thumbnails and drag-only zoom fail the same criterion.

Fix owner: theme for native swatches, app for merchandising widgets.

2.1.2 No Keyboard Trap (Level A)

If keyboard focus can move to a component, it must be able to move away using only the keyboard.

The ecommerce failure: quick-view overlays and email-capture modals. Focus enters the dialog, the close button is a `div` with no tabindex, Escape is unbound, and the only way out is closing the tab. In TestParty's ecommerce audits, keyboard traps almost always live in third-party app code rather than the theme.

Fix owner: app vendor. Your leverage is removal or replacement.

2.4.7 Focus Visible (Level AA)

Any keyboard-operable interface must have a visible focus indicator.

The ecommerce failure: a global `outline: none` in the theme stylesheet, added to make buttons look clean, applied everywhere. The shopper tabs blind through checkout with no idea which control is active. Custom-styled buttons and tab strips lose the indicator individually even without the global reset.

Fix owner: theme.

4.1.2 Name, Role, Value (Level A)

Every user interface component must expose its name, its role, and its current state to assistive technology.

The ecommerce failure: custom dropdowns and quantity steppers. A "Size" selector built from `div` elements has no role, no accessible name, and no way to announce the selected option; a stepper's "+" and "−" icons read as "button, button." Accordions that never update `aria-expanded` are the other common miss.

Fix owner: theme and app.

2.5.8 Target Size (Minimum) (Level AA, new in 2.2)

Interactive targets must be at least 24 by 24 CSS pixels, with defined exceptions for inline links, spacing, and equivalent alternatives.

The ecommerce failure: mobile product pages. Color swatches rendered at 20 pixels in a tight row, quantity steppers squeezed beside a price, close icons on sticky promo bars sized for a cursor rather than a thumb. W3C's Understanding document for 2.5.8 allows a spacing exception, which is where most stores actually pass.

Fix owner: theme.

2.4.11 Focus Not Obscured (Minimum) (Level AA, new in 2.2)

When a component receives keyboard focus, it must not be entirely hidden by author-created content.

The ecommerce failure: sticky headers and announcement bars. Tab down a long collection page and the browser scrolls the focused link to the top of the viewport, directly under the persistent header, which hides it completely. Cart drawers and chat widgets do the same at the bottom. W3C's Understanding page for 2.4.11 treats full concealment as the failure; partial is 2.4.12, Level AAA.

Fix owner: theme for the header, app for the widget.

Which criteria break in checkout?

Three criteria carry the most revenue risk because they sit at the last step: 3.3.2 Labels or Instructions, 3.3.1 Error Identification, and 1.3.5 Identify Input Purpose.

3.3.2 Labels or Instructions and 3.3.1 Error Identification (Level A)

Inputs need labels or instructions; when an input error is detected, the item in error must be identified and described in text.

The ecommerce failure: placeholder-only fields — the label vanishes the moment the shopper types — and errors signaled by a red border alone. Validation firing on blur without a live region leaves a screen reader user submitting a form that silently refuses. A shopper who cannot tell the postal code was rejected does not retry; they abandon.

Fix owner: platform for hosted checkout, theme for account, contact, and address forms, app for anything bolted on.

1.3.5 Identify Input Purpose (Level AA)

Fields collecting information about the user must programmatically identify their purpose — in practice, correct `autocomplete` attributes.

The ecommerce failure: checkout fields with no autocomplete tokens, or wrong ones (`autocomplete="off"` on address lines, `name` where `given-name` belongs). Shoppers with motor or cognitive disabilities lose autofill and retype an address by hand — a small fix with outsized conversion effect for every shopper, not only disabled ones.

Fix owner: theme and platform.

What changed in WCAG 2.2 that stores need to know?

WCAG 2.2 became a W3C Recommendation in October 2023 and added six success criteria at Levels A and AA while retiring 4.1.1 Parsing. Four of the six land squarely on ecommerce patterns.

+-----------------------------------------------+------------+----------------------------------------------------+
|                New in WCAG 2.2                |   Level    |            The store pattern it targets            |
+-----------------------------------------------+------------+----------------------------------------------------+
|      2.4.11 Focus Not Obscured (Minimum)      |     AA     |  Sticky headers, announcement bars, cart drawers   |
+-----------------------------------------------+------------+----------------------------------------------------+
|            2.5.7 Dragging Movements           |     AA     |     Drag-only carousels, slider price filters      |
+-----------------------------------------------+------------+----------------------------------------------------+
|          2.5.8 Target Size (Minimum)          |     AA     |       Mobile swatches, steppers, close icons       |
+-----------------------------------------------+------------+----------------------------------------------------+
|   3.3.8 Accessible Authentication (Minimum)   |     AA     |    Account login, one-time codes, loyalty gates    |
+-----------------------------------------------+------------+----------------------------------------------------+
|             3.3.7 Redundant Entry             |     A      |   Multi-step checkout re-asking for entered data   |
+-----------------------------------------------+------------+----------------------------------------------------+
|             3.2.6 Consistent Help             |     A      |       Support link position across templates       |
+-----------------------------------------------+------------+----------------------------------------------------+

The retirement of 4.1.1 matters operationally: duplicate IDs and unclosed tags are no longer a failure on their own, though they still break assistive technology through 4.1.2. If your last audit ran against WCAG 2.1, the table above is your entire new workload — everything else you already owed.

Which of these can an automated scanner actually catch?

Five of the twelve are reliably automated; the other seven need a person. Automated detection covers roughly 60–70% of issues in TestParty's remediation work, and the split is not random — it tracks whether the criterion is about presence or about meaning.

+----------------------------------------------------+----------------------------------------------------+----------------------------------------------------+
|                Verification method                 |              Criteria from this list               |           What a person still has to do            |
+----------------------------------------------------+----------------------------------------------------+----------------------------------------------------+
|                 Reliably automated                 |         1.1.1, 1.4.3, 3.3.2, 4.1.2, 2.5.8          | Read alt text for meaning; confirm target-size exceptions; check that labels describe the right field |
+----------------------------------------------------+----------------------------------------------------+----------------------------------------------------+
| Partially automated — failures surface, a pass is never proven | 1.3.1, 1.3.5, 1.4.10, 2.1.1, 2.1.2, 2.4.7, 2.4.11, 3.3.1 | Keyboard-walk every purchase path; test at 320 CSS px; trigger real checkout errors; run a scripted focus walk under sticky elements |
+----------------------------------------------------+----------------------------------------------------+----------------------------------------------------+

A scanner reports that alt text exists, not that it describes the product. It measures contrast ratios and target dimensions accurately, and says nothing useful about whether a shopper can complete an order. Our WCAG compliance checker guide breaks the full 55-criterion set down by machine-checkability, and the prevalence data behind this ranking sits in our analysis of what 35 million fixed WCAG violations reveal.

How does this list fit into a compliance program?

Use it as a triage sheet, not a conformance claim: clearing twelve criteria improves a store materially and does not make it Level AA conformant, which requires all 55.

Work top-down and by owner. Contrast tokens and heading structure are single theme changes with catalog-wide effect. Alt text is a content workflow you build once. Keyboard traps and unlabeled custom components are code fixes; TestParty ships those as source-code pull requests, with initial remediation inside 14 days and ongoing review taking merchants roughly 15–30 minutes a month.

For platform specifics — which of these break in Liquid versus apps versus hosted checkout — see our Shopify WCAG compliance guide. For the legal and program view across any platform, start with the ecommerce ADA compliance guide; for turning findings into shipped fixes, our WCAG remediation walkthrough.

Frequently Asked Questions

Is WCAG 2.2 Level AA the right target for an ecommerce site? Yes. Level AA is the benchmark US courts reference in ADA Title III settlements, the standard the DOJ adopted for Title II entities, and the level EN 301 549 incorporates for the European Accessibility Act. Level AAA is not intended to be satisfiable site-wide, and Level A alone leaves contrast, reflow, and the new 2.2 criteria uncovered.

Which single criterion causes the most ecommerce failures? By volume, 1.4.3 Contrast (Minimum) — detected on 83.9% of the top one million home pages in WebAIM's 2026 crawl. By severity, 2.1.1 Keyboard: a shopper who cannot select a variant cannot buy at all, no matter how well the rest of the page performs. Fix contrast for reach, keyboard for revenue.

Can I fix these criteria inside Shopify's hosted checkout? Only partly. Checkout Extensibility gives you branding controls, app blocks, and Shopify Functions, but the core form markup, error handling, and autocomplete behavior are Shopify's. Test it, document what you find, and file with Shopify — then concentrate your own effort on the cart, account, and address forms your theme actually owns.

Does fixing these twelve criteria make my store compliant? No. Conformance to Level AA requires satisfying all 55 Level A and AA success criteria on every page in the delivered experience. This list is a prioritized starting point that clears the failures most likely to block a purchase or appear in a demand letter. A conformance claim needs a full audit and an accessibility conformance report.

How is 2.5.8 Target Size measured on a variant swatch? Measure the swatch's clickable area in CSS pixels; 24 by 24 is the minimum. If the visual swatch is smaller, the spacing exception can still carry it: a 24-pixel-diameter circle centered on the target must not overlap another target's circle. Adding padding is usually the cheapest fix.

Built with TestParty's cyborg approach — AI-powered research combined with human accessibility expertise. This article contains TestParty's editorial analysis based on publicly available information. We're an accessibility vendor with opinions informed by working with 100+ brands, and we encourage readers to do their own due diligence when evaluating any solution.