td headers
You should set one table header per column to help assistive technologies.
Accessibility
Correct use of headers attribute in a table
Some users use assistive technologies and screen readers to be able to navigate a web page correctly.
When these technologies scan the page and find a table, they inform the user about the headers of each cell, so it is important that the headers and data match.
Therefore, you should set one table header per column.
How the SeoChecker audit fails
When SeoChecker's audit detects more than one table header per column, it will notify it.
How can I fix data cells that refer to nonexistent headers?
Have a look at the table below:
<table>
<caption><strong>My marathon training log</strong></caption>
<thead>
<tr>
<th>Week</th>
<th>Total miles</th>
<th>Longest run</th>
<th>Long run pace</th>
</tr>
</thead>
<tbody>
<tr>
<th headers="Week">1</th>
<td>14</td>
<td>5</td>
<td>12.30</td>
</tr>
<tr>
<th>1</th>
<td>16</td>
<td>6</td>
<td>12.15</td>
</tr>
</tbody>
</table>
As you can see, there is one column with multiple table headers.
You need to fix it, so delete headers=”Week” and use instead the scope attribute to the header column and table rows: this attribute is able to communicate with both browser and assistive technologies, specifying that the components in the column are related to the header at the top; moreover, elements in the right of the row header are related to it.
In addition to that you should add the <td> to the first row in the body to align the data with the headers.
<table>
<caption>My marathon training log</caption>
<thead>
<tr>
<th scope="col">Week</th>
<th scope="col">Total miles</th>
<th scope="col">Longest run</th>
<th scope="col">Long run pace</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>14</td>
<td>5</td>
<td>12.30</td>
</tr>
<tr>
<th scope="row">1</th>
<td>16</td>
<td>6</td>
<td>12.15</td>
</tr>
</tbody>
</table>