By AltGrade Editorial · Reviewed by AltGrade · Last updated

WCAG success criteria

Browse the WCAG success criteria AltGrade explains for online stores. Each page says what the check is, how to test it, and how to fix it on Shopify, WooCommerce, WordPress and Wix.

Four principles

WCAG groups success criteria into four principles. Perceivable means people can see or hear the content. Operable means they can use the controls. Understandable means the page behaves in a way they can predict. Robust means assistive technology can read the markup.

Shops feel all four on a product page. A photo with no alt text is perceivable. A swatch that is not a button is operable. An error that only turns red is understandable. A button with no name in the accessibility tree is robust.

The list below is the criteria we document, grouped by the first number in the id. Level A, AA and AAA are marked on each page. Most shop work aims at A and AA. AAA is there when you want the stricter check, such as enhanced contrast.

How to use a criterion page

Open the criterion that matches the finding in your scan. Read the failing example and the passing example. Then use the platform note for the editor you have. The related links jump to the fix article.

WCAG 1.4.3 is the contrast minimum. WCAG 1.1.1 is non-text content, which is your product photos. WCAG 2.1.1 is keyboard, which is your menu and your options. Those three cover a large share of what a first scan reports.

The criterion pages are reference. They are not a legal determination and they are not a conformance claim. This is general information, not legal advice. The official text is the W3C recommendation. Use these pages to decide the edit.

What a scan maps onto

AltGrade's scan reports issues in plain English and points at the criterion when there is a clear match. Missing alt text points at 1.1.1. Low contrast points at 1.4.3. A form field with no label points at 1.3.1 and 3.3.2. Use the fix page if you want the steps without the criterion number.

Not every criterion can be judged by an automated rule. A transcript, a sign-language video, or whether the writing makes sense needs a person. The catalogue tells you what that person should look for.

When you finish an edit, rescan. The free scan covers 10 pages. The £49 audit covers 50 and a PDF. Monitoring from £19 a month tells you if a theme publish brought the issue back.

A practical order for a store

Start with the path to purchase. Name the controls, label the fields, darken the price, and write the alt text. That set is mostly Perceivable and Operable, and it is what customers hit first.

Then fix errors and instructions so a mistake says what to do next. That is Understandable. Then check that custom widgets expose a name and a role. That is Robust.

Keep the official WCAG documents for the wording of the requirement. Use this index to find the shop version of the same check, with a failing example you can recognise on a product page. Then open the criterion that matches your first scan result.

1. Perceivable

2. Operable

3. Understandable

4. Robust

Questions

Are these the official WCAG pages?

No. They are plain-English notes for stores, with the criterion id so you can read the W3C text next to them.

Which level should a shop aim at?

A and AA cover the checks most scans and most policies talk about. Read AAA when you want a stricter bar.

Can a scan test every criterion?

No. Automated scans cannot catch every WCAG issue. Use the list, then review checkout yourself.

Related

Scan your site