Features

Ensure that tables with a caption use the <caption> element.

Rule ID: table-fake-caption User Impact: serious Guidelines: Experimental

The table-fake-caption rule ensures that tables use a proper <caption> element to define the table title instead of visually faking it with colspan on cells.

What is being tested?

This rule checks if data tables use an actual <caption> element to provide the table’s title, rather than using cells styled with colspan to mimic a caption visually.

Why it matters

Screen readers rely on proper table markup to announce the table’s purpose and structure. Without a real <caption> element, users of assistive technology may not understand what the table represents, leading to confusion or missed information.

How to fix the problem

  • Use a real <caption> element inside the <table> tag to provide the table title.
  • Remove any cells with colspan that are used only for visual captions.

Correct example

<table>
  <caption>Greensprings Running Club Personal Bests</caption>
  <thead>
    <tr>
      <th>Name</th>
      <th>1 mile</th>
      <th>5 km</th>
      <th>10 km</th>
    </tr>
  </thead>
  <tbody>
    <tr><th>Mary</th><td>8:32</td><td>28:04</td><td>1:01:16</td></tr>
    <tr><th>Betsy</th><td>7:43</td><td>26:47</td><td>55:38</td></tr>
  </tbody>
</table>

Incorrect example

<table>
  <tr><td colspan="4">Greensprings Running Club Personal Bests</td></tr>
  <tr><th>Name</th><th>1 mile</th><th>5 km</th><th>10 km</th></tr>
  <tr><th>Mary</th><td>8:32</td><td>28:04</td><td>1:01:16</td></tr>
</table>

Best practices

  • Always provide a <caption> to describe the table’s purpose.
  • Keep captions concise and meaningful.
  • Avoid using visual tricks like merged cells or styled text to simulate a caption.

Other Rules

Interested in other web accessibility rules? Please see these other rules: