ADA Compliance Guide in 2021

Let’s start with the four best steps to preventing an Accessibility Compliance lawsuit in 2021.

1. Audit your existing website manually and remediate the website in accordance with WCAG 2.0 & 2.1 Level AA.
2. Run user tests with users that use accessibility aids.
3. Use automated tools to checker for errors and remediate your website.
4. Create a plan of action for your website’s accessibility compliance.

Hopefully, with the above techniques, you should have an empty mailbox from any lawyers.

The Real Danger of a Non-Compliant Website

Besides the obvious risk of a lengthy court battle and expensive legal settlements. There were over 2000 ADA compliance lawsuits filed in federal court back in 2018. Every year it has been doubling in number of cases.

The aftermath of a court battle can be the extensive legal fees, the damage to your brand, the damage to your reputation, and the reduced sales.

ADA Accessibility

How do I, as a business owner or developer, meet the WCAG and ADA standards?

Use a combination of automatic testing tools and manual testing. Keep in mind when testing to think about how it is perceivable, operable, understandable, and robust).

Let’s get started with the breakdown of each step you should take to reach compliance.

1. Website Layout

In this step, you need to think about the layout of your website and understand how a user navigates to get achieve their goal on the website. If your site is cluttered, think about a more minimal design layout that gives clear goals to what is present on the screen.

Have Accurate and Descriptive Text

Text on the page should be clear and decisive. This means you should check your page titles, headings, and link anchor text.

Color

Beyond separating sections of your website with color. You should provide an alternative with titles and captions.

Fillable Forms

Forms are the more difficult to develop and create an accessible version. To help with accessibility, add labels that define each field of the form.

Headings

Each page should have one <h1> tag followed by each descending headers such as, <h2> through <h6> as you need.

Labels

Remember that all images need descriptive alternative text. Screen readers use alt text to identify an element.

Text Size

Keep a text size that is easy to read. A text size of 16-18px is a good range. The larger the size the less strain on a users eyes.

Color Contrast Ratio

The guidelines require a color contrast ratio of at least 4.5:1 against the color of the background for compliance.

Zoomed in Text

The guidelines state that a website should be able to be zoomed in 200% and the text should be readable when enlarged.

2. Content Media Alternatives

Let’s go over some ways to handle alternative media to meet compliance standards.

Do not Use Images in Place of Text

You should never place an image of text when it can be easily be just text. Exceptions can be logos, branding media, infographics(there are some pitfalls with this too, so keep it within moderation), and charts using labels.

Alternative Text for Media

All images should a descriptive alt text attached. This would include a logo, an infographic, and charts.

Infographics and charts also need a caption explaining the image. This allows a screen reader to read the description to people.

Text Transcripts

If you own or host videos or audio, it it is required that there is a time based media transcription attached on the page for users to read and screen readers to read. This information is useful for deaf and blind users.

Documents

PDF’s, Word docs, Excel pages, and PowerPoints need to meet accessibility standards.

3. User Control

Now it’s time to think about giving your users the option to control certain elements on your website for their viewing experience.

Popup Forms

Try to not use automatic popups for subscription forms or special offers. Popups for instructions or a time sensitive warning are allowed.

Autoplay Media

Autoplay for video and audio should be off by default.

Adjustable Time Limits

Time limits that have a warning popup about time expiring should give the user the ability to reset the timer in order to stay on the page.

Submission Forms

Forms that ask for important information that applies to personal, financial, and medical scheduling should give the user the option to review the information before final submission.

4. Website Usability

To reach ADA Accessibility Compliance your website should be easy for a disabled person to navigate.

Default Language

You should set the default language for your demographic on your website.

Add Skip Navigation

The website should include an option to skip the headers and go straight to the main content of your website.

Search Option

You should keep a search box in the same place on every page.

Focus Indicator

Each field should have a focus indicator that shows fillable fields or links.

Keyboard Navigation Only

A website should be usable with the keyboard only. Make sure your website supports keyboard navigation.

Sitemap

Provide a page on your site that links the interconnected web pages in one source. It should be placed in the footer of your website on each page.

Make your Website ADA Compliant With Us!

Now that you understand the basics of having a compliant website and the difficulty of obtaining it. Let us do an audit for you.