WebAIM - Web Accessibility In Mind

E-mail List Archives

thead th and scope="col" and "row"

for

From: Schulz, Leslie
Date: Aug 16, 2021 12:23PM

I have always thought that a table needed th's in the top row if they are acting as headings.
Then I thought scope="col" also had to be added.

Just by accident I came across a table that read correctly without the scope.
The header row also had <thead>.
I played around with whether I included all th's or I included thead, and BOTH seemed to work.

I also played around with th's in the left column. Again, I left off scope="row".

Expected behavior is when using the table navigation keys, I move across a row, as I enter a column, I hear its heading.
As I navigate down a column, I hear the row headings.
I only put th's on a couple of the 1st column items so that I could hear the difference.

Did something change in the way the screen readers handle this?
I thought scope="col" and scope="row" were required if you wanted to hear them read.

Here is some code:
<h2>Table with THs and thead</h2>
<table><thead><tr><th></th>
<th>Late Submission</th><th>Late Penalty</th></tr>
</thead><tbody>
<tr><th>Auto Graded</th><td>Yes</td><td>Yes</td></tr>
<tr><th>Credit / No Credit</th><td>Yes</td><td>Yes</td></tr>
<tr><td>Manually Graded</td><td>Yes</td><td>No</td></tr>
<tr><td>Past Due</td><td>No</td><td>No</td></tr>
<tr><td>No Due Date</td><td>Yes</td><td>Yes</td></tr>
<tr><td>Non-Mindtap</td><td>No</td><td>No</td></tr>
<tr><td>Unsupported</td><td>No</td><td>No</td></tr></tbody></table>

Thanks,
Leslie


Leslie Schulz, MSEd, CPACC
Web Accessibility Specialist, Learning Team
Content and Learning | Higher Ed & Skills
Quality Learning for All
PHONE: 214.212.7379 Central Time
EMAIL: <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >
WEB: cengage.com<http://www.cengage.com/>;