Tips for Creating an Accessible Course in Canvas

The home page is the first place instructors and students land after clicking on a course from the Canvas dashboard. A useful home page is simple in design and layout and can include:

• a banner image relating to the course
• a welcome message
• links to each module in your course

 
Example Canvas home page layout.

Less is more when thinking about the left-hand navigation menu for your course. Which menu items are you using for your course? Display to students only those menu items they will be using to decrease the amount of searching they will need to do.

Hide menu items from the student view by clicking on Settings in your course and then click on the Navigation tab.

---

Resources

• Managing items on the course navigation menu, Canvas Instructor Community
• Bring Clarity to your Canvas Course, Part 1: Course Navigation, Hildy Pardo

Having an easy-to-follow module layout creates one of the most accessible ways for students to work through your course. Think of modules as an outline that includes the week, or project being the main topic followed by sub-topics that include readings, quizzes, discussions, assignments that fall under each main topic. Arrange the items or subtopics in the order you would like students to navigate your course by.

Module tips and benefits for accessibility and UDL

• Icons next to each type of module ietm visually identifies what it is (e.g. assignment, file, discussion, page)
• Due Dates will display for students for certain items
• Use descriptive names and/or actions for top modules and the items underneath
  Examples 
  • Rather than “Week 7“ try, “Week 7: Nordic mythology”
  • Rather than “project_muse_554111.pdf” try “Gods and Settlers: The Iconography of Norse Mythology in Anglo-Scandinavian Sculpture by Lilla Kopár"

---

Resources

• Bring Clarity to your Canvas Course Part 2: Modules, Hildy Pardo
• Mad about Modules, Emily Craddock
• Modules Overview for Instructors, Instructure Community

As you add an image to a page in Canvas, you are asked to enter "alt" or descriptive text.

What is alt-text? Alt text is a short and concise description of the context and content of the image. This description is necessary for anyone unable to view the image and can be read by software that reads text in Canvas out loud.

When writing alt-text, ask yourself three questions

1. What is the meaning or reason this image is being used in this context?​
2. What is not important or relevant in this image?​
3. Is the information already on this page someplace else? 

Tips for writing alt-text

• Avoid using ”image of” or “picture of” ​
• No need to duplicate text that can be already found on the screen
• Keep text short and concise and specific (125 characters).
• If there are any words in the image that are someplace else add the text to the alt-text

Image alt-text field in Canvas when inserting an image.

---

Resources

• Alt-text decision tree, WAI​
• Guidelines for Describing STEM Images, NCAM​
• Cooper Hewitt Guidelines for Image Description, Cooper Hewitt Museum​
• Image Description, Diagram Center

In Canvas, instructors have the option to change text color and add a highlight or background color. There are a couple of key things to keep in mind in when using color in your course that will benefit everyone.

Color Contrast

Color contrast is important. Light text on a light background or dark text on a dark background can be hard to see for everyone! Use the Canvas accessibility checker or a color contrast tool if you are unsure.

Examples of poor contrast:

• Yellow
• Light Green
• Orange 
• Pink 
• Red 

Examples of good contrast:

• Dark Orange
• Dark Blue
• Dark Gray
• Black

* A low-tech check for color contrast is to squint or blur your eyes and look at the page you are working on. Can you easily read the text in color?

Color to convey information

Avoid using color as the only way to identify or convey information.
Example "Required readings are listed in red" or "do just the items highlighted in green"

Consistency

Be consistent with colors you do decide to use throughout the course.

---

Resources

• Contrast and Color Combinations, Carnegie Museums
• Color Contrast Checker, WebAIM

Structure paragraphs using descriptive headings to break up long areas of text and assist readers in scanning information quickly and easily. Use the built in header options on the Canvas toolbar rather than manually making the text bigger and bolder. Screen reading software recognizes headings and they can be used to navigate through a document.

Structure things in a hierarchical order starting with H2 as the main section headings followed by H3 for subtopics. The title on your page is already an H1. This might feel similar to an outline done for a research paper.

Link text should give students an idea or context of where they will go when they click on a link.  Some text to speech tools allow users to navigate through the links included on a page.

Link text to avoid

• Here, Click Here, Read More, Learn More. These provide no context.
• The full url of the link (https://publicera.kb.se/csa/article/view/106/82) instead use The Warrior and the Cat: A Re-Evaluation of the Roles of Domestic Cats in Viking Age Scandinavia
• Download the file here. Instead use Download the PowerPoint slides from today's lecture.

Use bulleted lists on a Canvas page to break up a lot of text and help students quickly find information the need.  When creating ordered or numbered lists use the built-in tools provided in the Canvas text toolbar. They are formatted correctly to be identified as lists when using a screen reader.

Example of bulleted lists to structure information in the Canvas content editor.

When using tables in your Canvas course, use them for simple data with clear heading and column rows and not as a way to layout text as a grid on the page.

After creating a table on your page using the Canvas table tool in the RCE, use the accessibility checker to walk through the steps to make sure your table is accessible.

Canvas accessibility checker fixes for a more accessible table.

When using videos or audio files (e.g. podcasts) make sure they have captiions or a transcript that goes with them. Captions are important for people who are deaf, who are in a noisy environment, and those who use the captions in addition to the audio to better comprehend the video content.

Video from Panopto in the Canvas content editor displaying captions.

---

Resources

• How to add Panopto videos to Canvas
• How to Add ASR (Automatic Speech Recognition) Captions into a Video, Panopto
• Guidelines and Best Practices for Captioning Educational Video, DCMP Captioning Key
• Request help with editing or adding captions

PDFs

Verify any PDFs you are using for your course are not "scanned as images." This means you can select text or search in the document. This can be one of the biggest accessibility barriers for students in that this file cannot be read by a text to speech program and can prevent students from interacting with the document. 

• Did you find a pdf that is scanned as an image? Find out what to do next to locate an alternative version.
• Download Acrobat DC and use the Accessibility Wizard

Other document formats

Check any Word documents or PowerPoint files using their built-in accessibility checkers to identify things that can be updated to be more accessible.

---

Resources

• Creating Accessible Documents, National Center on Accessible Materials
• PDFs that are barriers for accessibility, Bowdoin
• SensusAccess alternative format document creator
• Make pdfs accessible with Acrobat DC's Accessibility Wizard, Adobe 

 

The Rich Content Editor (RCE) in Canvas includes an accessibility checking tool that looks for approximately twelve common accessibility issues. The accessibility checker scans as you are adding content to a page (you will see a number over the tool icon if it detects anything) or you can click on the tool itself.

Accessibility checker tool reporting two accessibility issues.

Accessibility checker report showing that there is not enough color contrast between the text and the background.

Accessibility checker reporting nol accessibility issues found!

Ally is now installed and available to courses in Canvas. Select "Course Accessibility Report" on the left-menu to view an accessibility dashboard providing detailed feedback about the accessibility of course materials and content.

Find out more about what is available in Ally for Canvas.