ADA Website Compliance Checklist for Associations

Web accessibility is good business. 26% of Americans live with a disability. If your website, applications, online events, and digital products aren't accessible and usable for everyone, you risk alienating nearly one in 4 users right off the bat.

That's a significant chunk of potential members, constituents, donors, orders, registrations, and returning business.

Correcting usability barriers doesn't just open your website to the world. It also protects your organization from costly litigation and compliance violations.

61 million adults in the U.S have some type of disability or impairment that makes accessing information online much more difficult. This includes folks with visual impairments, cognitive disabilities, motor limitations, and other functional disabilities.

Brightfind created this 2022 Americans Disabilities Act (ADA) website compliance checklist to help you provide a successful digital experience to every visitor to your site. Here you'll find tips and tricks to make your website more accessible for current members, future newcomers, and guest visitors.

New Web Accessibility Updates

On March 18, 2022, the Department of Justice released new website accessibility guidelines for the ADA. The updated guidance underscores the importance of removing unnecessary barriers to an accessible digital experience. These priority areas are highlighted:

• Poor color contrast.
• Reliance on color to provide information.
• Lack of text alternatives, or alt-text, on images.
• No captions on videos.
• Inaccessible online forms.
• Mouse-only navigation rather than keyboard navigation.

Visual Content

Just as physical barriers like steps can block the entrance to a building, inaccessible visual denies equal access to information online. Designing with accessibility in mind ensures these people can equally perceive, understand, navigate, and interact with your digital content and tools.

Sliders, navigation bars, and contact forms without clear, semantic HTML elements are all common website design elements that can keep people with disabilities from accessing online resources, products, devices, services, or environments.

Make sure you simplify all visual elements on your website, so your content is easy to read. Flashing lights and other images often trigger photosensitive epilepsy and other physical reactions. Without proper trigger warnings in place, you can potentially harm your audience and make your organization vulnerable to lawsuits and legal ramifications under the ADA.

If you have any massive images or videos that flash more than 3 times per second, provide a clear warning before your audience comes into contact with that imagery.

This Contrast Checker is an awesome design tool for accessibility compliance. It allows you to test and choose a color contrast.

Plus, visual content wizard tells you whether or not the text size, graphical objects, and user interface components on your web pages pass or fail accessibility compliance under the Web Content Accessibility Guidelines (WCAG) - aka “accessibility bible.”

Alternative Text

Alternative (Alt) text is a simple way to make sure your site remains ADA-compliant. Adding alt text to non-text page elements, such as images, allows audio page readers to easily identify these elements. It is also important for SEO purposes as it gives you another area to optimize your pages with keywords.

Incorporates alt text on all of the images, including long-tail keywords and other identifying features where necessary.

Turning Off Audio

When using embedded video players, enable the option to turn the audio off from the player so your customers don’t have to mute their machines. This is important for two reasons: page readers use their own audio to communicate with visually impaired users and other customers may need the audio off in order to concentrate on your text.

If a video interferes with someone’s ability to understand the text on the page, that is enough means to launch an official ADA complaint. In your video player settings, confirm you are able to click on an audio toggle button before you publish videos on your website.

Page Identification Text

Include text headings and descriptions across your content to communicate the topic to audio page readers. This makes topics easily identifiable for the visually impaired searching for specific content on your website.

Headers also help describe content for search engines and increase readability for your readers. Include headers whenever there is a major topic change in your content and one H1 header on every page on your site

Instructions and Labels on Forms

To be truly accessible, every form on your website should have descriptive labels. Make required fields stand out to the viewers so they are aware what is expected from them.

If they make an error, provide clear instructions to resolve the issue without causing undue stress. Consider including an example of a completed form for easy reference.

Keyboard Navigation

Optimize your site so viewers without a mouse can navigate using the directional arrows, tab, shift, and enter keys on their keyboards. Make sure that you have clear destination points each time a person hits an arrow or tab key for better flow and readability.

Make your website navigation predictable for easy operation among your disabled visitors. Having navigation that is easy to understand with predictable menu locations will make it easier for viewers to navigate, whereas too many forms and variations in formatting could make navigation disorienting. Keep your menus simplified with a maximum of 5-7 items with similar page layouts to make your site feel like it has a natural and predictable flow.