Activity Feed
- Posted Re: How to make complex tables with multiple levels of headers accessible for screen readers on Canvas Question Forum. 11-30-2022 02:31 PM
- Posted How to make complex tables with multiple levels of headers accessible for screen readers on Canvas Question Forum. 11-30-2022 11:45 AM
- Posted Fixing Accessibility Errors - Tables with Blank Cells on Canvas Question Forum. 11-14-2022 10:53 AM
My Posts
| Post Details | Date Published | Views | Likes |
|---|---|---|---|
|
How to make complex tables with multiple levels of headers accessible for screen readers Is it possible to designate multiple rows and columns in a table as headers in order to make the table accessible for screen readers? What is the step-by-step process for doing so (see reference imag... |
11-30-2022 |
490 |
0 |
|
Fixing Accessibility Errors - Tables with Blank Cells In reviewing the accessibility of Canvas assignments for courses designed by other instructors, I noticed that many teachers are using partially completed tables as a way of presenting a student assi... |
11-14-2022 |
285 |
0 |
12-14-2022
10:52 AM
2 Likes
Thank you @CrystalD2 for providing that screenshot. One helpful option from both an accessibility perspective and to make assignment collection easier is to link a file from the assignment. I do this for my writing assignments, where the Canvas assignment instructions include a link to a read-only Google Doc that I ask students to download and then submit either as an MS Word or PDF file. It would work just as well with an MS Word file linked from the assignment instructions.
... View more
12-01-2022
08:38 AM
1 Like
Hello again, @CrystalD2 ...
In my own testing within my sandbox course, it appears that this is possible. I created a table that looks like this:
Here is what the HTML code looks like:
<table style="border-collapse: collapse; width: 50%;" border="1">
<tbody>
<tr>
<th style="width: 33.3091%;" scope="col">Color</th>
<th style="width: 33.3091%;" scope="col">Shape</th>
<th style="width: 33.3113%;" scope="col">Size</th>
</tr>
<tr>
<th style="width: 33.3091%;" scope="col">blue</th>
<th style="width: 33.3091%;" scope="col">square</th>
<th style="width: 33.3113%;" scope="col">medium</th>
</tr>
<tr>
<td style="width: 33.3091%;">green</td>
<td style="width: 33.3091%;">circle</td>
<td style="width: 33.3113%;">large</td>
</tr>
</tbody>
</table>
Hopefully this might help you with your own table. Keep us posted here in the Community.
... View more