WCAG Level 2.1 A, AA, AAA Checklist For E-commerce Sites

Building a Solid Foundation for Accessibility

While addressing the specific WCAG guidelines outlined in this checklist is essential, achieving true, lasting, and comprehensive WCAG 2.1 AA compliance requires more than just surface-level adjustments. In today’s digital landscape, eCommerce accessibility is no longer optional – it’s a legal requirement, a business imperative, and a fundamental aspect of ethical online commerce. But achieving true compliance goes far beyond simply adding an accessibility overlay to an existing website.

To truly protect your business and provide an inclusive experience for all potential customers, you need a solid foundation: an eCommerce platform meticulously designed and built from the ground up with accessibility as a core principle. This isn’t just about avoiding lawsuits; it’s about creating a welcoming and usable online store for everyone, ensuring that users of all abilities can seamlessly navigate, browse, find products, and complete purchases.

EnterpriStore offers a solution by providing an eCommerce platform built with WCAG 2.1 AA source code compliance as an integral part of its design. This proactive approach minimizes the need for extensive remediation later and provides a genuinely inclusive experience from the outset.

WCAG 2.1 Level A Accessibility Guidelines

A. Text and Media Accessibility

1. Text Alternatives for Non-Text Content
Provide descriptive text alternatives for all non-text content, such as images, charts, and infographics. These alternatives should be comprehensive enough to convey the same information as the visual content and can be transformed into formats like large print, braille, speech, or symbols. It is important to note that this requirement does not extend to decorative images that do not hold informative value.

2. Alternatives for Video and Audio Content
Ensure that video-only and audio-only content is accompanied by alternative formats. This could include providing transcripts for audio files and audio descriptions for videos, making the information accessible to users who are deaf, hard of hearing, blind, or have low vision.

3. Captions for Audio in Videos
All videos that contain audio must have synchronized captions. Captions should accurately reflect spoken dialogue as well as important non-verbal sounds (e.g., music cues and sound effects) to ensure that users who are deaf or hard of hearing can fully engage with the content.

B. Visual Presentation and Interaction

4. Color Contrast and Visual Indicators
Ensure that any critical information conveyed through color is also available through other visual means, such as text labels or patterns. This is essential for users with color blindness or visual impairments to access the information effectively.

5. Control Over Auto-Playing Content
Provide users with the ability to control auto-playing media on your website. Auto-playing content can disrupt screen readers and create a frustrating experience for users. If feasible, consider disabling auto-play entirely to improve accessibility.

6. Keyboard Navigation
Guarantee that all website functionalities can be accessed and operated using a keyboard alone. This is crucial for users with mobility impairments who may not be able to use a mouse, ensuring they can navigate your site effectively.

7. Time Limit Control
Allow users to manage time limits when interacting with time-sensitive content. Users should have the option to request additional time without losing any entered data or session progress, accommodating those who may need more time to read or respond.

8. Seizure-Inducing Content Prevention
Design web pages that do not include content capable of inducing seizures, such as flashing elements that blink more than three times per second. This is particularly important for individuals with photosensitive epilepsy.

9. Customizable Single-Key Shortcuts
Ensure that single-key shortcuts used on your website can be disabled or modified by users. This flexibility helps prevent accidental activation of shortcuts that may interfere with navigation.

C. User Experience Enhancements

10. “Skip to Content” Link
Implement a “Skip to Content” link at the top of your web pages, allowing users to bypass repetitive navigation links and jump directly to the main content area. This feature enhances the browsing experience for users who rely on keyboard navigation.

11. Error Identification and Description
If a user makes an error while filling out forms or interacting with the site, provide clear text descriptions of the error and how to resolve it. Simply highlighting a field in red is insufficient; detailed instructions should guide users in correcting their input.

12. Clear and Helpful Web Page Titles
Ensure that each web page has a clear and descriptive title that accurately reflects its content. This helps users understand what to expect when navigating through different pages and assists in improving overall site navigation.

13. Accessibility for Users with Limited Mobility
Confirm that all website functions can be performed by users with limited mobility. This includes ensuring that actions typically performed with a mouse can also be accomplished using keyboard shortcuts or alternative input devices.

14. Language Assignment for Web Pages
Assign the correct language attribute to each web page to assist screen readers and other assistive technologies in accurately interpreting the content. This is essential for users who rely on these technologies for comprehension.

15. Stability of Web Elements Upon Input
Ensure that web elements do not change unexpectedly when they receive input from users. This stability helps prevent confusion and enhances usability, particularly for individuals using assistive technologies.

WCAG 2.1 Level AA Accessibility Guidelines

A. Live and Multimedia Content Accessibility

1. Captions for Live Videos
Provide real-time captions for live video content to ensure accessibility for users who are deaf or hard of hearing. Captions should accurately reflect spoken dialogue, sound effects, and relevant non-verbal cues to enhance understanding and engagement during live broadcasts.

2. Audio Descriptions for Video Content
Include audio descriptions for video content to assist users who are blind or have low vision. Audio descriptions should provide verbal narration of visual elements, such as actions, settings, and on-screen text, ensuring that all viewers can fully comprehend the content being presented.

B. Visual Presentation and Layout

3. Support for Multiple Screen Orientations
Ensure that website visitors can utilize either portrait or landscape screen orientations without hindrance. Content must remain fully viewable and operable in both orientations, unless a specific orientation is critical for functionality (e.g., banking applications or presentation slides).

4. High Contrast Between Text and Backgrounds
Maintain a strong contrast ratio of at least 4.5:1 between text (including images of text) and its background to enhance readability. For larger text (18pt or greater), a contrast ratio of 3:1 is acceptable. This guideline helps users with visual impairments read content more easily. Note that this requirement does not apply to logos or brand names.

5. Text Resizing Without Loss of Functionality
Ensure that text can be resized up to 200% without loss of content or functionality. Users should be able to zoom in on text for better readability while still being able to navigate the website effectively.

6. Responsive Web Design
Implement a responsive web design that adapts seamlessly to various screen sizes and devices. This ensures that all users, regardless of their device, can access the content without compromising usability or accessibility.

C. Navigation and User Experience

7. Clear Headings and Labels
Use descriptive headings and labels throughout the website to facilitate navigation for users with disabilities. Clear organization helps users quickly locate content and improves overall user experience by providing a logical structure.

8. Language Change Indication
Indicate in the code when the language changes within a web page. This allows assistive technologies, such as screen readers, to adjust their pronunciation and reading style accordingly, ensuring accurate comprehension of the content.

9. Consistent Menus, Icons, and Buttons
Maintain consistency in the design and placement of menus, icons, and buttons across the website. Consistent navigation elements help users with cognitive disabilities predict where to find information and how to interact with the site.

10. Text Spacing Adjustments
Ensure that when users adjust text spacing (line height, letter spacing, etc.), there is no loss of functionality or content visibility. This flexibility allows users to customize their reading experience without compromising the usability of interactive elements on the page.

WCAG 2.1 Level AAA Accessibility Guidelines

A. Enhanced Multimedia Accessibility

1. Sign Language Translations for Videos
Provide sign language interpretation for all video content to ensure accessibility for users who are deaf or hard of hearing. This involves employing qualified interpreters who can convey the spoken content and relevant visual information in sign language, making the material more inclusive.

2. Extended Audio Descriptions for Videos
Offer extended audio descriptions for video content, providing additional narration that describes visual elements during pauses in dialogue. This allows users who are blind or have low vision to gain a deeper understanding of the visual context and narrative flow.

3. Text Alternatives for Videos
Ensure that all videos have a comprehensive text alternative that conveys the same information as the video content. This may include detailed transcripts that describe both dialogue and significant visual elements, allowing users with varying disabilities to access the information.

4. Alternatives for Live Audio Content
Provide alternatives for live audio content, such as real-time transcription or captioning, to accommodate users who are deaf or hard of hearing. This ensures that all participants can engage fully in live events, webinars, or broadcasts.

B. Visual Accessibility Standards

5. High Contrast Ratio Requirements
Maintain a contrast ratio of at least 7:1 between text and background colors to enhance readability for users with visual impairments. For text that is bold or 18pt and larger, a minimum contrast ratio of 4.5:1 is acceptable. These guidelines do not apply to logos and brand names, which may have different design considerations.

C. User Interaction and Experience

6. Full Keyboard Accessibility
Ensure that every aspect of the website is fully operable via keyboard alone, without exceptions. This includes all interactive elements, forms, and navigation features, making it accessible for users with mobility impairments who cannot use a mouse.

7. Removal of Time Limits
Eliminate time limits on all website elements to provide users with ample time to read and interact with content at their own pace. This is especially important for users who may need additional time due to cognitive disabilities or other factors.

8. Control Over Content Changes
Ensure that no content on the website changes unless the user explicitly indicates a desire for such changes. This includes avoiding automatic updates or changes that could confuse or disrupt the user experience.

D. Clarity in Communication

9. Explanation of Abbreviations
When using abbreviations, provide clear explanations or definitions to ensure that all users understand the terminology being used. This is especially important for users who may not be familiar with specific jargon or acronyms.

10. Clarification of Unusual Words
Offer explanations for any unusual or complex words used on the website. Providing definitions or context helps ensure that all users, regardless of their reading level or familiarity with the subject matter, can comprehend the content effectively.

Ready to Make Your eCommerce Site Truly Accessible and Inclusive?

Don’t leave your business vulnerable to costly lawsuits, lost revenue, and reputational damage. Choose the complete solution for WCAG 2.1 AA compliance and provide an exceptional online experience for all your customers.

Learn how our ecommerce solution ensures accessibility and meets industry standards

Request a demo to see how Equally AI enhances accessibility and user experience

Contact us today for a comprehensive quotation to make your ecommerce or WordPress site WCAG 2.1 compliant