SaaS Website Accessibility Checklist

What is website accessibility?

Web accessibility is all about ensuring that everyone can access, consume, and engage with your SaaS website’s content. An accessible website is one that accommodates all users on all devices, no matter the physical or mental ability of the user.

Accessibility is a vital part of modern user experience design, for both your SaaS website and product. The latest iteration of Web Content Accessibility Guidelines (WCAG) 2.1 by the World Wide Web Consortium (W3C) covers a huge range of recommendations for making web content more accessible.

Why make your SaaS website accessible?

You want your SaaS solution to reach the maximum number of users. But guess what? A good chunk of your target audience is likely living with a disability, such as color blindness, reading difficulties, impaired hearing, etc.

• According to WHO, people with some type of disability make up 15% of the world’s population.
• One in four adults — or 61 million people — in the United States have a disability.

Making your SaaS website more accessible is not only the right thing to do but failing to do so means you’re turning away prospects before you’ve even had a chance to introduce your product.

Besides, not making your SaaS accessible can attract costly lawsuits.

• 2018 saw a 181% increase in Federal ADA lawsuits over 2017.
• The number of lawsuits alleging that websites, apps, and videos were inaccessible to people with disabilities rose 64% in the first half of 2021 compared to 2020.

4 core principles of accessible web design

The Web Content Accessibility Guidelines are organized around four principles:

• Perceivable: Visitors with visual, hearing, or sensory disabilities can consume content (through a screen reader, captions, transcripts, or other assistive technology).
• Operable: Visitors can operate the website with the controls they prefer, such as by keyboard shortcuts for someone unable to use a mouse.
• Understandable: The website interface is comprehensible to users with cognitive disabilities such as epilepsy or autism.
• Robust: The website is cross-browser, cross-platform, and compatible with current assistive technology.

WCAG levels of accessibility

There are three levels of accessibility compliance (A, AA, and AAA), with level A being the minimum necessities fulfilled (not fully accessible) and AAA being the most optimized level of accessibility.

• Level A: The lowest level of accessibility satisfying the minimum set of requirements. Many groups of users with disabilities will find it difficult or impossible to access content on such websites.
• Level AA: A higher level of accessibility. Some groups of users will find it difficult to access information on such websites. Reaching this level will remove major barriers to accessing web content for users with disabilities.
• Level AAA: The highest level of accessibility. Satisfying these criteria will ensure an optimal user experience for individuals with disabilities.

A 15-point SaaS website accessibility checklist

This checklist isn’t comprehensive, but covers the priority elements you must consider to make your SaaS website more accessible and compliant:

• Establish a clear HTML header structure with correct usage of H1, H2, etc.
• Make hyperlinks on the page user-friendly:
  • Underline the in-line linked text and have a different color than the rest of the content.
  • Write a descriptive anchor text such as “Download our free accessibility guide” instead of “Click here”.
• Add a descriptive alt text for all images so that the content is usable by people who use assistive technology such as screen readers.
• To make tables more accessible:
  • Add HTML markup that indicates header and data cells and define their relationship. Mark up header cells with <th> and data cells with <td>.
  • For complex tables, add explicit associations using the scope, id, and headers attributes.
  • Add captions that help identify a table’s overall topic, along with a summary to provide orientation or navigation hints in complex tables.
• Ensure you have subtitles, embedded captions, or at least text transcripts available for video and audio content.
• Use colors carefully:
  • Have adequate color contrast between various elements (such as text and buttons) and the background.
  • Ensure colors alone are not being used to communicate information to users.
  • Use patterns or textures to indicate visual differences in charts, graphs, etc.
• Choose accessible typefaces such that characters are readily distinguishable from one another and the font has sufficient spacing between letters.
• Provide the ability to easily resize text while the page still functions as expected in all browsers.
• Make your SaaS website keyboard-friendly:
  • Ensure all parts of your website are accessible without a mouse, using keyboard keys only. All actions that can be done with a mouse must also be doable with a keyboard.
  • Keep your website navigation intuitive and concise, including only necessary categories in the menu.
  • Show a visible focus indicator that pinpoints the active element the user has currently selected.
• Make your forms accessible:
  • Define clear boundaries and borders.
  • Label your form elements to explain what data needs to be inputted.
  • Mark required form fields as required.
  • Give helpful error messages.
• For pages that have a time limit, allow users to adjust the limit or turn it off.
• Ensure text content is grammatically correct and written in plain language to aid readability and understanding. Define abbreviations or unusual words in a glossary.
• Don’t have any elements on the page that flash more than three times per second.
• Use semantic HTML elements to effectively describe the purpose of page elements.
• Publish an accessibility statement that states your company’s target level of accessibility and its efforts to achieve ADA compliance.

Handpicked free accessibility evaluation tools

Here are a few of the many free tools you can use to evaluate your website’s accessibility:

• WAVE: A suite of evaluation tools that helps authors make their web content more accessible to individuals with disabilities.
• WebAccessibility.com: Get an overall W3C compliance score out of 100, so you can see how WCAG compliant your SaaS website is.
• SortSite: Check your website against WCAG accessibility standards, and compliance with Section 508 of the Rehabilitation Act. It checks accessibility, broken links, browser code compatibility, search engine optimization, and other usability issues.
• aCe by accessiBe: A fully automated accessibility tool that provides an immediate and accurate answer to whether your website is ADA  & WCAG  compliant.

Found this checklist useful? Here’s a handy infographic version you can share with your colleagues and network.

Author

Arkin Khemchandani

Arkin is a content marketer at Growfusely - a SaaS content marketing agency specializing in content and data-driven SEO. Besides work, he's an ardent recreational runner who loves beaches and trance music. Connect with him on Twitter: @arkin008