Skip to content
Back to Learn
Pulseaccessibility

Tables Use Caption Instead of Colspan Cells

Ensure tables use the caption element rather than cells spanning all columns as a title.

What This Audit Checks

This audit detects tables that use a <td> or <th> cell with a colspan spanning the full table width as a fake caption. This pattern simulates a table title visually but is not recognized as a caption by assistive technologies.

Why It Matters

Screen readers use <caption> to announce what a table is about before reading its contents. A colspan cell is just another data cell to assistive technology, so the table appears unnamed. Users cannot decide whether a table is relevant without first listening to its entire contents.

How to Fix It

  • Replace the colspan cell with a <caption> element placed as the first child of <table>.
  • Move the text content from the fake caption cell into the <caption>.
  • Remove the row that contained the colspan cell entirely.
<!-- Bad: fake caption using colspan -->
<table>
  <tr>
    <td colspan="3">Monthly Sales Data</td>
  </tr>
  <tr><th>Month</th><th>Units</th><th>Revenue</th></tr>
  ...
</table>

<!-- Good: proper caption element -->
<table>
  <caption>Monthly Sales Data</caption>
  <tr><th>Month</th><th>Units</th><th>Revenue</th></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

Tables Use Caption Instead of Colspan Cells