Search code examples
accessibilityscreen-readerswcag

Screen readers read the column header as one of the rows

Screen readers always read the column headers as one of the row. Let's say a table has three rows and one column header, then the screen reader reads it as 4 rows; this includes the column header + three rows.

I have even seen this issue in this example: https://www.w3.org/WAI/ARIA/apg/patterns/grid/examples/data-grids/

I have pasted a simple table markup here:

<table border="1">
  <tr>
    <th scope="col">Date</th>
    <th scope="col">Event</th>
    <th scope="col">Venue</th>
  </tr>
  <tr>
    <td>12 February</td>
    <td>Waltz with Strauss</td>
    <td>Main Hall</td>
  </tr>
   <tr>
    <td>12 February</td>
    <td>Waltz with Strauss</td>
    <td>Main Hall</td>
  </tr>
</table>

Can somebody please help me how to fix this issue?

Solution

  • This isn't an issue. All screen readers consider the table headers as being part of the table and can be read and navigated as all other regular rows and columns. This is perfectly normal and expected by screen reader users.