Techniques

Specify column headers

This allows assistive technology to provide context to each data cell. It also distinguishes header cells visually.

Use predefined styles in your template

Use the styles which have been specifically designed with accessibility in mind, rather than choosing your own font and colour combinations.

Repeat column header rows for long tables that span multiple pages

This prevents users from having to scroll up and down the document to check the text of the column header.

Include a title for your table

This provides an overview of the nature of the data in your table. Use the “Caption” functionality to do this.

Example of good practice

There is a caption above the table providing a title; column and row headers have been specified and are distinctive in appearance.

Table 1 – Birthdays for class eleven

NameAge (years)Birthday
Emily83rd September
Francois1228th April

Example of bad practice

There is no caption above the table; column and row headers have not been specified and are not distinctive in appearance.

NameAge (years)Birthday
Emily83rd September
Francois1228th April

References

WCAG 2.1

  • 1.3.1 Info and Relationships (A)

EN 301 549 v 2.1.2

  • 9.1.3.1 Info and Relationships

Further reading