The Essential WCAG Checklist for Website Accessibility
The Essential WCAG Checklist for Website Accessibility
Ready to see AudioEye in action?
Watch Demo
Ensure your website meets WCAG standards with our comprehensive WCAG checklist. Discover key principles and compliance levels for optimal accessibility.
Originally Posted January 31, 2024
Despite the benefits of digital accessibility, organizations still struggle to meet minimum accessibility requirements. Based on a scan of roughly 40,000 enterprise homepages, we found that:
- 56% of images are not accessible to individuals with visual impairments.
- 64% of pages have links that are not clear to people with visual or cognitive impairments.
- 25% of forms are missing clear labels.
It’s these issues — and many more — that result in just 3% of the internet being accessible to individuals with disabilities.
To help organizations improve accessibility for people with disabilities, the World Wide Web Consortium (W3C) created the Web Content Accessibility Guidelines (WCAG). WCAG is a shared, international standard businesses should follow to meet accepted accessibility standards. The guidelines contain 86 success criteria that, when met, increase accessibility on digital platforms.
Below, we’ll provide a checklist of WCAG success criteria to ensure your digital products and services meet web accessibility compliance standards.
What You Need to Know About WCAG 2.2
Before you begin reviewing your web content for WCAG conformance, it’s important to understand the various versions of WCAG. Guidelines are updated as technology changes or to better accommodate users with certain disabilities. Additionally, each one builds on the previous version, further enhancing accessibility.
Here is a brief overview of the history of WCAG recommendations:
- WCAG 1.0: Released in May 1999 and now obsolete, the first version of WCAG included basic considerations for web accessibility. The version was primarily focused on HTML and was not very applicable to other technologies.
- WCAG 2.0: WCAG 2.0 was released in December 2008 and introduced the WCAG principles as well as success criteria for organizations to follow.
- WCAG 2.1: In June 2018, WCAG 2.1 introduced new success criteria that expanded on those released in WCAG 2.0. Many of these new criteria focused on mobile experiences to better serve individuals with cognitive disabilities and low vision.
- WCAG 2.2: WCAG 2.2 was released in October 2023 and introduced nine new success criteria, most of which focus on improving website navigation and user interactions. The measures outlined in WCAG 2.2 are the guidelines organizations should strive for.
To learn more about the latest version of WCAG recommendations, check out our post: “What’s New with WCAG 2.2.”
As mentioned above, WCAG 2.2 consists of 86 success criteria — pass or fail statements that address common accessibility barriers. Success criteria are organized into three conformance levels: Level A, Level AA, and Level AAA. Each level includes the success criteria from the previous one (i.e. Level AA includes all Level A success criteria, and Level AAA includes both Level A and Level AA criteria).
- Level A is considered the least strict conformance level and provides basic accessibility. It resolves accessibility issues that are likely to impact a large number of users, such as missing alt text or missing descriptions.
- Level AA expands on the success criteria of Level A and addresses more accessibility issues, such as maintaining appropriate color contrast, keeping navigation elements consistent, and using headings appropriately. In most countries, Level AA is considered the minimum standard for accessibility.
- Level AAA is the most strict — and the highest — compliance level. Level AAA includes accessibility requirements such as ASL interpretation and extended audio descriptions. These are requirements that most organizations may find difficult to fulfill.
Here’s the bottom line: organizations should strive to meet the compliance requirements outlined in WCAG 2.1 Level AA. This level removes most accessibility issues that hinder the experience for users with disabilities and provides a more usable, inclusive experience.
WCAG Checklist
We've created a comprehensive checklist to help you meet WCAG accessibility requirements. Don’t be overwhelmed by the number of success criteria — there are a lot of them, but they are doable with the right tools.
We also recommend starting with Level A success criteria before moving on to higher levels. You might also want to consider tackling easier fixes while creating a plan for more complex issues.
WCAG Checklist Level A
Comparison
Swipe to see and compare plans
Success Criteria
Description
Complete
Non-text Content
All non-text content (i.e. images, image buttons, and image map hot spots) have appropriate alternative text.
Audio-Only and Video-Only
Descriptive and accurate transcripts are provided for video- and audio-only content.
Captions
Captions are provided for pre-recorded videos or on-live videos (e.g., YouTube)
Information and Relationships
Headings include the right semantic markup. Tables are linked to the appropriate headers and include captions if necessary. Text labels are associated with the right form inputs.
Meaningful Sequence
Navigation order follows code order; navigation is clear and intuitive.
Sensory Characteristics
Instructions are not dependent on visual location, shape, or size (i.e., ‘Instructions are listed on the right’ or ‘Click the square button to continue’).
Use of Color
Color alone is not used to portray information, nor is it used to distinguish links from surrounding text unless the color contrast ratio is appropriate.
Audio Control
Users can pause, stop, change volume, or mute audio content that automatically plays on a page for longer than three seconds.
Keyboard
Web elements can easily be shared via a keyboard and include pager-specific keyboard shortcuts.
No Keyboard Trap
Keyboard focus and shortcuts are not locked or trapped on any page elements.
Character Key Shortcuts
Users must be able to disable key commands and change to non-printable keys, such as (Ctrl, Alt, etc.).
Timing Adjustable
Pages with time limits allow users to adjust, turn off, or expand the time limit.
Pause, Stop, Hide
Automatically moving, blinking, scrolling, or updating content lasting longer than five seconds can be paused, stopped, or hidden by users.
Three Flashes or Below
Page content does not flash more than three times per second.
Bypass Blocks
Users can skip navigation or other page elements that are repeated across web pages.
Page Titles
The webpage has a descriptive, informative page title.
Focus Order
The order of links is clear and follows a logical, intuitive order.
Link Purpose
Users can understand the purpose of a link from the text alone. Links with similar text that redirect to different locations are easily distinguishable.
Pointer Gestures
User actions can be performed with a single pointer gesture.
Pointer Cancellation
Inadvertent activation of controls is avoided by non-use of the ‘onmousedown’ activation.
Motion Actuation
Functionalities triggered by user movement or moving the device can be disabled, and similar functionality can be achieved via standard controls like buttons or controls.
Error Identification
Form validation or input errors are clearly identified and access to the error is quickly provided.
WCAG Checklist Level AA
Comparison
Swipe to see and compare plans
Success Criteria
Description
Complete
Captions
Live media with audio constraints synchronized captions.
Audio Description
Users have access to audio descriptions for non-live video.
Orientation
Web page orientation is not limited to portrait or landscape; users can adjust as needed.
Identify Input Purpose
Fields that collect certain user information have an ‘autocomplete’ attribute defined.
Contrast
Both text and images have a contrast ratio of at least 4.5:1. Large text has a ratio of at least 3:1.
Resize Text
Page elements are still readable and functional when zoomed to 200%.
Images of Text
If a visual representation can be portrayed through text alone, an image alone is not used to present text.
Reflow
Functionality is not lost when content is presented at a width of 320 pixels. Horizontal scrolling is avoided as much as possible.
Non-Text Contrast (Minimum)
A minimum contrast ratio of 3:1 is available for different objects, such as icons, charts, or graphs.
Text Spacing
Content or functionality is not lost when users adjust paragraph spacing.
Content on Hover or Focus
Content presented in hover or focus can be dismissed without moving the keyboard or printer.
Multiple Ways
Users have more than one way to find other web pages on a site.
Headings and Labels
Page headings and labels are informative and are not duplicated unless absolutely necessary.
Focus Visible
A visible indicator is present for page elements when they receive a keyboard focus.
Focus Not Observed
Elements with keyboard focus are entirely visible.
Dragging Movement
Actions that require pointer dragging can also be done with a single pointer.
Target Size
Pointer sizes are at minimum 24 by 24 pixels unless specified otherwise.
Language of Parts/Page
Language of pages is easily identifiable via the ‘lang’ attribute.
Consistent Navigation
Elements that repeat across a web page (e.g., a search bar) are consistently labeled as such across individual web pages.
Error Suggestion
When an error is detected, suggestions are provided for how to remedy the issue in a timely, accessible way.
Error Prevention
If a user changes or deletes financial, legal, or test data, the action can be reversed, confirmed, or verified as needed.
Excessive Authentication
Cognitive functions are not required during authentication processes unless it can be completed in another way, bypassed, or identification of non-text content is provided by the user (e.g., user-provided image).
Status Messages
Status messages are announced to screen readers via live region or ARIA alerts.
WCAG Checklist Level AAA
Comparison
Swipe to see and compare plans
Success Criteria
Description
Complete
Sign Language
Sign language interpretation is provided for media with audio.
Extended Audio Description
When the original video contains insufficient pauses and is not optimized for audio description, a separate video with sufficient pauses and audio descriptions is provided.
Media Alternative
Pre-recorded media includes a descriptive transcript.
Audio-Only
Descriptive text is provided for live content that contains audio.
Identify Purpose
ARIA is used to enhance HTML semantics, enabling users to more easily understand the purpose of interface elements.
Contrast
Images and text have a color contrast ratio 7:1; large text has a contrast ratio.
Low or No Background Audio
Audio content has little to no background noise, ensuring it is easily distinguished.
Visual Presentation
Blocks of text over one sentence in length are: Less than 80 characters wide, not fully justified, have adequate line spacing, include appropriate foreground and background colors, and does not require horizontal scrolling if size is doubled.
Images of Text
Text within an image is used only for decoration, or if the information cannot be presented through text alone.
Keyboard
All functionalities are available via the keyboard.
No Timing
There are no time limits or constraints to page content or functionality.
Interruptions
Interruptions such as alerts or updates can be postponed by the user.
Re-Authenticating
Users can re-authenticate a page and continue activities without losing data.
Timeouts
Users are adequately warned of timeouts that can result in data loss (unless data can be preserved for more than hours of user inactivity).
Three Flashes
No page content flashes three times per second.
Animations from Interactions
Non-essential animations and movements can be disabled by users.
Location
A web page that’s part of a sequence of web pages are indicated as such through breadcrumbs or specifying sequence steps.
Link Purpose
Users can distinguish the purpose of each link through link text alone.
Section Headings
Sections of content are designated using headers.
Focus not Obscured (Enhanced)
Elements with keyboard focus are entirely visible.
Focus Appearance
Instances where custom indicators or backgrounds are in place have at least a 3:1 contrast between focused/unfocused states, and are at least as large as the area of 2 pixel thick perimeter surrounding the element.
Target Size
Clickable targets are 44 by 44 pixels in size unless an alternative target size is provided.
Concurrent Input Mechanisms
Content is not limited to one specific input type (i.e., keyboard-only or touch-only) and supports alternative inputs.
Unusual Words
Unfamiliar or ambiguous words are defined through an index, definition list, or other appropriate method.
Abbreviations
Unfamiliar abbreviations are expanded and defined the first time it is used.
Reading Level
More understandable alternatives are provided for advanced content (typically provided for content above a ninth-grade reading level).
Pronunciation
Pronunciation guides are provided for words that are vital to the comprehension of the page.
Change on Request
Substantial changes (i.e. spawning of pop-up windows or changes in keyboard focus) are initiated by the user and can disable options if desired.
Help
Instructions or cues are provided to users who need assistance to complete tasks.
Error Prevention
Users can reverse, verify, or confirm submissions after information is submitted.
Accessible Authentication (Enhanced)
Cognitive function tests are not required for any step in the authentication process unless the test can be bypassed or completed with assistance from another mechanism.
Four Principles of WCAG
As you’re implementing the success criteria, it’s important to understand the principles that make up WCAG and how each one benefits users with disabilities.
WCAG is compromised of four principles:
- Perceivable: Content is presented in a way that can be easily understood by users. For example, captions for media, descriptive link or button text, and appropriate color contrast are all success criteria that ensure digital content can be understood by users.
- Operable: Users can interact with and navigate web elements regardless of their ability. Digital content should be keyboard accessible, offer multiple input modalities, and organized hierarchically in order to be operable.
- Understandable: Information presented on user interfaces is understandable by users, meaning they can comprehend the information being presented. For example, WCAG recommends content contain clear, simple language that avoids unusual words or jargon. Digital content should also have consistent navigation and clear labels or instructions.
- Robust: Web content is robust enough to be reliably interpreted by various user agents, including assistive technologies. WCAG Success Criterion 4.1.3 Status Messages, for example, requires messages be presented to indicate important changes, progress, or errors. This is particularly beneficial for screen reader users as it provides additional information without affecting the user’s current focus.
WCAG Conformance and Digital Accessibility Laws
Everyone has the right to access and use online content — following the success criteria included above enables you to create an accessible, inclusive environment that everyone can use. However, digital accessibility is also a legal requirement around the world. Most international accessibility laws use WCAG as the standard for accessibility, including:
- The Americans with Disabilities Act (ADA): The ADA prohibits discrimination against individuals with disabilities in public spaces, which includes the internet. Failure to follow the ADA (which includes creating an ADA-compliant website) can result in potential legal action. To comply with the ADA, you’ll need to meet the requirements included in WCAG 2.1 Level AA.
- The European Accessibility Act (EAA): Similar to the ADA, the EAA requires all public-sector organizations within the European Union (EU) to provide accessible products and services. The EAA also used WCAG 2.1 Level AA as a basis for compliance.
- The Accessibility for Ontarians with Disabilities Act (AODA): Under the AODA, businesses cannot discriminate against individuals with disabilities “with respect to goods, services, facilities, accommodation, employment, buildings, structures, and premises.” The AODA also uses WCAG 2.1 Level AA as a basis for AODA compliance.
Conform with WCAG Standards with AudioEye
The checklist above is a great starting point for enhancing your site’s accessibility. However, the number of success criteria and technical nature of a few of them might be difficult for you to find and fix on your own.
AudioEye can help. Our Automated Accessibility Platform is designed to simplify conformance with WCAG standards as well as increase the usability and accessibility of your digital content. We do this through our automated testing tools that are supplemented with real human testing. This includes:
- Our Color Contrast Checker that helps you reach minimum color contrast ratios throughout your site.
- Expert Audits that provide a comprehensive summary of your website’s accessibility as determined by human experts and individuals with disabilities.
- Active Monitoring that regularly scans your content for accessibility.
- Automated Remediations that apply automatic fixes to common accessibility errors.
- Ongoing accessibility training to help you create a foundation for ongoing accessibility.
Whether you’re just getting started with WCAG or want to further your site’s accessibility, AudioEye provides the resources, guidance, and support needed for sustainable, long-term compliance.
Get started with a free accessibility scan which tests against WCAG 2.2 Level AA criteria. Or schedule a demo to see what more AudioEye can do.
Ready to see AudioEye in action?
Watch Demo
Ready to test your website for accessibility?
Share post
Topics:
Keep Reading
What Is Usability Testing: Definition, Benefits, How-To
Usability testing helps you fix accessibility errors before they cost you. Here's what it entails, how it works, and why it should be a priority.
accessibility
October 01, 2024
Enhancing User Experience for Everyone: How WCAG Makes the Web More Accessible
Discover how WCAG guidelines enhance the user experience for all individuals, regardless of their ability. Learn more about inclusive design in this blog post.
accessibility
September 18, 2024
UX and SEO: How the User Experience Impacts Organic Search
What role does accessible design play in bridging user experience with organic search performance? Learn more with AudioEye.
accessibility
September 13, 2024