WCAG 1.3.1: Info and Relationships (table cells)

How to

• Correctly associate table headers with their content

  When a table has two headers (one on the left and one at the top), the scope attribute must be used to associate table headers with data cells.

  scope indicates whether the cell is a header for a row (row), a column (col), or a group of rows (rowgroup) or columns (colgroup).

  For more complex tables with multiple sub-headings, the <th> elements also need an id so they can be associated with individual table cells.

  Very good examples of how to implement accessible tables can be found on the W3C website

  Technique(s):

  • H63: Using the scope attribute to associate header cells with data cells in data tables
  • H43: Using id and headers attributes to associate data cells with header cells in data tables