Insights

Web Content Accessibility Guidelines, ADA Compliance, and Success Criteria

Note: there are guidelines in place, but no set definition of what constitutes ADA compliance, making this a complex issue to navigate.

Since we exist in a digital-first world, it is increasingly important for businesses to ensure that their customers – all customers – have proper access to every aspect of their website. This means any customer with a disability should be able to access your website with no problems. Neglecting to do right by your customers will not only lead to a poor reputation but also puts your business in a vulnerable position.

In the last few years, more lawsuits are being filed against companies due to the fact that their websites fail to comply with the Americans With Disabilities Act.

Because of the increase in ADA Compliance importance, we want to provide an overview of Web Content Accessibility Guidelines, ADA, and things to look out for to help your business serve every potential customer avoid potential lawsuits.

Frequently Asked Questions

Frequently Asked Questions

Web Content Accessibility Guidelines (WCAG) were developed through the W3C process, which develops web standards such as HTML, CSS, etc. WCAG are recommendations for making the web more accessible to people with disabilities. The goal is to provide a single shared standard for web content accessibility that meets the needs of individuals, organizations, and governments internationally.

WCAG 2.0 and 2.1 cover a large range of recommendations for making web content more accessible. Following the WCAG guidelines will make content more widely available for people with disabilities such as blindness and vision impairment, deafness and hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, photosensitivity, and a combination of these.

The W3C advises the use of WCAG 2.0 due to the fact it’s the most recent release and will maximize future applicability of accessibility efforts.

WCAG 2.0 has different levels of conformance:

A – Basic
AA – Federal standard is based on AA (the minimum requirement for a site)
AAA – Applicable to a large financial or health organization

WHAT IS ADA COMPLIANCE?

The Americans With Disabilities Act (ADA) provides people with disabilities equal opportunities. The law prohibits the discrimination of people with disabilities and guarantees the same opportunities as everyone else.

In 2010, the US Department of Justice published the Standards of Accessible Design. The standards stated that all electronic information and online technology be accessible to people with disabilities, including computer hardware and software. Websites are now being considered “places of public accommodation” under the ADA Act. Someone can file a lawsuit against a company’s website that is seen as violating the ADA.

HOW DO SITES GET FLAGGED?

WCAG are to be used as technical guidelines and are not intended to be the law. There are no formal federal guidelines set in place, but it’s 2020, and it’s now expected that your website is accessible for all.

Plaintiffs are frequently suing businesses stating that websites or mobile apps are not accessible to someone with a disability. These cases are being built on the basis of Title III of the ADA which states that “places of public accommodation” need to be accessible, which now lumps websites into this category. A large number of ADA Website Compliance demand letters/lawsuits are rooted in missing or insufficient alt text and once a lawyer has you in this position, they are able to strengthen their case by dinging you with as many accessibility issues as they can find.

ARE THERE REGULATIONS FOR WEBSITE ACCESSIBILITY?

As of now, there are no federal, state, or city regulations specifying to what extent websites must be accessible, or any legal standard to be applied in determining if a website is accessible. The U.S. Department of Justice has actually delayed the publication of these regulations.

According to the Section508.gov Blog:

“Until the DOJ adopts specific technical requirements for web accessibility in a final rule, if you’re subject to the ADA, you have more flexibility in determining how to make your website compliant with the ADA’s general requirements of nondiscrimination and effective communication. Remember, you still must comply with applicable regulations (Title II for state and local governments, or Title III for public accommodations and commercial facilities).”

Many Courts and the DOJ have viewed the privately developed WCAG 2.0, Level AA, as the de facto for ADA compliance. So for now, businesses should make, or redesign their websites in compliance with this standard to be on the safe side.

WHAT IS THE STATUS OF WEBSITE ACCESSIBILITY LAWSUITS?

There are an increasing number of ADA website compliance lawsuits being filed., 2018 was a record-breaking year, and 2019 surpassed it, leading us to believe that 2020 will be another big year for ADA website compliance lawsuits.

Website accessibility lawsuits are challenging to defend and expensive to resolve. Most cases settle, but if a court finds that a website is inaccessible, it can order the business to make its website accessible and to pay the plaintiff’s attorneys’ fees, costs, and expenses. The court can also order the business to pay the plaintiff monetary damages and/or civil penalties under state and/or local law.

One of the more well known ADA lawsuits involved Winn-Dixie in 2017.The resulting trial ending with Winn – Dixie having to set aside $250,000 to update their website to the WCAG 2.0 standards. At the time, this was the first lawsuit of its kind, leading to a marked increase in these types of lawsuits.

Gorilla posted a related article about Domino’s, and how they became the poster child for the importance of inclusivity for customers with disabilities. Domino’s appealed the case to the U.S. Supreme Court, which declined to hear the case, stating that the ADA protects access not just to physical restaurants or stores, but also to businesses’ websites and apps.

WHAT SHOULD I FOCUS ON FIRST?

  • ALT TEXT: This is usually a gateway compliance issue because it’s easy for the plaintiff’s lawyers to spot and leads them to try and find as many other violations as possible.
  • VIDEO: Adding closed captioning on videos.
  • KEYBOARD: Making sure your website is fully usable by keyboard only
    e.g. you can unplug the mouse and still fully navigate the website
  • LABELS: Coding in labels for form fields
    e.g. program your forms so that the field labels such as “first name” are read by screen readers
  • ANCHOR LINKS: Using descriptive anchor text for links
    e.g. write links so that someone can tell what the linked page is about — not “click here” or “learn more” but “donate to the XYZ dog rescue” or “specs on the new iPhone 11 Pro Max”
  • HEADINGS: Structuring your headings (e.g. h1, h2) so that they are correctly nested

EXAMPLES OF WEB ACCESSIBILITY:

ALTERNATIVE TEXT:

Images should include equivalent alternative text (alt text) in the markup/code. If alt text isn’t provided for images, the image information is inaccessible.
e.g. Someone who cannot see and uses a screen reader that reads aloud the information on a page, including the alt text for the visual image.

When equivalent alt text is provided, the information is available to people who are blind, as well as to people who turn off images (e.g. areas with expensive or low bandwidth). It’s also available to technologies that cannot see images, such as search engines.

KEYBOARD INPUT:

Some people cannot use a mouse, including many older users with limited fine motor control. An accessible website does not rely on the mouse; it makes all functionality available from a keyboard. Someone with a disability can use assistive technologies that mimic the keyboard, such as speech input.

TRANSCRIPTS FOR AUDIO:


Just as images aren’t available to people who can’t see, audio files aren’t available to people who can’t hear. Providing a text transcript makes the audio information accessible to people who are hearing impaired, as well as to search engines and other technologies that can’t hear.

It’s easy and relatively inexpensive for websites to provide transcripts. There are also transcription services that create text transcripts in HTML format.

KEY DESIGN COMPONENTS

Best Practices

  • Use the Contrast Checker to validate the minimum contrast ratio between text and background.
  • Body text should be a minimum of 16 pixels.
  • Spacing between lines should be at least 25% of the font size. With the 16-pixel minimum size above, spacing should be 4 pixels or more.
  • There must be a visual indicator outside of color shift to communicate function or changes in context. This is to account for visually-impaired users.
      1. Clickable text (such as breadcrumbs, text links, or tertiary CTAs) need to be styled beyond color.
      2. Input fields need a visual shift to indicate changes in context.
        e.g. using a red stroke for an error state also requires a change in stroke weight or the introduction of an error icon to account for users who may not be able to see red clearly.

      KEY USER EXPERIENCE (UX) COMPONENTS

      Best Practices

      • Use descriptive text for functionality. Text descriptions are useful to users allowing them to better distinguish the links and evaluate whether to follow it. The description should tell the user where it leads or what it does. A good practice should be to include only the necessary and never too much.
        1. ‘Save Address vs ‘Save’
        2. ‘Next Step’ vs ‘Next’
        3. ‘Cancel Order’ vs ‘Cancel’
      • UI elements should clearly communicate expected functionality.
        e.g. pair a down arrow with navigation that triggers a dropdown menu.
      • Form fields and inputs require labels or instructions. Labels should not disappear from form fields upon text being entered.
      • Contextual changes must require user action.
        e.g. a CTA must trigger the contextual change of moving from step 1 to step 2 within checkout; a navigation item must be clicked prior to loading a different page
      • Key information or functionality must be easily accessible. It is best practice to avoid using tooltips, hover states, or accordions for information that is critical to the experience. This is primarily to account for users with cognitive or motor-related disabilities.
      • Confirm requests prior to triggering a drastic action, such as clearing a cart or deleting an address. This is often achieved with a confirmation modal.

      HELPFUL LINKS

      Tips for Getting Started – tips introduce some basic considerations for making your website more accessible to people with disabilities, and provide links to additional guidance

      Examples of Web Accessibility – short introduction to 3 web accessibility issues: (1) alternative text for images, (2) keyboard input, and (3) transcripts

      Accessibility Principles – web accessibility principles and guidelines

      How to Meet WCAG – success criteria and techniques to stay compliant (primary resource for developers)

      1. Principle 1: Perceivable – Text Alternatives, Time-Based Media, Adaptable, Distinguishable
      2. Principle 2: Operable – Keyboard Accessible, Enough Time, Physical Reactions, Navigable, Input Modalities
      3. Principle 3: Understandable – Readable, Predictable, Input Assistance
      4. Principle 4: Robust – Compatible

      Standards & Guidelines – guidelines and other standards related to web accessibility

      Techniques – document provides guidance for web content authors and evaluators on meeting Web Content Accessibility Guidelines (WCAG) 2.1 success criteria (informative)