Canvas Rich Content Editor

Page Content

About the Rich Content Editor

The Rich Content Editor is the Canvas WYSIWYG editor that can be used to create accessible HTML content for images, links, headings and tables. The following Canvas features use the Rich Content Editor:

• Announcements
• Assignments
• Discussions
• Pages
• Quizzes
• Syllabus

Keyboard Alternates for Rich Content Editor

Users on a keyboard can access the tools on the Rich Content Editor with these keyboard short cuts.
Note: The Macintosh FN key is on the lower left of the keyboard and is separate from the numeric function keys.

Add ALT Text to Uploaded Images

Using the Rich Content Editor, you can add ALT text to images embedded into content. These images have to be first uploaded to your personal or course files. The steps are listed out below:

1. First upload or find the image. The image can come from your computer drive, Flickr, or another source.
2. In the Rich Content Editor, click the picture icon to open the embed image tool.
   
3. Find the image to upload. Uploaded images are in the Canvas tab.
4. In the Attributes section, add ALT text by replacing the image file name with a short description of the image.
5. Click Update to complete the process.

Use Heading Styles

Headings and subheadings are used in longer documents to help readers develop a mental map and skip to different sections as needed. Users on a screen reader can also make use of headings, but only if they are semantically tagged as headings.

This can be easily done in Canvas by using “styles” such as Header 2, Header 3 and so forth. The Paragraph style is equally important for allowing a screen reader to read smaller chunks of text.

Use Styles like Header 2 or Header to adjust font size in Canvas content.

Use Meaningful Link Text

Many screen readers including JAWS and VoiceOver give users the option to read just the links on the page. It’s important that text for inserted links describe a specific destination. Avoid generic terms like “here” and “read more”.

Math Equations

The Canvas Math Editor will convert an inputted equation to MathML for users on a screen reader. See the Canvas Math Editor for details on how to create a math equation.

Add Language Tag (in HTML code view)

A language tag (or attribute) indicates the language of the text to a screen reader and a search engine. By default, the language in all Canvas is set to English (i.e. <html.... lang="en">).

However, if you include non-English content, it should have its own tag. Otherwise a user on a screen reader will not be able to hear foreign language content spoken correctly. Instead, all words will be pronounced as if they were in English.

How to Add a Language Tag

Unfortunately, language tagging can only be done while viewing HTML code.

1. Within the Rich Content Editor, click the HTML Editor link in the upper right. This will open up the window showing the HTML code.
2. Add language attribute tags to sections of non-English content following examples on Language Tags in HTML.

Uploaded Files

Any files uploaded into Canvas should be optimized for accessibility. Options for different file types are given below:

Recommended File Types

• Microsoft Word and PowerPoint
• Video Captions

Not Recommended

Alternatives for these file types are recommended because these formats require a great deal of time and technical expertise to make them usable for all audiences.

• PDF
• Flash

Allow File Downloads

It’s also important to allow students to have the option to download files or open them in a blank window as well as view them through Canvas. This allows students using different assistive technoclogies or devices to view the files outside the Canvas environment. Doing so allows students to take advantage of the accessibility features in the native document software.

There have two options, both of which allow for the files to be downloaded or previewed within Canvas.

1. They can be added as stand-alone content within a module, and a link to download the document will be auto-generated at the top of the page.
2. They can be linked to from a page. In this case, the link is designed so that there are options to either preview the document in Canvas or to open it in a new window, which will allow for downloading as well.

Create Accessible Tables

About Accessible Tables

For screen reader accessibility online data tables, should have have the following features. Note that both will also provide additional formatting cues useful to sighted users.

• A CAPTION for the title of a table
• The first row should contain HEADER cells with SCOPE set to “col”. These cells should describe the contents of each column.
• Optionally, the first column can contain HEADER cells with SCOPE set to “row”.

Both features allow screen reader (and sighted) users to more easily determine the purpose and structure of a table.

Insert Table Caption

1. Follow the Canvas-provided instructions on how to insert a table in Canvas.
2. Highlight the table.
3. Click the Table insertion tool to reveal the menu.
4. Select Table Properties in the menu.
   
5. Check the option for Caption on the General tab, then click Ok.
   
6. A slot to enter a table title will appear in the Rich Content Editor.

Set Cell Properties to Headers

By default Canvas tables do not include headers, but you can change the top row or the left column to headers in the Cell Properties option.

1. In a table highlight the cells of the first row.
2. Click the Table insertion tool to reveal the menu.
3. Select Cell : Cell Properties in the menu.
   
4. In the Cell Properties window, change the Cell Type to “Header cell”.
5. Set the Scope to “Column.” Click OK to save the settings.
   

Top of Page