Accessibility Techniques for Tables
Topic Technique WCAG AA Requirement
Table Headers Header tag: Table headers MUST be designated with <th>. Required
WCAG 1.3.1
Meaningful header: Data table header text MUST accurately describe the category of the corresponding data cells. Required
WCAG 1.3.1
Header and data cell associations: Table data cells MUST be associated with their corresponding header cells.
Note: Use of scope (<th scope="col"> and <th scope="row">) is highly recommended, though not always necessary (i.e. if all cells in the first row are marked as <th> without scope, most modern screen readers will infer that the scope is the column below each header cell).
WCAG 1.3.1
Group header associations: Table data group headers (if any) MUST be associated with their corresponding data cell groups (e.g. via scope="rowgroup" or scope="colgroup"). Required
WCAG 1.3.1
Complex header associations: Header/data associations that cannot be designated with <th> and scope MUST be designated with the headers and id attributes. Required
WCAG 1.3.1
Nested or split tables: Data table headers and data associations MUST NOT be referenced across nested, merged, or separate tables. Required
WCAG 1.3.1
Tabular Data Tables: Tabular data SHOULD be represented in a <table>.
Note: Even if the data are not represented in a table, WCAG 1.3.1 requires the data to be associated with their labels.
best practice
Caption Caption: Data tables SHOULD have a programmatically-associated <caption> or name (e.g. via aria-label or aria-labelledby).
Note: In most circumstances, <caption> is preferred, because it is the native method of giving a name to a table, and the <caption> is visible and available to all users by default.
best practice
Meaningful caption: The name or <caption> of a data table SHOULD describe the identity or purpose of the table accurately, meaningfully, and succinctly. best practice
Unique caption: The name or <caption> of each data table SHOULD be unique within the context of other tables on the same page. best practice
Layout Tables Avoid layout tables: Tables SHOULD NOT be used for the purpose of purely visual (non-data) layout. best practice
Avoid headers in layout tables: Layout tables MUST NOT contain headers. best practice