Definition
Techniques for making data tables navigable and comprehensible to screen reader users: captions, scope attributes, headers/id associations, and proper use of <th> vs <td>.
Why It Matters
It ensures that complex, tabular data is navigable by screen readers, preventing the “data-siloing” of information for disabled users. Proper table markup is the difference between a useful data set and a confusing wall of noise for many people.
Core Concepts
<table>
<caption>Monthly Savings</caption>
<thead>
<tr>
<th scope="col">Month</th>
<th scope="col">Amount</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">January</th>
<td>$100</td>
</tr>
</tbody>
</table><caption>: Table title; must be first child of<table>.scope="col"/scope="row": Associates header cells with their column or row.headers+id: Complex tables link data cells to multiple headers.<th>vs<td>: Headers use<th>; data uses<td>.- Layout Tables: Avoid tables for layout—they confuse assistive technology.