| Rule ID |
Table 5 |
| Conformance |
Required |
| Definition |
Table markup must identify a table as either a data table or a layout table. |
| Purpose |
- The
table element is designed for representing tabular data in a web page, but table markup has also been used by web developers as a means to layout content in rows and columns.
- Users of assistive technology are confused when the purpose of table markup is not clearly identified (i.e. layout or for tabular data).
- Use
role="none" on the table element to clearly identify a table markup for layout.
- Adding an accessible name and/or description to a
table element identifies table markup as a data table (e.g. layout tables must not have an accessible name or description).
- The use header cells (e.g.
th or td[scope] elements) identifies a table element as a data table.
|
| Conformance |
Required |
| WCAG Success Criteria |
Success Criterion 1.3.1 Info and Relationships
Other Related Success Criterion:
|
| Rule Category |
Tables/Layout |
| Rule Scope |
Element |
| Techniques |
- Use
th elements in the first row and/or first column to identify a table as a data table.
- Use
caption element; aria-label or aria-labelledby attribute to add an accessible name to a table element.
- Use the
aria-describedby attribute to add an accessible description to a table element.
- Use
role="none" on the table element to identify a table and its child table elements (e.g. tr and td elements) are being used for layout.
- Layout tables must only use the
tr and td table elements for layout content and must NOT have an accessible name or description.
|
| Information Links |
|