Structure

On this page:

• • Headings
  • Lists
  • Tables

Headings

Headings create structure to help users understand connections and topics. The Canvas Rich Content Editor offers tools to build proper heading hierarchies. Highlight text and choose the appropriate heading level.

Canvas reserves H1 (heading level 1) for the item title. Consider H2 as section headings, H3 as sub-section headings, etc. Headings must be in sequential order. Do not skip a heading level. Paragraph text may follow any heading level. (Note: If the heading levels are not in order, the Accessibility Checker will report Heading levels should not be skipped.

Lists

• Use bullet lists for unorganized lists.
• Lists where the sequence is not important.

1. Use numbered lists for items where sequence is important.
2. Such as steps in a process.

Review list best practices.

To make a properly formatted list in Canvas:

Do not manually insert symbols or use the Tab key to create indents. The Accessibility Checker may note improperly formatted lists

Tables

Properly formatted tables are accessible to text-to-speech and screen reader software.

Use the built-in tool to create a table.

Here are some common errors the Accessibility Checker will flag in table formatting:

1. Tables must have captions.
   How to fix: set a brief description to indicate the content of the table. The simplest way is via the Accessibility Checker tool, which will prompt for a caption. This will add <caption> within the <table> element.
   
2. Tables must have at least one header.
   How to fix: the simplest way is via the Accessibility Checker tool, which will prompt you to select whether your table has a “Header row,” “Header column,” or both. Your choice will change the selected data cells <td> to header cells <th>.
   
3. Table headers must be associated with cells.
   How to fix: Set header scope to “Row” or “Column”, which will add the scope attribute (<th scope=”row”> or <th scope=”col”) to associate header cells and data cells. Usually, the cells in the top row should have a scope of “Column”. If the first row also contains headers, all but the top-most cell should have a scope of “Row”.
   

The Canvas Accessibility Checker flags most table errors and provides detailed instructions to make tables accessible.

However, one common error is not flagged. Your table should not have empty cells, especially not the top left cell, as this can be confusing to screen reader users. Ensure you fill in all of the table cells.