ADA Compliance for Websites and Applications

The Americans with Disabilities Act (ADA) requires certain businesses to make accommodations for people with disabilities. These requirements are now applied to websites due to their interpretation as “places of public accommodation.” In order for your business to avoid a fine, it is important that you understand what updates need to be made and how to take action. This article provides an explanation of ADA compliance, as well as a checklist of updates you should be making.

‍

What is ADA Compliance?

‍

Unfortunately, an ADA Website Compliance checklist doesn’t exist. The term ‘compliant’ is still up for interpretation, and differs for each website based on the types of content and functionality found within the site; however, most US courts and the Department of Justice routinely refer to the Website Content Accessibility Guidelines 2.0 (WCAG), set by the World Wide Web Consortium (W3C), as the measuring stick for determining website compliance. There are three different levels of WCAG conformance – A, AA, and AAA.

‍

A: Represents the most basic web accessibility features.
AA: Covers the most common barriers experienced by users with disabilities.
AAA: The most robust level of web accessibility.

‍

WCAG 2.0 was released 10 years ago and contains guidelines for web accessibility broken out into four pillars – perceivable, operable, understandable and robust. Back in June of 2018, WCAG released the updated 2.1 guidelines. These do not replace the guidelines detailed in version 2.0, but adds to them. For the most part, version 2.1 dictates guidelines for mobile accessibility. In total, version 2.0 and 2.1 account for 78 guidelines on website accessibility – 30 for level A, 20 for level AA, 28 for level AAA.

‍

What This Means For You

‍

Following the WCAG guidelines ensures that your website is not solely dependent on audio or video elements as the only methods to distribute content, emphasizing the need for text alternatives. They also place a considerable focus on eliminating the use of different text colors as the only means for distinguishing important information. These website changes will make it easier for individuals with hearing and vision disabilities to digitally interact with your company and software.

‍

Despite there being three levels, ADA requires that organizations comply with level AA WCAG guidelines. You might be wondering why level A exists if level AA is the requirement. The first reason is that, outside the US, level A compliance is satisfactory for most countries and websites. For companies located in the US, level AA guidelines need to be your eventual goal. For certain small businesses, achieving level AA requirements might not be immediately possible, either because of money, time or availability. If that is the case, then level A standards should be your company’s first priority. For larger, more mature businesses, you really need to make sure that you’re meeting level AA requirements in order to avoid a fine. Making these changes benefit the company just as much as the customer – after all, you wouldn’t want someone to avoid doing business with your company just because they can’t interact with you online.

‍

To help clarify what’s required for each level, we’ve outlined the guidelines for each classification below, along with a brief description.

‍

The Guidelines

‍

Level A

‍

1.1.1 – Non-text Content Provide text alternatives for non-text content
1.2.1 – Audio-only and Video-only (Pre-recorded) – Provide an alternative to video-only and audio-only content
1.2.2 – Captions (Pre-recorded) – Provide captions for videos with audio
1.2.3 – Audio description or Media Alternative (Pre-recorded) – Video with an audio has a second alternative
1.3.1 – Info and Relationships – Logical structures
1.3.2 – Meaningful Sequence – Present content in a meaningful order
1.3.3 – Sensory Characteristics – Use more than one sense for instructions
1.4.1 – Use of Color – Don’t rely on color as the sole distinguisher of important content
1.4.2 – Audio Control – Don’t play audio automatically
2.1.1 – Keyboard – Accessible by keyboard only
2.1.2 – No Keyboard Trap – Don’t trap keyboard users
2.1.4 – Character Key Shortcuts – Do not use single key shortcuts or provide a way to turn them off or change them
2.2.1 – Timing Adjustable – Time limits have user controls
2.2.2 – Pause, Stop, Hide – Provide user controls for moving content
2.3.1 – Three Flashes or Below – No content flashes more than three times per second
2.4.1 – Bypass Blocks – Provide a “Skip to Content” link
2.4.2 – Page Titled – Helpful and clear page title
2.4.3 – Focus Order – Logical Order
2.4.4 – Link Purpose (In Context) – Every link’s purpose is clear from its context
2.5.1 – Pointer Gestures – Users can perform touch functions with assistive technology or one finger
2.5.2 – Pointer Cancellation – This requirement applies to web content that interprets pointer actions
2.5.3 – Label in Name – The name contains the text that is presented visually
2.5.4 – Motion Actuation – Functions that are trigged by moving a device or by gesturing towards a device can also be operated by more conventional user interface components
3.1.1 – Language of Page – Page has a language assigned
3.2.1 – On Focus – Elements do not change when they receive focus
3.2.2 – On Input – Elements do not change when they receive input
3.3.1 – Error Identification – Clearly identify input errors
3.3.2 – Labels or Instructions – Label elements and give instructions
4.1.1 – Parsing – No major code errors
4.1.2 – Name, Role, Value – Build all elements for accessibility

Level AA

‍

1.2.4 – Captions (Live) – Live videos have captions
1.2.5 – Audio Description (Pre-recorded) – Users have access to audio description for video content
1.3.4 – Orientation – Content is not dependent on screen orientation
1.3.5 – Identify Input Purpose – Common names are provided to the user through the HTML autocomplete list
1.4.3 – Contrast (Minimum) – Contrast ratio between text and background is 4.5:1
1.4.4 – Resize Text – Text can be resized to 200% without impacting site functionality
1.4.5 – Images of Text – Don’t use images of text on your site (they may be blurry)
1.4.10 – Reflow – Your website must be responsive for different devices
1.4.11 – Non-Text Contrast – High contrast between text and backgrounds
1.4.12 – Text Spacing – Text spacing can be increased
1.4.13 – Content on Hover Focus – Ensuring pop up windows or hidden content are not only accessible through hover or keyboard focus
2.4.5 – Multiple Ways – There should be multiple paths to each page
2.4.6 – Headings and Labels – Use headings and labels on all pages
2.4.7 – Focus Visible – Keyboard focus is clear
3.1.2 – Language of Parts – Identify languages being used on each page
3.2.3 – Consistent Navigation – Standardize navigation buttons and organization
3.2.4 – Consistent Identification – Standardize the use of icons and buttons
3.3.3 – Error Suggestion – Suggest fixes when users make errors
3.3.4 – Error Prevention (Legal, Financial, Data) – Implement methods to reduce the risk of human error when entering sensitive data
4.1.3 – Status Changes – Text size and line spacing must be able to be increased to a certain value

Level AAA

‍

1.2.6 – Sign Language (Pre-recorded) – Provide sign language translations for videos
1.2.7 – Extend Audio Description (Pre-recorded) – Provide extended audio description for videos
1.2.8 – Media Alternative (Pre-recorded) – Provide a text alternative to videos
1.2.9 – Audio only (Live) – Provide alternatives for live audio
1.3.6 – Identify Purpose – This is an anticipatory guideline for the future use of cognitive metadata to produce assistive interfaces
1.4.6 – Contrast (Enhanced) – Contrast ratio between text and background is at least 7:1
1.4.7 – Low or No Background Audio – Audio is of high quality and easy to consume
1.4.8 – Visual Presentation – Offer users a range of presentation options (text, audio, video)
1.4.9 – Images of Text (No Exception) – Don’t use images of text
2.1.3 – Keyboard (No Exception) – Accessible by keyboard only, without exception
2.2.3 – No Timing – No time limits
2.2.4 – Interruptions – Don’t interrupt users
2.2.5 – Re-authenticating – Save user data when re-authenticating
2.2.6 – Timeouts – Users need to be warned of the duration of any inactivity that could cause data loss
2.3.2 – Three Flashes – No content flashes more than three times per second
2.3.3 – Animation from Interaction – Motion animation triggered by interaction can be disabled
2.4.8 – Location – Let users know where they are
2.4.9 – Link Purpose (Link Only) – Every link’s purpose is clear from its text
2.4.10 – Section Headings – Break up content with headings
2.5.5 – Target Size – The size of the target for pointer inputs is at least 44 x 44 CSS pixels
2.5.6 – Concurrent Input Mechanisms – Web content does not restrict use of input modalities available on a platform
3.1.3 – Unusual Words – Explain any strange words
3.1.4 – Abbreviations – Explain any abbreviations
3.1.5 – Reading Level – Users with nine years of school can read your content
3.1.6 – Pronunciation – Explain any words that are hard to pronounce
3.2.5 – Change on Request – Don’t change elements until users ask
3.3.5 – Help – Provide detailed help and instructions
3.3.6 – Error Prevention (All) – Reduce the risk of all input errors