Creating Accessible Tables in Canvas
The scope attributes in a table helps provide context to screen readers. A scope="col" identifies the header for all the cells in that column, and cells with a scope="row" identifies the header for all the cells in that row. To add column and row scope to a table created in the Rich Content Editor, first insert a table.
- To add scope for a column, select the relevant cells of the table.
- In the Table Menu, select Cell properties (See Fig 1).
Figure 1: Cell properties option in table menu
- Set the Cell type to Header cell (See Fig. 2).
- Set Scope to Column (See Fig. 2).
Figure 2: Setting the cell properties for a column
- To set scope for a row, repeat steps 1-3.
- Set Scope to Row (See Fig. 3).
Figure 3: Setting the cell properties for a row
A caption can be used to associate a short description to the table. Captions are not required, but they may be helpful in providing additional context. Captions provide more context to tables and appear in a row above your table's content. Keep captions clear and concise.
- To add a caption to your table, select all of the cells.
- In the Table Menu, select Table properties .
- Click the box next to Caption (See Fig 4).
Figure 4: Turning on captions in table properties
- Type in the caption (See Fig. 5)
Figure 5: Caption in a table header row
Did you find it helpful?
Modified on: Tue, Jul 6, 2021 at 12:32 PM