ADA Compliance Guide in 2020
ADA Compliance Guide in 2020
Let’s start with the four best steps to preventing an Accessibility Compliance lawsuit in 2020.
- Audit your existing website manually and remediate the website in accordance with WCAG 2.0 & 2.1 Level AA.
- Run user tests with users that use accessibility aids.
- Use automated tools to checker for errors and remediate your website.
- 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.