Tables should not have the same summary and caption

WCAG
Reference unavailable

Accessibility isn’t only about avoiding violations — it’s about ensuring your product can be used confidently by everyone. This guide explains the principle of this rule, shows what goes wrong in real-world code, and provides a verified fix that meets WCAG and the European Accessibility Act (EAA).

Why this matters and how to fix it

Why this matters

Tables should not have the same summary and caption

How to fix this issue

Use `<caption>` for titles; associate headers with data cells via `scope` or `headers`/`id` for complex tables.

Automated detection · Manual review recommended

Developer guidance

Enforce these rules in your component library and CI (eslint, jsx-a11y, jest-axe). Validate with keyboard-only and screen reader tests.

Code examples

Incorrect Implementation

<table><tr><td>Price</td></tr><tr><td>$10</td></tr></table>

Correct Implementation

<table><tr><th scope="col">Price</th></tr><tr><td>$10</td></tr></table>
eu icon getwcag

Trusted by organizations across Europe working toward WCAG and EAA conformance