Accessibility rule: Table data missing context, explained
A table is a grid of labeled columns and rows used to arrange information. Sighted users can make a visual association between table header and data cells of a table. This context gives meaning to the data contained in the table. When navigating through a table with a screen reader, it’s important that the same association is created programmatically. This means that each data point in the table needs to be associated to the right row or column header giving context to the data.
Who is impacted by this barrier?
The issue relates to the use of screen readers in particular. When a screen reader user navigates a table, it should be clear what context every data cell relates to.
How does the check work?
The rule checks that each data cell <td> in a table is assigned to at least one column or row header cell <th>. When this is done, a screen reader can announce each data cell in context.
Note: It is best practice to limit table use to simple data sets. Complex tables are difficult to understand and there may be other, more accessible ways to present the content.
Did you find it helpful?Send feedback