What Is WCAG?
WCAG stands for Web Content Accessibility Guidelines. Published by the World Wide Web Consortium (W3C), these guidelines define how to make digital content accessible to people with disabilities. The current version is WCAG 2.2, released in October 2023. It builds on WCAG 2.1 (2018) and the original WCAG 2.0 (2008) by adding new success criteria while keeping all previous requirements intact.
WCAG is not a law itself, but it is referenced by laws around the world. In the United States, the Department of Justice has affirmed that ADA compliance for websites aligns with WCAG 2.1 Level AA. The European Accessibility Act (EAA) and Canadas Accessible Canada Act also reference WCAG. When a court or regulator evaluates whether a website is accessible, WCAG is almost always the measuring stick they use.
For a deeper look at the legal side, see our guide to ADA compliance.
The Four Principles: POUR
WCAG is organized around four foundational principles. Every success criterion falls under one of them. The acronym POUR makes them easy to remember.
1. Perceivable
Information and user interface components must be presentable in ways users can perceive. This means content cannot rely on a single sense alone.
- Images need text alternatives (alt text) so screen readers can describe them
- Videos need captions for people who are deaf or hard of hearing
- Color alone cannot be the only way to convey information
- Text must have sufficient contrast against its background
2. Operable
User interface components and navigation must be operable by everyone, including people who do not use a mouse.
- All functionality must be available from a keyboard
- Users must have enough time to read and use content
- Content must not cause seizures or physical reactions
- Users must be able to easily navigate, find content, and know where they are
3. Understandable
Information and the operation of the user interface must be understandable. People need to be able to comprehend both the content and how to use the interface.
- Text must be readable and understandable
- Web pages must appear and operate in predictable ways
- Forms must help users avoid and correct mistakes
- The language of the page must be programmatically declared
4. Robust
Content must be robust enough to be interpreted reliably by a wide variety of user agents, including assistive technologies.
- HTML must be well-formed and valid
- Custom interface components need proper ARIA roles and states
- Status messages must be programmatically available to assistive tech
Conformance Levels: A, AA, and AAA
WCAG defines three conformance levels. Each level includes all the requirements of the levels below it, so AA includes everything in A, and AAA includes everything in both A and AA.
| Level | What It Means | Who Needs It |
|---|---|---|
| A | The bare minimum. Addresses the most severe barriers that prevent access entirely. | Everyone should meet Level A at minimum. |
| AA | The standard target. Removes significant barriers for most users with disabilities. Includes contrast ratios of at least 4.5:1 for normal text. | Required by most laws and regulations, including ADA and EAA. This is the level most businesses should aim for. |
| AAA | The highest standard. Includes enhanced contrast (7:1), sign language for video, and more. Difficult to achieve for entire sites. | Specialized sites serving disability communities, government agencies with specific mandates. |
For most small businesses, WCAG 2.2 Level AA is the right target. It is what the law expects, what automated tools typically test against, and what provides a good experience for the broadest range of users.
What Is New in WCAG 2.2
WCAG 2.2 added nine new success criteria on top of WCAG 2.1. The most relevant changes for business websites include:
- Focus Not Obscured (AA): When an element receives keyboard focus, it must not be entirely hidden by other content like sticky headers or cookie banners.
- Dragging Movements (AA): Any functionality that uses dragging must also offer a simple pointer alternative, such as clicking.
- Target Size Minimum (AA): Interactive targets must be at least 24 by 24 CSS pixels, or have sufficient spacing between them.
- Consistent Help (A): If a help mechanism is provided (like a chatbot or contact link), it must appear in the same relative location across pages.
- Redundant Entry (A): Users should not have to re-enter information they have already provided in the same process.
- Accessible Authentication Minimum (AA): Login processes must not require cognitive function tests (like remembering a password) unless an alternative is available, such as a password manager or passkey.
WCAG 2.2 also removed one previous criterion (4.1.1 Parsing) because modern browsers and assistive technologies now handle HTML parsing issues automatically.
How to Test Your Site Against WCAG
No single tool catches every accessibility issue, but a combination of automated testing and manual review covers a lot of ground.
Automated Tools
- WAVE (wave.webaim.org): A free browser extension that highlights accessibility errors directly on your page.
- axe DevTools: A browser extension for developers that integrates with Chrome DevTools and catches WCAG violations in the code.
- Lighthouse: Built into Chrome, it includes an accessibility audit as part of its page analysis.
- Pa11y: An open-source command-line tool for running automated accessibility tests in CI/CD pipelines.
Automated tools can typically catch about 30 to 50 percent of WCAG issues. Things like missing alt text, low contrast, and missing form labels are easy for tools to detect. But whether an alt text description is actually meaningful, or whether a page flow makes logical sense, requires human judgment.
Manual Testing
- Keyboard testing: Unplug your mouse and navigate your entire site using only Tab, Shift+Tab, Enter, and arrow keys. Can you reach everything? Can you see where focus is?
- Screen reader testing: Try VoiceOver (macOS/iOS), NVDA (Windows, free), or TalkBack (Android) to hear how your site sounds to a non-visual user.
- Zoom testing: Zoom your browser to 200%. Does the layout still work? Is any content cut off or overlapping?
- Color testing: Use a color blindness simulator to check that your design works without full color perception.
For more on these testing methods, explore our guides on keyboard navigation, screen readers, and color blindness.
Common WCAG Failures on Business Websites
According to the WebAIM Million study, which tests the homepages of the top one million websites each year, the most common WCAG failures are remarkably consistent:
- Low contrast text: Text that does not meet the 4.5:1 contrast ratio against its background
- Missing alternative text: Images without alt attributes or with empty alt on informative images
- Missing form labels: Input fields that are not programmatically associated with a visible label
- Empty links: Links that have no text content, so screen readers announce them as blank
- Missing document language: The HTML element does not declare the page language
- Empty buttons: Buttons (especially icon buttons) without accessible names
The good news is that every one of these problems is straightforward to fix. They are coding-level issues, not fundamental redesigns. A competent web developer can resolve most of them in a matter of hours.