Skip to main content
# Website Accessibility

[Updated] The Complete ADA Compliance Checklist for 2023

Is your website accessible?

Authored by Civic Plus Logo

CivicPlus

August 30, 2019
10 min

The Americans with Disabilities Act and the Rehabilitation Act of 1973 require that state and local governments provide qualified individuals with disabilities equal access to their programs, services, or activities unless doing so would fundamentally alter the nature of their programs, services, or activities, or would impose an undue burden.

What does ADA website compliance mean?

ADA compliance means that local governments are required, and expected, to ensure all their digital content is accessible by citizens with visual, auditory, and other physical limitations and disabilities. As an organization that serves citizens, it’s essential to offer an accessible website and one that provides equitable access to news, information, and local resources.

In this article, we’re going to show you how to be ADA-compliant and provide accessible experiences to your visitors. There are two terms used interchangeably when discussing this topic: ADA website compliance and website accessibility.

For websites to be ADA-compliant, they need to be accessible.

Quick Guide: ADA Compliance Checklist for Your Website

 

ADA Compliance Checklist for Websites

The first step to ensuring compliance is to evaluate your website using the Web Content Accessibility Guidelines (WCAG).

The criteria are categorized according to three levels, providing successively greater degrees of accessibility:

1. Level A (minimum) – The most basic web accessibility features. Sets a minimum level of accessibility but does not generally achieve broad accessibility for many situations.

2. Level AA (mid-range) – Deals with the biggest and most common barriers for disabled users.

3. Level AAA (highest) – The highest level of web accessibility. It is often not possible to satisfy all Level AAA success criteria for some content types.

Websites must be optimized to work in conjunction with assistive technology. Poorly designed websites can create barriers for disabled individuals, limiting or completely inhibiting their ability to obtain all available information from your local government website.

In addition, local governments must understand that a website serves as the gateway to their communities. Understand that accessibility prudence:

  • Impacts 19% of your citizens
  • Increases site traffic
  • Improves search engine optimization (SEO)
  • Is a legal best practice

Top 9 Tips for Achieving ADA Compliance and Creating Healthy Designed Websites

 

1. Headings and Titles

 

If headings aren’t used properly (or at all), many users will not be able to find what they are looking for. Therefore, you should never use headings decoratively and should always place them in a logical descending manner on the page (H1, H2, H3, etc.).

When used properly, headings:

  • Ensure all content uses relevant headers. If headings aren’t used properly (or at all), many users will not be able to find what they are looking for
  • Title all pages so that they relate to the page’s content
  • Use citizen-facing wording rather than internal terminology

 

2. Text and Font

 

Color alone should not be used to differentiate information, as this will be non-perceivable for those with low vision or blindness. Instead use:

  • Bold and italic text
  • Use bulleted lists
  • Feature areas or modules in your CMS
  • Have a high-contrast color scheme

Also, try to avoid dense paragraphs of text, as this will make your content easier to read for many audiences.

 

3. Populate Tables

 

Since tables are for data and not page layouts, be sure to populate tables with appropriate column, header, and cell information.

 

4. Identify Visuals with Alternative Text

 

Visuals are a hugely important aspect of most websites, but if used incorrectly, they can create serious barriers for those with blindness or low vision, for example. To avoid potential issues and ensure accessibility for all your website visitors, remember:

  • Always include alternative (alt) text
  • Pay attention to the descriptive details such as the non-image visual
  • All visuals need alt text, not just photos, so be sure to add alt text with icons, buttons, banners, logos, sketches, etc.
  • Any visual element that conveys a message should have alt text

If there is no text to identify the image, a blind person’s screen reader could not identify the image. The user would not have any way of knowing if the image is a logo, link to another page or simply a stock photo.

Provide text alternatives for any non-text content so that it can be changed into other forms that people need. Examples of other forms include large print, braille, speech, symbols, or simpler language.

 

5. Use Color Contrast

 

People with low vision often have difficulty reading text that does not contrast with its background. Providing a minimum luminance contrast ratio between the text and its background can make the text more readable for users who cannot see the full range of colors and help those rare users who see no color.

Remember:

  • Use contrasting colors to differentiate text from the background for colorblind users.
  • Color cannot be the only means to convey information.
  • Color contrast ratio: All text must have a color contrast ratio of 4.5:1 against its background.

You can use Monsido’s Color Contrast Checker to ensure that your fonts and backgrounds use sufficiently contrasting colors. This will help to ensure that your web content can be read by all visitors, including those with disabilities.

 

6. Websites Need to be Navigable

 

Web accessibility issues for people with visual impairments often occur when they encounter a website that is not coded to be both keyboard-navigable and to support assistive technology.

Remember:

  • Websites should be navigable by both keyboard and keyboard equivalents
  • Keep information in a consistent location
  • Understand that if a user cannot find it he or she will assume it doesn’t exist
  • Consistency helps users find information faster
  • Screen readers move from top to bottom

 

7. Don’t Use PDFs

 

Image-based formats are challenging for users with visual impairments as they cannot be read by screen readers or text enlargement programs. For this reason, they should be avoided where possible.

 

8. Enhance Your Multimedia

 

Make images and video more accessible by adding audio descriptions to images, including the narration of changes in setting, gesturing, and other details. In addition, add text captions for the deaf.

 

9. Include “Skip Navigation” at the Top of Your Pages

 

Ensure that people using screen readers can get directly to the content.

Let’s break it down further into Level A and Level AA compliance to determine if your website currently meets the accessibility requirements.

Level A – ADA Compliance Checklist

  • Images have alternative text that can be read by screen reader software
  • Video content includes captions
  • Video or audio-only content is accompanied by a text transcript or description
  • Links that are provided to media players are required to view content
  • Headings are presented in a logical order
  • Make sure “b” and “i” tags are replaced with “strong” and “em” tags
  • There are no empty links or heading tags
  • The presentation does not rely solely on color
  • Automatically played audio does not occur and can be stopped
  • The keyboard can be used to navigate the site
  • A keyboard can be used to navigate the site
  • Keyboard focus is never stuck on one particular page elements
  • Time limits provide notifications to the user
  • Automatically scrolling or blinking content can be stopped
  • No strobe effects or rapidly flashing colors occur on the site
  • Skip navigation functionality allows keyboard users to access content quickly
  • Page titles clearly and succinctly describe the page content
  • Buttons and links are clearly and logically named
  • The language of each page is identified in its code
  • Elements receiving focus do not change the content in a substantial way
  • Invalid form input is identified to the user
  • Forms have labels and legends that can be read by screen reader software
  • There are no major validation errors

 

Level AA – ADA Compliance Checklist

  • Live video or audio content includes captions
  • The contrast ratio between text and page backgrounds is at least 4.5-to-1
  • Text on pages can be resized to 200% while still maintaining the form
  • Images are not used where text can achieve the same purpose
  • Pages on the site can be accessed in multiple ways
  • Keyboard focus is visible and clear
  • The language of content is identified in code with any language changes
  • Menus and buttons are used consistently regardless of the user’s location on the website
  • Users are given suggestions on how to solve input errors
  • An error prevention technique is used whenever the user enters sensitive data
  • Underlined text that does not provide a link is removed
  • Redundant links on the same page are eliminated or minimized

In Summary

Updating your website to become ADA-compliant is a process that takes time and effort in equal measure. At the end of the day, however, the Americans with Disabilities Act is a strict law that should not be taken lightly, so action needs to be taken sooner rather than later.

CivicPlus will assess your current website and assist with a redesign to ensure all citizens share equitable access to content and that you and your staff have the training and knowledge needed to maintain a compliant website moving forward.

Written by

Authored by Civic Plus Logo

CivicPlus