July 04 2017

Best Practices for Website ADA Compliance in 2017

website ada complianceWhen you think of ADA compliance, things like wheelchair ramps and bathroom handrails might initially come to mind. However, when it comes to website accessibility, there is an increasing number of best practices, rules and regulations that every marketer, technology and communications professional needs to be aware of. Think this doesn’t apply to your site? Think again, because there were over 240 website ADA-related lawsuits in 2016 alone.

ADA compliance 101

The ‘ADA’ in ADA compliance refers to the Americans With Disabilities Act. Though there is nothing explicit in the ADA about websites since it was drafted before the Internet was the economic force it is now, the Department of Justice (DOJ) has been very active in this field. First, the DOJ joined lawsuits against some big names like H&R Block and Peapod, arguing they needed to provide accessible websites. As recently as January 2017, the DOJ filed a Statement of Interest in a Florida case that stated “Title III applies to discrimination in the goods and services ‘of’ a place of public accommodation, rather than being limited to those goods and services provided ‘at’ or ‘in’ a place of public accommodation.” In other words, DOJ is stating that your website is a place of business and it needs to work for persons with disabilities – just like your physical location does.
 
The goal of website ADA compliance is to write your website’s code in such a manner that a person with epilepsy can use the site without risk of seizure, or a vision-impaired person using a reader can order his groceries or access her bank account. It’s about fairness and bringing to the web the same inclusiveness found in the brick-and-mortar establishments that comply with the ADA. There have been rules and best practices for writing and displaying code on a website since the very first website, but compliance with these rules has been only been mandated by certain businesses or industries. The result is that most websites are non-compliant and behind the times. The good news? Coding an ADA-compliant site is very possible with little or no impact to usability or design, and often with minimal additional cost.

Section 508 compliance vs. WCAG

Let’s talk terms. You may have heard about section 508 compliance, but are unsure what it means. This doesn’t actually refer directly to the ADA, because it’s actually part of the Rehabilitation Act of 1973. The important thing to note about section 508 conformance is that it is not required for private entities unless they work directly with or take money from the federal government. Those that do meet the criteria must build their websites to meet the rules of 508 compliance. On January 18 of 2017, the U.S. Access Board realigned the old 508 rules to match to WCAG 2.0 level AA.

And that’s good, because the only thing you should be paying attention to is WCAG 2.0 – Web Content Accessibility Guidelines. This is the industry standard for non-governmentals. It’s also the standard the Department of Justice (DOJ) has used as a barometer in its court cases so far. The DOJ used WCAG 2.0 Level AA as the yardstick for ADA compliance in the cases they settled with Peapod.com and H&R Block.

Comparing WCAG levels

WCAG comes in three levels: A, AA and AAA. Like baseball, A is the weakest and AAA the strongest. AAA is very restrictive. This means that a AAA level site will work for just about everybody, but design, performance and look and feel will be severely impacted. The DOJ has admitted that 508 compliance comes with a significant cost and is not practical. There’s no reason to think they would require businesses outside to adhere to level AAA standards, especially since they just realigned all the title ii businesses to the less restrictive level AA. 

In contrast, level A conformity has a minimal impact but also minimal effect. It allows browser readers to more effectively navigate a site, but it doesn’t make a site compliant to the level the DOJ wants to see. The happy medium – and the one to keep on your radar is level AA. Level AA is not so light as to leave a large number of folks with disabilities behind, and not so restrictive as to greatly affect your site’s look, feel and functionality.

Understanding level AA WCAG compliance

The World Wide Web Consortium (W3C) administers the WCAG and serves as the arbiter of the internet. As such, they have made WCAG to be as easy and understandable as possible. It breaks it down into four different types for changes, known as POUR (Perceivable, Operable, Understandable and Robust).

  • Perceivable – Information and user interface components must be presentable to users in ways they can perceive (e.g. have Alt Tags say what the item actually does, like ‘Submit form button.’)

  • Operable – User interface components and navigation must be operable (e.g., you must be able to navigate the site using a keyboard as well as a mouse.)

  • Understandable – Information and the operation of user interface must be understandable, (e.g. error messaging on a form should make sense; instead of ‘Invalid field’ messaging, use ‘The Email field must be in a valid format.’)

  • Robust – Content must be robust enough so it can be interpreted reliably by a wide variety of user agents, including assistive technologies. In other words, don’t use tags or code that only certain browsers understand.

WCAG 2.0 checklist

For reference, we have provided a quick summary of key WCAG 2.0 requirements, but encourage you to dig more deeply into each of these topics (removing every filter but A and AA).

  • Text alternatives – provide alternatives for non-text content (e.g., images), so that it can be accessed by impaired individuals

  • Time-based media – provide an alternative (e.g., transcript) for time-based media (e.g., audio/video) that presents equivalent information, or link to textual information with comparable information for non-prerecorded media)

  • Adaptable – create content that can be presented in different ways without losing information or structure

  • Distinguishable – make it easy for users to see and hear content, including separating foreground and background, by using readable fonts, larger font sizes, and highlighted link styling for example

  • Keyboard accessible – make all functionality available from a keyboard without requiring specific timings

  • Timing – provide enough time for users to read and use content

  • Seizures – do not include design elements that are known to cause seizures (e.g., rapid flashing)

  • Navigable – provide multiple ways to allow users to navigate content including obvious/prominent links and other techniques

  • Readable  – make text content readable and understandable via styling and other techniques

  • Predictable – make web pages appear and operate in predictable ways

  • Input Assistance – assist users with web experience, correct mistakes and describe errors in text

  • Compatible – maximize compatibility with current and future user agents, including assistive technologies

Getting and staying compliant

The best first step in pursuing website compliance is to run a scan of your website. This scan will identify a range of compliance issues and together with an agency that specializes in website compliance, you can determine a plan of action. Once your site is compliant, you will need to remain compliant. This requires knowledge of website ADA compliance best practices, ongoing compliance scanning and an internal commitment from your team to monitor and fix all compliance issues. From design to development through QA testing to launch, all teams need to work together to meet compliance standards and offer the best user experience possible for impaired individuals.

  • Regs & Legislation
  • Website Compliance


ZAG Interactive is a full-service digital agency in Glastonbury, CT, offering website design, development, marketing and digital strategy to clients nationwide. See current job openings.
Related Article
Website ADA Conformance Infographic