Accessible Courses

EXPAND VIDEO TABLE OF CONTENT (11 min)
  1. Accessibility Checkers - Skip to 0:45
  2. Headings - Skip to 3:56
  3. Images - Skip to 4:26
  4. Links - Skip to 5:37
  5. Color - Skip to 6:19
  6. Lists - Skip to 6:45
  7. Video & Audio - Skip to 7:05
  8. Equation Editor - Skip to 7:39
  9. Documents - Skip to 8:13
  10. Word Document Remediation - Skip to 8:34
  11. PDF OCR Remediation - Skip to 9:45
ACCESSIBILITY REFERENCES

Accessibility Rule & WCAG Info

Accessibility checkers

Documents

Headings

Images

Links

Color

Lists

Tables

Equation Editor

Page & Module titles

Video

Alternative Formats

Accessibility Training

Accessibility Guideline Specifications

In 2024 the Department of Justice issued a rule that requires all web content and mobile apps from state and local governments to meet Web Content Accessibility Guidelines (WCAG) 2.1, Level AA standards.

For a simpler explanation of these requirements, visit Accessible.org's page on Understanding WCAG 2.1 AA for ADA Title II Compliance, and W3's "How to MEET WCAG" Tool.

Are there exceptions to the new rule? There are, but those exceptions require that the content is not needed to "apply for, gain access to, or participate in the public entity's services, programs, or activities."

Compliance Deadline: April 26, 2027 (see extension notice)

Below you'll find guidance on fixing the most common accessibility issues within your course websites and documents.

STEP 1) Prepare to Fix Accessibility Issues

Get a "CLEAN" Course Copy

Performing a "CLEAN" COURSE COPY will greatly benefit you when attempting to use the ALLY accessibility reporting tools. Submit a support request to clean out unused files.

  • EXPORT course package
  • DOWNLOAD course package
  • RESET course content
  • IMPORT course package (include only files "in use")

Clean HTML code

CANVAS Clear Formatting feature.

Accessibility Checkers

STEP 2) Create or Remediate Accessible Content

ALT Text for Images
Alternative Formats (ePub, Braille, Audio, Beeline, Immersive, Translation)

Ally's built-in Alternative Format feature allows you and your students to transform content into a variety of formats. Instructors may choose to disable Alternative Formats on a particular file if needed.

SOLUTION

Access ALLY Alterntive formats by clicking the Ally Icon found on most items within CANVAS. You will have options to convert content to a variety of formats including ePub, Braille, Audio, Beeline, Immersive, Translation into more than 70 languages. 

CANVAS Alternative format feature is accessed using the Alternative Format icon on most areas of CANVAS.

MORE: Ally Alternative Formats

Color & Contrast

How many red beads are in the second column?

Sample Calculator that is Black and White image.

Color can make content more engaging, but it shouldn’t be the only way you communicate information. People with color vision deficiencies—or anyone viewing your content in poor lighting—may miss key details if they’re only shown through color. Accessible color choices ensure your message gets through to everyone. 

SOLUTION

Ensure that the contrast between text and background is distinct. Use the Contrast Checker by WebAIM to confirm your contrast ratio's are at least 4.5:1. Ensure that your content does not require color vision.

Good Color Accessibility Means

  • Sufficient contrast between text and background. 
  • Don't rely on color alone to convey meaning (e.g., use icons, labels, strong, italics, etc.)
  • Test your colors using WebAIM's Contrast CheckerLinks to an external site..
  • The CANVAS Accessibility checker will help you automatically fix contrast issues.

CANVAS built-in Accessibility Checker feature which corrects contrast issues.

MORE: Contrast and Color

Equations and Logical Expressions

Math and scientific equations found in documents or images need to be converted to MATHML / LaTeX equations to be accessible by assistive technology.

SOLUTION

The CANVAS Equation Editor creates accessible equations visually or with LaTeX if needed. Another option is to subscribe to an application like MathPIX to quickly convert full documents into accessible material. If you must post an image of your equation, include a full text equivalent of the equation image.

Access the CANVAS Equation Editor using any CANVAS Rich Content Editor select the Insert menu, then Equation. From there you can either use the equation builder to create equations visually, or enter LaTeX directly.

To access CANVAS equation editor select Insert, Equation, then browse the tools to visually build your desired equation.

MORE: CANVAS Equation Editor in the Rich Content Editor

MORE: Accessible Math in PDFs

MORE: Accessible Math in Microsoft Documents

Headings (H1, H2, H3, etc.)

Logically ordered headings allow assistive technology to navigate your content (i.e., use H2 and H3 heading tags instead of "bold" or increased font size). This applies to all document types and web content.

SOLUTION

In the example below, content headings on the left were made with "BOLD" and increased "FONT SIZE.” The content looks like a normal outline for sighted users. However, the example on the right shows how this same content would be read by a screen reader which is unable to distinguish any heading elements because they haven’t been tagged correctly. Best practice is to select each section heading and apply a hierarchical "HEADING” tags (e.g., <h2>, <h3>, etc.) found at the top of most text editors.

Screenshot described in text above.

MORE: Heading by WebAIM

Links Descriptions

The purpose of each link must be determined from the link text alone (for example, replace "click here" with "Chapter 1 notes").

SOLUTION

Reference the lists below to see accessible and inaccessible links. The first row replaces “click here” with a descriptive alternative. The second row replaces a raw URL with a descriptive alternative. The third row replaces a broken link with a functional link.

TIP: Use the CANVAS Link Validator to locate broken links in your course!

Accessible Link Example

Inaccessible Link Examples
View course syllabus Click here  for the syllabus
Learn about Accessibility Checker https://community.canvaslms.
com/t5/Canvas-Basics-... etc.
Download Adobe Reader <fixed> Download Adobe Reader <broken>

MORE: Link Descriptions

Lists

Manually typed lists created with dashes and spaces won't be perceived by screen readers as an actual list but rather as a block of content. In that case, the user won't know how many items are in the list or be able to follow the sequence which causes confusion.

SOLUTION

In the example below, review how each of the lists are “ready by a screen reader.” In the inaccessible version, option "A" would be split by the words "underscore Parallel lines" making it very difficult to track what the list means. Instead, use the standard bullet and ordered list tools in each application to create ordered (numeric or alphanumeric) lists for sequential content, and unordered (bulleted) lists for content where the sequence doesn't matter.

Accessible List

Inaccessible Lists

MATCH THESE ITEMS:

  1. Acute Angle
  2. Parallel Lines
  3. Radius

TO THESE DEFINITIONS:

  1. Lines in the same plane that never intersect
  2. Angle less than 90 degrees
  3. A line segment from center of a circle

____ Acute Angle       A. Lines in same plane 

____ Parallel Lines     that never intersect

____ Radius              B. Less than 90 degrees

                                  C. Distance from circle 
                                   center to edge

 

Read by a screen reader: 
 

“MATCH THESE ITEMS:
List with 3 items
Acute Angle
Parallel Lines
Radius 
List end… etc.

Read by a screen reader: 
 

“underscore Acute Angle A period Lines in the same plane underscore Parallel Lines that never intersect underscore Radius B period Polygon with three sides… etc.”

MORE: List

Microsoft Word

Can your content be converted as HTML content?

SOLUTION

If so, do it. HTML is the preferred method of delivering content online and will be more accessible for everyone.

If not, here are the most common WORD Accessibility Fixes:

  1. Run Microsofts's Accessibility Checker
  2. Built-in Headings and Styles
  3. ALT Text for Images
  4. Reading Order
  5. Descriptive Links
  6. Color
  7. Tables

MORE: Microsoft's Accessible Word Document Help

Microsoft PowerPoint

Can your content be converted as HTML content?

SOLUTION

If so, do it. HTML is the preferred method of delivering content online and will be more accessible for everyone.

If not, here are the most common POWERPOINT Accessibility Fixes:

  1. Run Microsofts's Accessibility Checker
  2. Slide Titles are Unique
  3. ALT Text for Images
  4. Reading Order
  5. Descriptive Links
  6. Color
  7. Tables
  8. Font Size

MORE: Microsoft's Accessible PowerPoint Help

Module Layout in CANVAS

Page and module titles need to be unique, accurate, and clearly organized. This includes PowerPoint slide titles. Title elements are used as navigational aids for assistive technology. If you have many items all labeled “Practice,” as in the example below, some users navigating with assistive technology may not visually see the lesson context, and may misunderstand your content.

SOLUTION

Review the module list example below. The example on the right is inaccessible because it has multiple pages with the same title, and titles that are not descriptive. The example on the left is accessible because each page is uniquely and accurately titled.  

  • Use unique, simple naming conventions. Be consistent.
  • Simplify navigation where possible.
  • Use Text Header and indention to improve readability by creating a hierarchical structure.

Accessible Titles

Inaccessible Titles
See Solution description above. See Solution description above.

MORE: Mastering Modules: A Guide to Organizing Your Content in Canvas

PDF Document

Can your content be converted as HTML content?

SOLUTION

If so, do it. HTML is the preferred method of delivering content online and will be more accessible for everyone.

If not, here are the most common PDF Accessibility Fixes:

  1. Run Adobe's PDF Acessibility Checker
  2. OCR Scanned Text
  3. Add Tags
  4. Set Document Title
  5. Set Language
  6. Add Alt Text to Images
  7. Set Reading Order
  8. Identify Form Fields
  9. Color
  10. Tables
  11. DO NOT "Print to PDF"

MORE: Adobe PDF Accessibility Help

MORE: DEMO: Screen Reader reading an UNTAGGED PDF

Tables

Tables are powerful tools for presenting DATA. Headers, captions, and proper structure allow screen readers to connect each data cell to its meaning. Without this, a table can be a jumble of words and numbers. Historically, all designers used tables to control page layout even though they were never designed for this purpose. Layout tables don't have header context which is required for assistive technology. Tables also do not display well on mobile devices.

SOLUTION

Use tables for DATA, not for layout. The CANVAS Accessibility checker built into the rich text editor will help you add proper headers to your data tables.

Screenshot of CANVAS accessibility checker fixing table headers.

MORE: Tables

Video & Audio

Close Captions help users with Auditory Disabilities

Closed captions are required for all video. Visuals presented without words require a written description. Auto-captions MUST be reviewed by a human.

SOLUTION

Panopto video is integrated with CANVAS and automatically provides captions and provides an easy way to edit the captions to correct any errors.

  1. In your CANVAS course menu, click Panopto Video (go to Settings > Navigation tab to add Panopto if it's not in your CANVAS course menu)

  2. Click the 3 DOT menu on your video, then EDIT.
    CANVAS screen with Panopto Video end Edit option circled.

  3. Click on CAPTIONS in the Panopto Editor, make your changes and hit APPLY
    Panopto Caption editor with editing mode activated, and Apply button circled.

Audio Descriptions help users with Visual Disabilities:

  • All video that present information only visually must include audio descriptions.

MORE: Captions, Transcripts, and Audio Description

MORE: Panopto Video

Print Article