Don’t let these lawyers with friendly smiles fool you, they’ll sink your battleship with one tiny letter.

Before I start, let’s clear up two terms that are closely intertwined but distinct: ADA website compliance vs. website accessibility.

The law that primarily governs accessibility is The Americans with Disabilities Act (ADA). Even though it doesn’t mention websites anywhere, Title III of the ADA has been interpreted by U.S. courts to apply to websites.

For a website to be ADA compliant, they need to be accessible.

Website accessibility can mean two things depending on the context: 1) the process of making your website so that its content and functions are accessible to those with disabilities, or 2) how accessible your website is.

Think of it this way:

Currently, the ADA is the law of the land. Are you in compliance with the law?
And accessibility is the technical or developmental side, how well can persons with disabilities access your website?

The next question is: how do we make our websites accessible?

So, how can your website meet the ADA requirements and have the website accessible to the public, including persons with disabilities? Can the website be enjoyed by even the persons of disabilities “fully and equally”? Can they access content, navigate your website successfully, engage with different elements, etc.

U.S. courts and the Department of Justice (DOJ) have continually referenced the Web Content Accessibility Guidelines (WCAG) 2.0 Level AA success criteria as the standard to gauge whether websites are accessible. The WCAG 2.0 AA success criteria are comprised of 38 requirements (including level A), individually referred to as success criterion.

W3C Web Content Accessibility Guidelines

In an August 2016 case involving the University of California Berkeley, the DOJ ruled that the public university was in violation of ADA Title II (similar to Title III but it instead applies to government organizations) because their YouTube channel’s videos didn’t include captions for hearing impaired visitors. The DOJ found this to violate the ADA as deaf users did not have equal access to the online content.

So where did the DOJ point UC Berkeley for guidance?

The World Wide Web Consortium’s (W3C) Web Content Accessibility Guidelines (WCAG 2.0 AA).

The Department of Justice ruled that UC Berkeley should use the WCAG as their guidelines for accessibility, leading many to believe that the upcoming 2018 ruling may use the same set of standards as the benchmark.

What Is WCAG?

The WCAG is a set of accessibility standards created by the World Wide Web Consortium in partnership with various other groups to help guide web content producers in making their work more accessible to all, including users with disabilities.

WCAG 2.0 is the technical standard featuring 12 guidelines under four categories:

• Perceivable.
• Operable.
• Understandable.
• Robust.

Each of the 12 guidelines contains testable “success criteria” which can be used to measure the usability of your website.

The official WCAG documentation contains an exhaustive list of the guidelines that can be found here, but I’ve broken out the main points below as a quick reference to highlight each section and its main topics.

WCAG Quick Overview

1. Perceivable Category

This section helps content producers ensure their media is usable by all. The category gives recommendations on how to present content in alternative forms (like adding captions to videos) without losing the meaning or coherence of said content (if a user increases the font size on the page, does the page structure stay intact?).

This section also gives recommendations on using contrast in images and text to ensure content is readable.

Additionally, every images should contain a caption and alt text – unless those images are purely for decoration or spacing (in which case they should be implemented so that they can be ignored by assistive technology).

As the WCAG 2.0 perceivable guidelines state:

• Guideline 1.1 Text Alternatives:
  Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille,
  speech, symbols or simpler language.
• Guideline 1.2 Time-based Media: Provide alternatives for time-based media.
• Guideline 1.3 Adaptable: Create content that can be presented in different ways (for example simpler layout) without losing information or structure.
• Guideline 1.4 Distinguishable: Make it easier for users to see and hear content including separating foreground from background.

2. Operable Category

This category gives guidelines to ensure the functionality of your website does not create problems for users.

This category includes things like:

• Having a website that can be navigated with a keyboard.
• Making sure moving sections can be paused if a user needs more time.
• Ensuring pages and sections are clearly labeled so users can decipher where on the website they are.

As the WCAG 2.0 operable guidelines state:

• Guideline 2.1 Keyboard Accessible: Make all functionality available from a keyboard.
• Guideline 2.2 Enough Time: Provide users enough time to read and use content.
• Guideline 2.3 Seizures: Don’t design content in a way that is known to cause seizures.
• Guideline 2.4 Navigable: Provide ways to help users navigate, find content, and determine where they are.

3. Understandable Category

This category is designed to ensure that web pages feature logical functionality and language. This section of guidelines mandates that:

• The language of the page should be programmatically identifiable.
• Navigation is consistent across the website.
• Areas of the website that require user input (like contact forms) have ample instructions included.

As the WCAG 2.0 understandable guidelines state:

• Guideline 3.1 Readable: Make text content readable and understandable.
• Guideline 3.2 Predictable: Make Web pages appear and operate in predictable ways.
• Guideline 3.3 Input Assistance: Help users avoid and correct mistakes.

4. Robust Category

This is the smallest section of the guideline, but also the most technical.

This section gives guidelines to ensure that a website’s code is “robust” enough to help assistive readers understand the code.The basic idea is that your code needs to follow current web standards.

Use standard HTML tags that are universally recognized by browsers. Also, your code should properly validate (all tags that open should be closed) to ensure assistive technologies can properly understand and render the content.

As the WCAG 2.0 robust guidelines state:

• Guideline 4.1 Compatible: Maximize compatibility with current and future user agents, including assistive technologies