Summary
Accessibility is proactive, accommodation is reactive. Creating accessible course content will save time in the long run. Accessible content improves the learning experience for all students, not just individuals with disabilities, as it meets the needs of a variety of learning preferences. The steps below highlight the top six areas that should be taken into consideration when ensuring course content that is created using the Rich Content Editor meets accessibility standards.
For a more detailed understanding of how accessibility should be considered during the course design process, visit our Basic Accessibility Checklist instructional design document.
Tips
The Rich Content Editor (RCE) in Canvas includes an accessibility checker that automatically assesses common errors. Check out the following resources for more information on this topic:
- Canvas Guide: How do I use the accessibility checker in the Rich Content Editor as an Instructor?
- Canvas Article: General Accessibility Guidelines
Launch the Accessibility Checker by clicking the “Check Accessibility” button at the bottom right section of the RCE.
Headings
The Rich Content Editor (RCE) in Canvas allows for the organization of content through headings. The title of the page will automatically be formatted while the writing in the text box will have to be formatted manually. Relying on bold, italics, color, and increased font size alone is not sufficient for users that depend on screen readers or are visually impaired. Sighted users will be able to skim through content with pseudo-headings for comprehension, but screen reader users will not have the same benefit. To avoid this inequity, it is best practice to apply synchronous headings provided in the RCE.
To apply headings, access them in the “Paragraph” drop-down circled in the image below.
“Header 1” is being utilized for the title of the page and will not be available as an option in the drop-down. Begin with “Header 2” and continue to use that heading for all same level subjects.
If you need a subheading, utilize “Header 3.” “Header 2” can be used again as needed.
Headings must be in order for screen readers to properly use them. Do not skip a heading level. Below is an example of how to use headings in the RCE:
Font, Color, and Style
The default settings in the Rich Content Editor (RCE) are already accessible. It is always recommended to use black text on a white background as it has the highest contrast. If differing from the norm, select a text font, size, and color that is legible to ensure readability. Font size should be at least 12 point or above to maximize use.
Using hue, shade, tint or tone as the only means of conveying information, otherwise known as color reliance, should be avoided. Screen readers do not announce the color of text or if it is highlighted. For comprehension purposes, separate the content, provide text labels, or use icons. To verify that the selected font size and color are accessible and meet WCAG 2.1 A and AA compliance, use WebAIM’s Color Contrast Checker.
Canvas has formatted “Bold” as <strong> and “Italic” as <emphasis>. These tags will be read to a screen reader user. Underlined text should be reserved strictly for hyperlinks.
Pseudo-lists, created using dashes or spacing instead of styled bullet points or numbers, can present barriers. Use each style appropriately to increase comprehension for all users.
Images
Images are inaccessible for individuals with visual impairments. When inserting an image into the Rich Content Editor (RCE) be sure to include sufficient alternative text to improve accessibility. This is what will be presented by the screen reader. Alt text should be less than 120 characters, around two sentences, and convey the significance of the media. It is unnecessary to include “Image of” or “Graphic of” in the description field as the screen reader will present the picture appropriately.
To embed an image, use the icon indicated in the picture below in the RCE.
This will open the dropdown menu that gives 3 options: upload image, course images, and user images.
When the image is inserted into the RCE, click to get image options.
The options pop out window will allow instructors to include alt text for the image or mark the image as decorative.
By default, Canvas includes the image name as the alt text, which should be changed to something more descriptive when embedding images. If the image is just for decorative purposes, like colored boxes or filigree, check the box next to “Decorative Image.” The screen reader will still note that a graphic is there, but will not read a description. If the image is complex and alt text will not be sufficient for comprehension, include a caption to ensure equality.
Tables
Tables that are not formatted correctly pose accessibility issues. If a table is used to organize content instead of present data, it can be extremely confusing for a student using a screen reader to navigate. Tables used to introduce data should have at least one header, include specifications, and have appropriate captions if applicable. Adding scope will allow the table to provide context to screen readers. To accomplish this use the table tool indicated in the picture below in the Rich Content Editor (RCE).
Once the table has been created, place the cursor in the cell, click on the table tool, go to “Cell” and then select “Cell properties.”
The “Cell Properties” window will open. Set the Cell type to “Header cell” and the Scope to either “Column” or “Row” depending on displayed content. Provide additional context by selecting the “Caption” box in the Table properties section.
More Information: How do I insert a table using the Rich Content Editor?
Hyperlinks
Reserve underlined text for hyperlinks. Utilize the hyperlink tool in the Rich Content Editor (RCE) and avoid directly inserting the URL. Copy and pasting the URL into content is extremely difficult for screen reader users to understand. By incorporating hyperlinks instead, the content becomes user-friendly and interactive.
To create a hyperlink, highlight the text, click the “Link to URL” button shown below. There are two options in the dropdown menu. Choose to link to either external links or to course links.
Make sure the text that is hyperlinked is specific and descriptive in nature. Avoid writing “click here” or “see this video” as it does not adequately convey the function of the link.
More Information:
Audio-Visual Content: Closed Captioning and Transcripts
Transcripts and captioning makes videos accessible for individuals with hearing impairments, but will also allow all students to have access to materials in their preferred formats, which is ideal for all learners.
You can increase the longevity of a video by not being overly specific. To ensure recorded content can be used over multiple terms, avoid mentioning semesters, years or section names.
CIRT uses a third-party service to provide captions and transcripts for audio-visual instructional materials. This ensures the most accurate and reliable closed captions for videos, time-synchronized transcriptions, audio description, and multilingual subtitles. Instructors that have already recorded videos that need to be made more accessible can complete the Transcript Request Intake Form.
Canvas Studio can be used to make video content accessible. Canvas Studio includes a captioning tool that generates a transcript file for your media files. The Caption Request tool transcribes the media file language with 85% accuracy. Captions can be reviewed and errors corrected before being published. Students viewing the video will have the ability to turn on captions for increased comprehension.
More information:
- How do I use the Canvas Studio Caption Request Tool to add captions to a media file?
- How do I embed Canvas Studio media in a Canvas course?
YouTube can automatically generate captions, but they are not always accurate. To learn more about making YouTube videos accessible view the “Add subtitles & closed captions” article.
