Five Most Common ADA Compliance Issues on Your Website and How You Can Fix Them

ADA compliance -- it’s a phrase that typically brings up images of wheelchair ramps and braille signs. While ADA compliant buildings are critical in the physical realm, ADA compliance also applies to the Internet realm. The fact that most website admins don’t consider ADA when designing web pages or outlining content can leave millions of Americans with disabilities (and more users around the world) frustrated if they try to access your website.

1. Alt tags

   Problem: Not everyone uses them. This problem might be one of the most frustrating simply because it’s one of the easiest issues to fix. Alt tags provide alternate text for a photo. If a screen reader doesn’t find an alt tag, then a user misses out on graphic elements.

   Solution: Whenever you upload an image or other visual element, take two seconds out of your day to include an alt tag. It's a simple solution to one of the most common problems.

2. Headings

   Problem: Headings can easily get out of order, and it's one of the most deceptively simple ways that people can hinder ADA compliance. Often, it's tempting to think that they can fix which headings they want bigger or smaller by using header tags. This is an issue for website contributors who see H1, H2, H3s, etc as visual elements rather than definitive sequential order. They often focus on the style of the headers rather than their functionality. So, if the H2 looks better than the H1, content contributors often switch out the two without thinking of the consequences. However, that leaves the content itself horribly out of whack and screen readers can’t accurately read what’s on the page.

   Solution: Understand that your headings have to be functional before they have to be stylized. If you need headers to look a certain way, make the appropriate adjustments to the CSS and not to the actual header order.

3. ARIA landmarks

   Problem: This is a simple tool that people forget about but it can help screen readers (and thus users) out so much. ARIA readers are pretty common tools that can prioritize screen reading by using landmarks.

   Solution: Use landmarks to identify the header, footer, sidebar, and page content. This allows screen readers to prioritize what they read to their users.

4. Navigation

   Problem: Navigation can often be tricky for screen readers, and it's one way that websites with a lot of pages can easily neglect ADA compliance. 'Orphaned pages,' out-of-order page orders, or lack of breadcrumbs make getting around your website all the harder for a user with disabilities.

   Solution: Provide multiple navigation outlets. Make sure you provide navigation in your header that’s accurate and allows people to drill down to the content. Use breadcrumbs to assist in navigation, and be sure that all pages have a proper home.

5. Plug-ins

   Problem: A bunch of plug-ins can not only slow down your website’s speed. They’re also rarely ADA compliant. To make matters worse, you don’t control the source code! If the plug-ins are not fully compliant, then you’ll have more issues to fix and the less likely you’ll be able to fix those issues.

   Solution: This solution is relatively simple, but few website admins like the answer. Limit how many plug-ins you use. Wordpress users: beware. Plug ins are easy to use and simple to install without a lot of planning and foresight. Even plug-ins like Google translate aren’t always compliant! Be very, very careful when it comes to knowing what’s on your page.

Best way to fix your website for ADA compliance

Simply put, be proactive when it comes to your website's ADA compliance. Run diagnostics on plug-ins and take note of areas where navigation isn't clear. Look for resources that could serve as checklists on your journey to an ADA compliant website. If you really feel in over your head, find a web expert or a WCMS that is built with ADA compliance in mind.