Creating Accessible Tables in Canvas

Information

This article explains how to add accessible tables into any Canvas page.

Tables should be used for organizing data into a logical grid. Avoid the use of tables as a purely visual design choice. Before choosing a table, consider if the information is simple enough to convey using headings or lists instead of tables.

Environment

  • Canvas

Process

  1. Verify that a table is necessary. Information should only be formatted as a table if it requires a logical data grid; do not use tables purely for visual layout.
  2. To create a table in Canvas, open up any page, assignment, discussion, etc., and click Edit.
  3. Click Table in the top row of the text editor or the table icon in the bottom row. (If you do not see the table icon, click the three vertical dots to see More).
  4. Hover over Table to create it, then specify the amount of rows and columns by clicking one of the cells. You can always add more rows or columns later if the presented sizes are not sufficient.
  5. Keep tables as simple as possible for the sake of accessibility; avoid merged, nested, or empty cells.
  6. After entering the information into the cells of your table, the Canvas Accessibility Checker will most likely flag two issues: Captions and Headers. Canvas Accessibility Checker flagging missing Captions and Headers
  7. In the Accessibility Checker pop-out window, enter a Caption into the text box. Captions help provide context for those using assistive technology. Then, click Apply.
  8. The caption will by default be hidden to those not using a screen reader. However, if you want the caption visible for all, click into the table, then click the Table Properties icon. Table Properties icon located in the Canvas rich text editor
  9. Check the Show caption box and then click Save. Show caption checkbox checked within the Table Properties menu
  10. Finally, navigate back into the Accessibility Checker pop-out window and click the Set table header dropdown box. Set table header dropdown menu inside the Accessibility Checker panel
  11. Select Header Row to mark the first cell of each row as the label for that row, or Header Column to mark the first cell of each column as the label. Select Header row and column if both your rows and your columns have labels.
  12. While it is best accessibility practice for your table to have at least one header, you can click No headers if none exist in your table. No headers option selected in the Set table header dropdown
  13. Click Apply to save your selection.
Print Article