|Data cells in data tables must have row and/or column header cells.
th (table header) elements are used as the first cell in each row and/or column of a data table, assistive technologies can infer the header-to-data-cell relationships for those rows and columns, making the header information programmatically available to screen reader users from any data cell.
- By providing a representation that is functionally equivalent to the visual relationships of data cells to row and column headers that sighted users rely upon, screen reader users are able to maintain orientation and comprehension as they traverse the data table.
- When solitary row and/or column headers are not sufficient to describe a data cell, use the
headers attribute to identify the appropriate header cells.
HTML4 Legacy Techniques
HTML5 and ARIA Techniques
|WCAG Success Criteria
1.3.1 Info and Relationships (Level A, Primary Success Criterion)
- Use a
th element as the first cell in each row and/or column to define row and column headers in simple data tables.
th element for row and column header cells.
- While not recommended, it is also valid to use
td element with a
scope attribute as a header cell.
- Avoid using empty rows and columns for formatting data tables. Use CSS instead.
- Verify that empty
th elements do not need table headers.