How to Design an ADA-compliant Online Course: The Complete Guide for 2024

Web Accessibility Knowledgebase

To ensure that everyone can enjoy your online course, you need to make sure it is accessible, and in compliance with the Americans with Disabilities Act (ADA). Click here to learn everything you need to know about ADA-compliant online course design in 2024

accessiBe Team

The information presented within this guide is aimed at website owners seeking to learn the ropes of web accessibility. Technical elements are described in layman’s terms, and, as a rule, all topics pertaining to the legalities of web accessibility are presented in as simplified a manner as possible. This guide has no legal bearing, and cannot be relied on in the case of litigation.

The COVID-19 pandemic propelled online learning into hyper-gear, with the industry experiencing unprecedented growth in the last few years. Coursera alone recorded 20 million new students in 2021, highlighting the surge in demand for digital education. This trend is expected to continue, with the online learning market projected to grow by close to 70% by 2028.

Yet, there is one group that is often denied an equal opportunity to engage with online courses:

The disability community.  

With video being the main vehicle through which online course instructors relay critical information, people with vision and hearing impairments are often incapable of properly engaging with them when they lack proper captions and audio descriptions. And, far too often, online course websites as a whole aren't configured so that they are accessible to all visitors and learners.

Online course creators should do what they can to help end the discrimination people with disabilities face when engaging with online environments. Along with providing the disability community with the online learning opportunities it deserves, ensuring their online courses are fully accessible will also see course creators fulfilling their legal obligations under the Americans with Disabilities Act (ADA).

In this blog, we'll explain what the ADA is and why complying with it is essential for online course creators. Then, we'll provide practical tips on designing an ADA-compliant online course. We'll also include a checklist of key action items you should address to ensure your online course and online course website are ADA-compliant. 

ADA compliance for online course design: an overview

The Americans with Disabilities Act (ADA) prohibits discrimination against people with disabilities in various aspects of their daily lives.

ADA Title III mandates that businesses classified as "public accommodations" must be accessible to everyone, including members of the disability community. This applies to businesses' physical locations and online domains. Many U.S. courts today rule that websites must be accessible to all visitors, under the ADA. It's worth noting that most businesses provide services and accommodations for the public. Therefore, ADA compliance is crucial for nearly all organizations, including those offering online courses.

In other words, online course creators must make their content accessible to learners with disabilities.

What is WCAG and why do you need to conform to it to achieve ADA compliance?

If you’re an online course creator, you need to adhere to the Web Content Accessibility Guidelines (WCAG) ‌to ensure your online course website is ADA-compliant. Created by the World Wide Web Consortium (W3C), WCAG is widely regarded as the most influential accessibility standard in the world. 

WCAG is a lengthy, complex protocol. But it is based on four guiding principles:

  1. Perceivable
    Perceivable means people must be able to understand website content and engage with its user interface elements. In online courses, this involves offering text alternatives to meaningful non-text content, such as images and videos. Course creators must also ensure text can be resized without compromising functionality
  2. Operable
    An operable website is one that features content that people can easily use and navigate. For online courses, this entails ensuring that all interactive elements, such as quizzes and discussion boards, are keyboard accessible. Course creators must also provide multiple navigation methods
  3. Understandable
    An understandable website is one where the user interface and information are straightforward for everyone. For your online course, this could mean using clear, concise language and displaying content predictably
  4. Robust
    Robust refers to website content being compatible with assistive technologies. In online courses, this means using proper coding techniques and ensuring compatibility with screen readers (like JAWS) and other assistive tools

WCAG iterations and levels

Throughout the years, there have been a number of WCAG iterations:

WCAG 2.0 was released in 2008, while WCAG 2.1, an updated version of these guidelines and the most up-to-date, was released in 2018. The first draft of the next version of these guidelines, WCAG 2.2, was initially released in February 2020 and was officially published on October 5th, 2023.

All WCAG versions have three levels you can conform to:

  • Level A - the minimum level of conformance
  • Level AA - the conformance level referenced in most accessibility regulations around the world
  • Level AAA - the most difficult level of conformance to achieve

In ADA website compliance lawsuits, U.S. courts typically reference WCAG 2.0 Level AA as the standard for accessible online content.

It's worth mentioning that, while nothing is codified into law, conforming to WCAG 2.1 Level AA will likely see you avoiding legal recourse for lack of accessibility. 

To conform to WCAG 2.1 Level AA, you need to ensure your online course website meets a number of technical and design-based requirements. If certain elements of your website don't meet these requirements, you'll need to remediate them so that people with disabilities can access them. Examples of such requirements include, but certainly aren’t limited to:

  • Ensuring text has a contrast ratio of at least 4.5:1
  • Providing captions for all pre-recorded audio content in synchronized media (e.g., video lectures)
  • Giving your course registrants the option to pause, stop, or hide motion-based, flashing, or scrolling elements that persist for over five seconds

It’s important to note that many sections of WCAG should be met by online course creators who rely on bigger platforms, such as Udemy and Coursera

Designing an ADA-compliant online course: a comprehensive checklist

To achieve ADA compliance, online courses need to conform to WCAG 2.1 Level AA.

Here are some important steps you will need to take to reach that goal:

You can click on individual checklist items to skip straight to them. 

Important note: This is a partial list. To fully conform to WCAG 2.1 Level AA and to achieve ADA compliance, you will need to address a number of additional elements. You can click here for a more comprehensive ADA website compliance checklist.

Add captions to videos

Captions are textual representations of a video's audio that help students understand online course information. Some platforms, like YouTube, generate automated closed captions. However, unless they are confirmed to be fully accurate, automatic captions are not considered accessible under WCAG. 

Regardless of the platform you use, keep these best practices in mind for video captioning:

  • Ensure accuracy: Even small errors can lead those who rely on your captions to misinterpret the true meaning of your content
  • Make it comprehensive: Closed captions should include all spoken dialogue and non-speech information (e.g., meaningful sounds and sound effects)
  • Synchronize captions: Align captions with the audio so they appear on the screen simultaneously with the corresponding audio

Let’s dive into specific platforms and explore how to add captions to each of them.

Adding closed captions to courses hosted on YouTube

While often avoided for subscription-based online course presentations, some course creators use YouTube, typically configuring their videos as "unlisted". And, while YouTube provides automated captioning tools, they aren't always accurate. Therefore, you will need to review and correct the auto-generated captions for them to be considered WCAG-conformant.

Adding closed captions to videos on online course-building platforms

When using online course platforms like Thinkific, Kajabi, and Podia, enable the auto-show captions feature. If your student's browser settings have a preferred language that matches one of the available closed caption files, the platform will show it automatically. To add captions on these platforms, you'll need to create and upload an SRT file. This file format is widely used for video captions and subtitles. You can create SRT files yourself or hire someone experienced to do it for you. Once you have your SRT file, upload it to the platform, following its specific guidelines.

Here are a few additional resources that will help you add closed captions to specific online course website builders:

Adding closed captions to videos on online course platforms

Udemy and Coursera are both popular online learning platforms, used by millions of online educators and creators. When you host videos on these platforms, subtitles are auto-generated for them. Like with YouTube, you will need to review these captions and verify they are accurate. 

Provide audio descriptions for videos

Audio descriptions detail important information conveyed in a video, and are instrumental in ensuring people with vision impairments can fully understand the course material. Once you create your audio descriptions, you will need to add them to your video player. If you use Kajabi, Podia, or Thinkific, your online course videos will be hosted on Wistia, which allows you to add a file containing audio descriptions to your video. Once added, users can click on the Audio Descriptions button appearing on the video player and enable them.

Best practices for creating audio descriptions

You can create audio descriptions yourself, or outsource the task to service providers. Regardless, you will need to make sure that the audio descriptions account for the following elements appearing within a video:

  • Actions: These include significant instructor gestures, demonstrations, or movements that are relevant to the course content or learning objectives
  • Settings: These include descriptions of the environment or the background, such as a laboratory, classroom, or outdoor setting, if it provides pertinent context for the lesson
  • Scene changes: These include transitions between different topics, sections, or learning modules within the course, especially if the visual change signifies a shift in focus
  • Visual aids: These include graphs, charts, diagrams, or other visual representations of data or concepts that are critical to understanding the course material
  • On-screen text: These include important text displayed on the screen, such as keywords, definitions, or instructions that the instructor doesn't verbally communicate
  • Demonstrations: These include step-by-step procedures, experiments, or examples that rely on visual information to convey the process or outcome

Ensure videos and other elements can be operated via keyboard

Some people cannot navigate a website using a mouse and rely on their keyboard instead. These students need to be accounted for, and therefore your online course website and videos must be fully navigable via keyboard.

To that end, you should consider all of your videos’ interactive components and make them keyboard accessible. Students should be able to control volume, play, pause, and navigate all parts of the video using the Tab, Shift + Tab, Space, Enter, and the up, down, left, and right keys on a keyboard. Platforms like Kajabi, Podia, and Thinkific use Wistia as their video host. Wistia's video player is keyboard-operable by default

As for the other elements within your online course website, code-based tweaks may be required to ensure they allow for proper keyboard navigation. To that end, you may want to consider using ADA compliance tools like accessWidget. Leveraging automation and machine learning, accessWidgetaudits your website’s code and applies the necessary adjustments that will allow people to navigate it via keyboard.

Ensure meaningful images have descriptive alt text

Alt text, short for alternative text, is a short description of an image that helps people with vision impairments understand the image's content. It is added as an HTML element that screen reader tools read aloud to users, providing them with an explanation of a given image.

It is important to note that not every image in your online course requires alt text. Images that exist purely for decorative purposes should be hidden from assistive technology, like screen readers. One way of doing this is by leaving your alt text blank, so that it appears like this: alt=“”.

An example of proper alt text

Let's say your course includes an image of a diagram illustrating a scientific concept, such as the water cycle. The diagram is labeled "The Water Cycle" and visually represents the various stages of the cycle, including evaporation, condensation, precipitation, and collection.

If the alt text for this image were to be "The Water Cycle," students relying on screen readers wouldn't receive information about the specific stages depicted in the diagram. A more appropriate alt text would be "Diagram of the water cycle, illustrating evaporation, condensation, precipitation, and collection."

Ensure link text is descriptive

Link text (also known as anchor text) is the clickable text in a hyperlink. Course creators need to use descriptive text for all links, including video carousels and libraries. This provides screen reader users with vital information relating to the linked content and its purpose.

Ensure proper color contrast between text and its background 

Creating ADA-compliant online courses involves paying attention to the color contrast between text and its background within videos and web pages. Insufficient color contrast can prevent people with low vision from consuming content.

To achieve proper contrast, maintain a contrast ratio of at least 4.5:1 for text (including link text, and text inside buttons). A 3:1 ratio is sufficient for bold or large text (18pt or larger). 

Note: Color contrast restrictions don't apply to brand names and logos.

You can read this blog to learn how to select ADA-compliant colors.

Use proper headings

Headings organize content and provide a clear structure for online course materials. They help learners with low vision navigate and understand content with their screen readers.

To ensure accessibility, apply proper heading tags to your headings. Use <h1> for main headings, <h2> for subheadings, and so on, without skipping levels. This creates a clear hierarchy within the content. As a result, screen readers can identify the content structure and improve navigation for students with vision impairments.

It is important to note that simply increasing the text size or making text bold is not equal to applying actual heading tags. These visual changes don't provide the necessary information for screen readers to recognize headings and hierarchy.

Ensure PDFs and other online document materials are accessible

Many online courses include PDFs as complementary learning materials. However, more than 90% of PDFs are at least partially inaccessible. Under WCAG, PDFs and other online documents must be accessible to people with disabilities. 

The process of adjusting online documents so that they are accessible is called document remediation.

A big part of the remediation process revolves around adding tags to various elements within an online document. Tags are technical elements that add structural information to documents, helping define the content within them, such as headings, paragraphs, lists, and images. These are interpreted by screen reader tools, which can then properly present them to users.

Other characteristics of ADA-compliant online documents include:

  • Logical heading hierarchies
  • Alternative text for meaningful images
  • Proper color contrasts

You can click here to learn more about creating ADA-compliant PDFs.

As the process of remediating an online document can prove challenging and time-consuming, many online course creators rely on expert service providers, like accessServices, to perform this task for them. Turning to expert service providers is especially helpful when dealing with complex, lengthy documents that include diagrams, tables, and other technical elements common to online learning material. Armed with intimate knowledge of WCAG, expert service providers are better equipped to deal with comprehensive remediation projects in a timely and cost-effective manner.

Click here to learn more about accessServices and how it can help streamline your online document remediation process.

The importance of ensuring online courses are ADA-compliant

#:~:text=Up%20to%201%20in%204%20(27%20percent)%20adults%20in%20the%20United%20States%20have%20some%20type%20of%20disability.%20Graphic%20of%20the%20United%20States%20displaying%20figures%20of%20people%20with%20a%20disability%20and%20people%20with%20no%20disability.">Up to 27% of the adult American population has a disability. The number of American children and adolescents with disabilities is significant, as well. These groups deserve equal access to online learning in order to develop skills and pursue areas of interest. However, :~:text=Additionally%2C%20online%20learning%20is%20often%20not%20designed%20to%20be%20accessible">online courses are often designed in ways that deny access to members of the disability community. Heavily featuring dynamic content, most notably video, online course websites can present people with vision and hearing impairments with significant digital barriers.

When you ensure your online course is compliant with the ADA, you see to it that your videos, along with other dynamic content featured in them, are fully accessible to all your students. 

It is worth noting that the disability community’s spending power is immense. When your online course is designed so that its members can properly engage with it, you can‌ expand your potential student base. 

Finally, designing your online course with accessibility in mind can benefit students outside of the disability community, as well. Adding captions to your videos allows people to engage with them even when they are on mute, and can also significantly increase students’ ability to properly comprehend the information relayed in them.

The consequences of not complying with the ADA

When your online courses aren’t accessible, you discriminate against the disability community and present its members with digital barriers that others do not face. This can result in significant negative consequences, including facing legal recourse. The latter includes potentially receiving an ADA website compliance demand letter and facing an ADA website compliance lawsuit.

Failing to comply with the ADA can hurt your brand's reputation, as well. Active and potential students may view this as an act of disrespect toward the disability community, and choose to seek alternatives to your online courses.

How to test whether your online course website is ADA-compliant

To determine whether your current online course website is ADA-compliant, you'll need to test it. If you use Kajabi, Thinkific, or Podia, you can leverage automated tools, such as accessScan, and expert service providers, such as accessServices, to determine your online course website’s level of accessibility.

Free automated tools like accessScan quickly audit your online course website for ADA compliance. Simply submit your website's URL and let it check for WCAG 2.1 Level AA conformance. Within seconds, your web page will be given a score: compliant, semi-compliant, or non-compliant.

You'll also receive a comprehensive breakdown of your website's compliance status, along with instructions on remediating compliance issues found during the audit. You’ll be able to download this as a PDF. 

accessServices can be relied on to manually audit your online course website, as well. Online course creators who have complex websites with dozens or hundreds of pages often rely on accessServices to thoroughly inspect them and ensure they are ADA-compliant. 

It’s important to note that both approaches complement each other. Many online course website owners rely on automated tools for an initial audit of their website. Then, they turn to expert service providers to help examine and remediate compliance issues found during the ADA website compliance testing process.

Key takeaways

With an abundance of dynamic content, online course websites can present people with certain disabilities with unfair digital barriers. It is therefore on online course website owners and creators to present videos and websites that adhere to web accessibility standards. This will go a long way in ending the long-standing discrimination the disability community faces when engaging with online environments, and will see course creators fulfilling their legal obligations, under the ADA.