How to Design an ADA Compliant Website

As technology evolves, so does the responsibility of web designers. Today, they have to consider each element on a web page to adapt to the needs of users with disabilities. 

The ADA, Americans with Disabilities Act, was created in 1990 and it prohibits discrimination against those with disabilities, ensuring they have the same rights and opportunities as those without. This act covers all sectors, from public transportation to government facilities. 

And, where’s the catch for law firms? 

Well, in 2010, the Department of Justice (DOJ) passed the ADA for Accessible Design. In short, it mandates all information technology like websites to be accessible to those with disabilities by law. 

So, why is an ADA-compliant website such a big deal?

  1. Your website should be designed to meet the needs of all different users in need of legal services. This includes users with, e.g., visual or hearing impairment. 
  2. Courts are starting to see more compliance-related lawsuits. This is partly because the web and mobile applications have become more necessary in our everyday lives. 

We want to point out that while the ADA does not offer a set of web compliance guidelines, many follow the Web Content Accessibility Guideline(s) – WCAG. 

Stay with us as we explain the importance of these guidelines and actionable steps you can take today to ensure your firm’s website is ADA compliant. 

 

Why should my firm care about the Web Content Accessibility Guideline?

Many people with disabilities use assistive technology that enables them to use computers. Some of these involve the use of separate computer programs that includes but isn’t limited to screen readers, text enlargement, voice control, etc. Fortunately, this is where WCAG comes in. 

The Web Content Accessibility Guidelines cooperate with individuals and organizations around the world. Their main goal is to explain how your firm’s web content can be more accessible to people with disabilities. The most recent guideline is the WCAG 2.1, and its purpose is to ensure your firm’s website is

  • *Perceivable: The content is presented in an easily perceivable way. 
  • *Operable: The navigation is easy to operate. 
  • *Understandable: The content is easily understood. 
  • *Robust: The content can be interpreted by different devices and platforms. 

*We’ll explain some of the best practices in the following chapter.

Overall, with the help of WCAG, firms allow all users to feel comfortable when navigating the site. Thus, end up using it for its intended purpose(s) like finding more information, learning about your practice areas, filling a form, booking a call, contacting a specialist, etc. 

 

The best way to have an ADA-compliant website

Now that we’ve clarified why a compliant website is a must, let’s look into what makes a compliant website. 

1. Evaluate your current site

According to Hackernoon, two programs rate your site’s usability. 

  1. Wave – This is an excellent place to start your site’s audit. However, you’ll run the possibility of bumping into a few false positives. 
  2. Lighthouse – Helps generate reports on potential issues.

2. Follow the ADA-compliant graphics

If you’re investing in quality captivating visual content, you’ll want everyone to enjoy it! Here are some best practices to ensure this: 

3. Add alt-text

The alt-text captions allow site readers to describe the image with audio. For example, people with a visual impairment might use a refreshable Braille display that translates text into Braille or use screen readers. 

  • There are no specific rules for this but try to describe the image as precisely as possible, keep it short, use a few keywords and avoid using “image of” or “picture of.” Here’s an example of an image with alt-text

Example of Image ALT text Example of Image ALT text

4. Add readable fonts. 

Ensure there’s a high contrast between the text’s color and background. Besides that, pick a font that’s easy to read because research has shown that users over 45 and people with visual impairment find the following letters and symbols confusing. 

  • i / j
  • B / 8
  • D / O, 0, o
  • r / v / Y
  • k / R
  • a / o
  • F / f
  • g / q

On this note, it’s also best to limit greens and reds to make it more readable for people with color blindness.

5. Allow multiple settings in multimedia like videos

For the most part, videos are captivating, but they present a problem for people with hearing and visual impairment.  

For this, videos have to incorporate more features such as: 

  • Adding audio descriptions.
  • Providing text captions that are synchronized with the videos/images. 
  • Including skip navigation allows people who use screen readers to ignore the links.

6. Make sure it includes logical features

Users want a unique but logical experience on your website. To make it this way, here are a few basic rules to follow:

  1. Put a clear “X” to any pop-ups.
  2. Keep essential pages like “Contact Us” with a predictable and straightforward copy.
  3. Use an icon like a magnifying glass and add “search hear” to make the search bar stand out. 

7. Keep up to date with the ADA and WCAG compliance

The ADA doesn’t explicitly address these best practices. However, firms keeping up with these best practices are one step ahead. 

 

The gist of it 

People with disabilities should always be accounted for in your website’s design. In addition to that, new changes in technology bring new solutions to the table. In this case, you’ve learned how certain contents and formats pose serious barriers for some people. 

But, you can ensure your awesome web content is accessible to all and converts calls and cases ( without the headaches of having to do it yourself!) How? Pair up with a team of legal marketing experts that’ll do all of this for you