Americans with Disabilities Act – WCAG Checklist

September 19, 2018 Peter A. Liefer II

ADA Checklist

ADA COMPLIANCE TEST

Millions of people in the United States have disabilities that impede their use of the Web. Many make use of assistive technology enabling them to navigate websites or access information on those websites.

For example:

  • Those who don’t have use of their hands may use speech recognition software to navigate a website.
  • The blind may rely on a screen reader to convert the visual information on a website into speech.
  • The deaf are unable to access information in Web videos and other multimedia presentations that do not have captions.
  • Individuals with low vision may be unable to read websites that do not allow the font size or the color contrast of the site´s page to be modified.
  • Individuals with limited manual dexterity cannot access sites that do not support keyboard alternatives for mouse commands.
  • Individuals with intellectual and vision disabilities, often have difficulty using parts of websites that require timed responses from users but do not give users the ability to indicate that they need more time to respond.

Many websites fail to incorporate or activate features that enable users with disabilities to access all the site´s information or elements. This is a bad practice for several reasons.

  • One is Title III of the Americans with Disabilities Act (ADA) has a general non-discrimination mandate that web accessibility is a general requirement for all businesses.
  • Secondly, it leaves you open to lawsuits by the disabled or the DOJ.
  • It also means you are missing out on a large portion of potential customers who can’t access your site.

For more information regarding ADA and the law read ADA Compliant Websites and The Law.

The recommended guidelines for accessibility are documented in The World Wide Web Consortium’s (W3C) Web Content Accessibility Guidelines (WCAG 2.0 AA). It outlines accessibility for a wide range of disabilities, including visual, auditory, physical, speech, cognitive, language, learning, and neurological disabilities.

Recently, the WCAG 2.1 was released which adds 17 more requirements to address new technologies and other digital barriers for individuals with disabilities. The updates are mainly related to mobile devices.

Following is a checklist of things that your website should do to make it more accessible to the disabled.

Perceivable – Web content is made available to the senses – sight, hearing, and/or touch.

˜      Text Alternatives: Provide text alternatives for any non-text content

˜      Time-based Media: Provide alternatives for time-based media

˜      Adaptable: Create content that can be presented in different ways (for example simpler layout) without losing information or structure.

˜      Distinguishable: Make it easier for users to see and hear content including separating foreground from background

Operable – Interface forms, controls, and navigation are operable

˜      Keyboard Accessible: Make all functionality available from a keyboard

˜      Enough Time: Provide users enough time to read and use content

˜      Seizures and Physical Reactions: Do not design content in a way that is known to cause seizures or physical reactions.

˜      Navigable: Provide ways to help users navigate, find content, and determine where they are.

˜      Input Modalities: Make it easier for users to operate functionality through various inputs beyond the keyboard.

Understandable – Information and the operation of user interface must be understandable.

˜      Readable: Make text content readable and understandable

˜      Predictable: Make Web pages appear and operate in predictable ways

˜      Input Assistance: Help users avoid and correct mistakes

Robust – Content must be robust enough that it can be interpreted by a wide variety of user agents, including assistive technologies.

˜      Compatible: Maximize compatibility with current and future user agents, including assistive technologies

WCAG 2.1

˜      Orientation: Don’t force users of mobile devices to hold their devices in or rotate them to a certain orientation in order to take part in a website’s content.

˜      Identify input purpose: Determine the meaning of each input field with code so user’s browser can autofill input fields based on data previously entered by the user.

˜      Identify purpose: Use HTML to identify the purpose of interface components, icons, and sections. This will improve accessibility for users of assistive technologies.

˜      Reflow: Users must be able to browse a website using a 320-pixel wide screen without having to scroll horizontally. In other words, the website must be responsive.

˜      Non-text contrast: Make high contrast between pieces of text and their backgrounds, text on buttons and colors used in non-text content like infographics and diagrams.

˜      Text spacing: Ensure distances between paragraphs, rows, words, and characters can be increased to certain values without leading to loss of functionality or loss of content.

˜      Content on hover or focus: If users trigger content in the form of a modal window, tooltip or a similar component, they must have ways to dismiss the content on their own terms.

˜      Character key shortcuts: The shortcuts can be turned off or changed to require pressing keys like Ctrl, Alt, and Cmd. It is only active when that element focuses.

˜      Timeouts: Inform users if any period of inactivity could lead to loss of data.

˜      Animation from interactions: Make it so animations triggered by interaction can be turned off unless the animations are essential for the functionality or the content presented.

˜      Pointer gestures: Make actions performed using gestures like pinch zooming & swiping able to be done using simpler gestures like single taps, double taps, and long presses.

ADA Accessibility Resources

Here is a link to a developer needs to implement these standards required for accessibility. Visit https://www.w3.org/WAI/standards-guidelines/wcag/. If you have no one to do these developer tasks, please contact us as soon as possible and let’s get your website compliant.

To evaluate your website for accessibility, use this free tool. http://wave.webaim.org/

Here is a site dedicated to empowering organizations to make their web content accessible to people with disabilities. https://webaim.org/

ADA Archive – https://www.ada.gov/anprm2010/web%20anprm_2010.htm

ADA Lawsuit article: https://www.adatitleiii.com/2018/07/website-access-and-other-ada-title-iii-lawsuits-hit-record-numbers/

Contact PrimeView for Help with ADA Compliance

ADA Compliance Solutions

Following the ADA and WCAG guidelines can get quite tedious if you don’t have any experience or have a knowledgeable webmaster. PrimeView is serious about accessibility issues for many reasons but essentially, it’s just “the right thing to do.”

People with disabilities have the right to have equal access to what others need and enjoy, and websites are one of those, especially in the modern world.

If you follow all the guidelines in the WCAG, you will mitigate the risk of lawsuits, grow your client base and improve your reputation. Miss some and you may open yourself to lawsuits.

We offer this information to help our clients or anyone with a website who wants to get their assets up to date with the Americans with Disabilities Act.

For further reading:

ADA Compliance and Your Website

Make Your Website ADA Compliant Checklist

Read more articles like this:


Peter A. Liefer II

Peter is the CEO of PrimeView, the leading Arizona Web Design and Digital Marketing Firm. A veteran in the Web Development and eCommerce industry, he is focused on delivering data-driven results. Learn more about Peter and PrimeView on our Profile. You may also reach us here.