Imagine your website as a bridge, a vital connection between you and your audience. It should be a sturdy structure, welcoming everyone to explore what you have to offer.
By ensuring your website is accessible to all, you create a bridge that fosters inclusivity and a satisfactory user experience for everyone.
Table of Contents
What is ADA Compliance?
ADA compliance refers to the standards defined by the Americans with Disabilities Act (ADA).
ADA compliance ensures all individuals with disabilities have equal access to public facilities, services, and opportunities. This includes both physical accessibility in buildings and digital accessibility on websites and electronic documents.
With the rise of the internet, ADA compliance also extends to websites and digital content. Websites must be designed and developed to be accessible to people with disabilities, such as those using screen readers or other assistive technologies.
Guidelines for digital accessibility are based on the Web Content Accessibility Guidelines (WCAG).
Create an ADA-compliant website with Digital Spice.
Request a Free Proposal →
Levels of ADA Compliance
ADA compliance, especially regarding digital accessibility, often references levels of compliance as outlined in the WCAG.
WCAG provides three levels of compliance: A, AA, and AAA. These levels indicate the extent to which a website or digital content meets accessibility standards.
Here’s an overview of each level:
1. Level A (Minimum Accessibility)
Level A is the most basic level of web accessibility according to the Web Content Accessibility Guidelines (WCAG). It includes essential requirements that must be met to ensure that some users can access content.
Meeting Level A is necessary but may not be sufficient to make content accessible to all users.
Examples of requirements include:
- All images have ALT attribute
- Decorative images are displayed using CSS
- Embedded audio/video have descriptive TITLE attribute
- CAPTCHA doesn’t rely only on visual identification
- Audio-only content has a text transcript that provides its accurate and complete representation
- Video-only content has an equivalent text or audio alternative that provides its accurate and complete representation
- All prerecorded audio content in synchronized media is covered by captions
- Prerecorded video content in synchronized media is covered by an audio or a text description
- HTML markup is semantically correct
- On-screen help text and instructions identify elements by multiple characteristics (e.g. label, color, and position)
- Sound cues for an event are accompanied by a text message
- Links are not identified solely by color
- Validation errors are not identified solely by color
- Automatically playing audio can be paused or stopped
- All functionality is available from a keyboard
- There are no keyboard traps
- One-letter keyboard shortcuts can be deactivated or remapped
- Users are warned of time limits shorter than 20 hours (e.g. server session) and time limits can be extended
- It is possible to pause, stop or hide any moving, blinking or automatically updating content on the page
- Content is not flashing more than three times in any one-second period
- “Skip to main content” link is present at the top of each page
- Each page has a title element that clearly describes the purpose of the page
- It is possible to tab through the page content in a logical order
- Element focus is restored correctly when the user leaves a modal dialog box
- The purpose of each link can be determined from the link text, context, or its TITLE attribute
- All functionality that uses multipoint can be operated with a single pointer unless a multipoint gesture is essential
- Completion of the function is on the up-event or a mechanism is available to abort/undo the function after completion
- For UI components with a visible text label, the accessible name (e.g. aria-label) includes the visible text label
- Motion input is accompanied by standard UI input and can be disabled
- Every page has LANG attribute in the HTML tag that matches the human language of the text on the page
- When a UI component receives focus, this does not trigger a change of context
- Changing the setting of a UI component does not cause a change of context unless the user has been advised beforehand
- Input errors are clearly marked and described to the user
- Input fields are clearly labeled or have clear instructions
- Mandatory input fields are identified with a text label
- HTML code passes W3C HTML validation
- No two elements on the same page have the same ID attribute
- For all UI components, the name, value, and role can be programmatically determined
2. Level AA (Mid-Range Accessibility)
Level AA addresses the biggest and most common barriers for disabled users. It is the recommended conformance level for most websites and is often the target for legal compliance.
Examples of requirements include:
- Captions are provided for all live audio content in synchronized media
- Audio description is provided for all prerecorded video content in synchronized media
- The orientation of content is not restricted to only portrait or landscape
- Text input elements have proper AUTOCOMPLETE attribute
- Text has enough contrast with the background (contrast ratio 4:5:1 for small text and 3:1 for large text)
- Text can be resized up to 200% without loss of content or functionality
- Text is used to convey information rather than images of text (except logo)
- When content is zoomed in to a large degree only vertical scrolling is available at a screen width equivalent to 320 pixels
- When content is zoomed in to a large degree only horizontal scrolling is available at a screen height equivalent to 256 pixels
- Visual objects have a contrast ratio of 3:1 against adjacent color(s).
- Line height (line spacing) can be changed to at least 1.5 times the font size without loss of content or functionality
- Spacing following paragraphs can be changed to at least 2 times the font size without loss of content or functionality
- Letter spacing (tracking) can be changed to at least 0.12 times the font size without loss of content or functionality
- Word spacing can be changed to at least 0.16 times the font size without loss of content or functionality
- Content that appears on mouse hover or keyboard focus can be closed without moving the pointer or focus (Esc Key)
- Content that appears on mouse hover or keyboard focus doesn’t disappear when the pointer is moved over it
- Content that appears on mouse hover or keyboard focus remains until closed by the user, or if hover/focus is moved away
- Site map page exists
- All links within the site map lead to valid pages of the site
- Each page listed in the site map contains a link to this site map
- Each page in the site can be reached by following some set of links that start at the site map
- The headings and labels are clear and consistent, accurately describing the topic or purpose
- The page element with the current keyboard focus has a visible focus indicator
- Passages of text that are not in default language have their language specified with LANG attribute
- Navigation menus are in the same location and order on every page
- UI components used across the site are identified consistently on every page
- Suggestions for valid input are given when the user makes an input error
- Input associated with legal commitments or financial transactions can be reviewed and corrected before final
- submission
- Status messages can be programmatically determined through ROLE attribute
3. Level AAA (Highest Accessibility)
This level is the most complex and is typically not required for compliance but is ideal for providing the highest level of accessibility.
Achieving AAA is often challenging and might not be feasible for all content types.
Examples of requirements include:
- Sign language interpretation for all pre-recorded audio content
- Extended audio description for multimedia
- Color contrast ratio of at least 7:1 for normal text and 4.5:1 for large text
- Support for user-defined styling and formatting
- Building a Welcoming Space for All
In today’s digital world, everyone deserves equal access to information and opportunity. By embracing ADA compliance and website accessibility, you’re not just following regulations; you’re creating a welcoming online space that fosters inclusivity and empowers a wider audience.
Discover how website compliance can elevate your user experience and ensure legal peace of mind.
Ready to Create an ADA-Compliant Website?
Digital Spice is a creative digital agency specialized in planning, designing, and building fully optimized digital experiences.
Contact us to request a free consultation and proposal for your project at hello@thedigitalspice.com.
Let’s get digital!
