ADA Compliance Checklist Based on WCAG 2.2: Main Accessibility Requirements for Your Website

Web accessibility

Website accessibility is not a recommendation but a requirement. That is why every organization's website should adhere to ADA standards for both business success and legal protection.

The Americans with Disabilities Act (ADA) was established in 1990. It was before the global internet boom, so the rules didn’t initially apply to websites.

However, due to the rapid expansion of the internet, websites are now regarded as public spaces, thus this law covers them as well. Additionally, Section 508 of the Rehabilitation Act of 1973, enacted in 1998, also aims to remove barriers for all individuals in the World Wide Web.

To assist organizations in meeting these requirements, our accessible web development company has prepared an ADA compliance checklist.

Let’s get started!

What makes a website ADA compliant? WCAG to the rescue!

There are no clear ADA regulations that point out what kind of design is ADA compliant. However, most companies follow the Web Content Accessibility Guidelines (WCAG). These guidelines were developed by the Web Accessibility Initiative of the World Wide Web Consortium (W3C), which is the main international standards organization for the World Wide Web.

While not a legal requirement, courts often consider this document the standard. Furthermore, updated and reorganized Section 508 Standards Guidelines harmonize web accessibility requirements with WCAG 2.0.

The conclusion is clear: conducting regular web accessibility audit services and updating your website in accordance with WCAG is the best option.

Explore how our UX/UI designers create stunning and accessible websites for every user

ADA website compliance checklist — Based on WCAG 2.2

There are four versions of the accessibility guidelines: 1.0, 2.0, 2.1, and 2.2. WCAG 2.2, the most recent release, was issued on October 5, 2023. In our ADA website accessibility checklist we will focus on this specific version. Web developers, content creators, and designers can use it as a good starting point for remediating your website.

The structure of WCAG 2.2 adheres to four foundational principles, often remembered as the acronym POUR: Perceivable, Operable, Understandable, and Robust. This is what each of these principles imply:

  1. “Perceivable” emphasizes the importance of making information easily comprehensible for everyone.
  2. “Operable” means that users must be able to navigate and use the site, regardless of their ability to perform specific gestures or commands.
  3. “Understandable” ensures that both the information and the operation of the user interface are clear.
  4. “Robust” points out that content must be reliably interpretable by a wide variety of user agents, including assistive technologies.

Let’s explore the detailed aspects of each principle, breaking them down into tangible actions that can significantly enhance website accessibility.

1. Perceivable

1.1 Text alternatives:

  • Provide ‘alt text’ for all non-text content
  • Make sure interactive elements are clearly named
  • Offer transcripts for audio and captions for videos
  • Describe sensory-based non-text content with alternatives
  • Explain CAPTCHAs and provide alternatives for different disabilities
  • Make sure assistive technology skips decorative items

1.2 Time-based media:

  • Add alternatives for prerecorded audio and video
  • Use captions for prerecorded synchronized audios
  • Put captions on all live audios
  • Provide audio descriptions for all videos
  • Use sign language for prerecorded audios

1.3 Adaptable:

  • Clarify information structure programmatically
  • Preserve meaningful content sequence
  • Avoid relying solely on sensory traits such as shape, color, and size for comprehension
  • Allow multiple display orientations
  • Identify input field purposes clearly
  • Define UI elements’ roles programmatically
  • Ensure form input identification is consistent across different technologies

1.4 Distinguishable:

  • Don’t use color as the sole method for conveying important info
  • Provide controls for content that starts automatically
  • Ensure proper text and image contrast ratios
  • Allow text resizing without content loss
  • Use text instead of images for conveying information, except where necessary
  • Preserve content integrity during reflow

Our IT consultant can guide you in creating accessible, well-designed digital platforms

2. Operable

2.1 Keyboard accessible:

  • Ensure all functionality is available using a keyboard
  • Prevent keyboard traps
  • Provide options to turn off or remap keyboard shortcuts using character keys
  • Activate shortcuts only when the component is in focus

2.2 Enough time:

  • Allow users to turn off, adjust, or extend any time limits
  • Provide controls for moving, blinking, or auto-updating content
  • Allow users to delay or avoid interruptions, unless it’s an emergency
  • Allow data preservation when re-authenticating after session expiration
  • Adhere to privacy standards in data storage

2.3 Seizures and physical reactions:

  • Prevent content from flashing more than three times per second
  • Apply restrictions to all web page elements
  • Provide the option to disable motion animation activated by user interactions

2.4 Navigable:

  • Provide ways to skip repeated content blocks
  • Use descriptive titles for web pages
  • Ensure the purpose of a link is evident from its context
  • Offer multiple methods to find pages
  • Use clear and understandable headings and labels
  • Keep keyboard focus visible

2.5 Input modalities:

  • Simplify complex gestures to single-point activation
  • Include visual text in labels for user interface components
  • Allow motion actuation to be disabled or have interface component alternatives
  • Maintain minimum target size for clickable elements
  • Provide functionality that doesn’t require forced dragging actions

3. Understandable

3.1 Readable:

  • Programmatically specify the default language for each web page
  • Provide mechanisms to define unusual words or phrases
  • Offer means to understand abbreviations’ full meanings
  • Add supplemental content for advanced reading levels

3.2 Predictable:

  • Avoid automatic context changes from user interface adjustments
  • Keep navigation order consistent across all pages
  • Ensure identical functions have consistent identification on all pages
  • Initiate context changes only upon user request or provide a control mechanism

3.3 Input assistance:

  • Identify and describe input errors
  • Provide labels or instructions for input
  • Offer correction suggestions for errors
  • Ensure legal/financial data submissions are reversible, checked, or confirmed
  • Avoid redundant entry requirements

4. Robust

4.1 Compatible:

  • Enhance compatibility with various user agents and assistive technologies
  • Define UI components for programmatic access
  • Notify changes in UI components programmatically
  • Present status messages accessibly

Still not sure how to check your website for accessibility? Consult with our experts and pass a professional ADA audit

What’s next?

Accessibility is not a passing trend, it is here to stay forever as a requirement. Running a successful business and targeting a global audience today demands full accessibility — from physical facilities to websites and mobile apps.

PixelPlex has a qualified ADA website compliance team of experts comprising auditors, developers, and consultants who can perform an in-depth accessibility review to provide you with a full list of issues and potential vulnerabilities. We can also assist in all phases of an ADA compliance audit, remediation, and development.

Contact us and we will help you make your website fully ADA compliant.

author

Anastasiya Haritonova

Technical Writer

Get updates about blockchain, technologies and our company

We will process the personal data you provide in accordance with our Privacy policy. You can unsubscribe or change your preferences at any time by clicking the link in any email.

Follow us on social networks and don't miss the latest tech news

  • facebook
  • twitter
  • linkedin
  • instagram
Stay tuned and add value to your feed