WCAG checklist in plain English
WCAG 2.1, level AA is the standard the ADA rule uses for websites. Here are its rules in everyday words, grouped by topic. The number after each one is its official WCAG number, in case your web developer asks.
A computer can check some of these, and ADA Gap does. Others need a person to look, so we mark those with (a person checks).
Pictures
- Every picture that means something has a short description that says what it shows. Pictures that are only decoration are hidden from screen readers. (1.1.1)
- Don't put important words inside a picture. Use real text instead, except for logos. (1.4.5, a person checks)
Video and sound
- Videos with talking have captions. (1.2.2, a person checks)
- Live video with talking, like a streamed meeting, has live captions. (1.2.4, a person checks)
- Audio-only recordings, like podcasts, have a written transcript. (1.2.1, a person checks)
- If a video shows something important without saying it, a voice describes it, or there is a text version. (1.2.3, 1.2.5, a person checks)
- Sound that plays by itself for more than 3 seconds can be stopped or turned down. (1.4.2)
Page layout
- Headings, lists and tables are built as real headings, lists and tables, not just big or bold text. (1.3.1)
- The page reads in a sensible order. (1.3.2, a person checks)
- Instructions don't rely only on shape, size or place, like "click the round button on the right". (1.3.3, a person checks)
- Each page has a title that says what it is. (2.4.2)
- Headings and labels describe what comes after them. (2.4.6, a person checks)
- There is a way to skip past the menu straight to the main content. (2.4.1)
- There is more than one way to find a page, like a menu and a search box. (2.4.5, a person checks)
- Menus and buttons that repeat on every page stay in the same place and keep the same names. (3.2.3, 3.2.4, a person checks)
- The page says which language it is in. (3.1.1)
- A passage in another language is marked, so a screen reader pronounces it right. (3.1.2, a person checks)
Color and text
- Text stands out clearly from its background. Normal text needs a contrast of at least 4.5 to 1, large text 3 to 1. (1.4.3)
- Buttons, form box edges and icons stand out at least 3 to 1. (1.4.11)
- Color is never the only way to show something, like red for "required". (1.4.1, a person checks)
- Text can be made twice as big without anything getting cut off. (1.4.4)
- Nothing breaks when people add more space between lines, words and letters. (1.4.12)
Keyboard
- Everything works with only a keyboard. (2.1.1)
- The keyboard never gets stuck in one place. (2.1.2)
- You can always see where the keyboard is, usually as an outline. (2.4.7)
- Pressing Tab moves through the page in a sensible order. (2.4.3)
- Moving the keyboard onto something never opens a new page or pop-up by itself. (3.2.1, a person checks)
- Single-letter shortcuts can be turned off or changed. (2.1.4, a person checks)
Links and buttons
- Every link says where it goes. "Read more" or "click here" alone is not enough. (2.4.4)
- Every button has a name, even if it only shows an icon. (4.1.2)
- The words people see on a button are part of its name, so voice control works. (2.5.3)
- Things that need a swipe or a two-finger gesture also work with a single tap. (2.5.1, a person checks)
- A click happens when you let go, so you can slide off a button to cancel a mistake. (2.5.2, a person checks)
- Anything done by shaking or tilting the phone also has a button, and the shaking can be turned off. (2.5.4, a person checks)
Forms
- Every form box has a label that says what to type. (1.3.1, 3.3.2)
- Boxes for name, email, phone and address can fill in automatically. (1.3.5)
- Mistakes are explained in words, with a hint on how to fix them. (3.3.1, 3.3.3, a person checks)
- Before money or legal forms are sent, people can check and correct them. (3.3.4, a person checks)
- Choosing something in a form doesn't jump to another page by surprise. (3.2.2, a person checks)
- Messages like "Added to cart" or "3 results" are announced by screen readers without moving the keyboard. (4.1.3, a person checks)
Zoom and phones
- At 400% zoom the page fits the screen without scrolling sideways. (1.4.10)
- The page works both upright and sideways on a phone. (1.3.4)
Time and movement
- If there is a time limit, people can turn it off or ask for more time. (2.2.1, a person checks)
- Anything that moves, blinks or scrolls for more than 5 seconds can be paused. (2.2.2, a person checks)
- Nothing flashes more than 3 times a second. (2.3.1, a person checks)
- Pop-ups that appear on hover can be closed and don't vanish while you read them. (1.4.13, a person checks)
PDFs and other documents
The same rules apply to PDFs. On top of that, a PDF needs real text (not a scanned picture), tags that tell a screen reader what is a heading or a list, a title, and a language. ADA Gap checks PDFs against PDF/UA, the international standard for accessible PDFs.
Next step
Check a page or a PDF with ADA Gap to see which of these your site already meets. For the legal side, read our ADA website guide.