Back to Learn
Pulseaccessibility

Table Cells Have Headers

What This Audit Checks

This audit verifies that every <td> cell in a data table is associated with at least one <th> header. It checks for headers in the same row, same column, or explicitly linked via the headers attribute.

Why It Matters

Screen readers announce column and row headers before reading a cell's value so users understand the data in context. Without headers, a cell's value like "42" has no meaning on its own, and users cannot navigate the table efficiently.

How to Fix It

  • Add <th> elements to the first row and/or first column of your table to define headers.
  • Use the scope attribute to clarify whether a header applies to a row or column: 
    <th scope="col">Revenue</th>
<th scope="row">Q1</th>
  • Use the headers attribute on <td> elements for complex tables where headers are not in a simple row/column relationship.
  • Do not use data tables for layout. If the table is purely presentational, add role="presentation" instead of headers.
<table>
  <tr>
    <th scope="col">Quarter</th>
    <th scope="col">Revenue</th>
  </tr>
  <tr>
    <td>Q1</td>
    <td>$12,000</td>
  </tr>
</table>

How Pulse Tracks This

Pulse flags this audit in your Lighthouse accessibility score. When the audit fails, Pulse shows which elements triggered it so you can fix them directly.

Resources