Data that can be read aloud.
WHEN TO USE A TABLE
For tabular data: rows and columns with a relationship.
Not for layout. Using tables for layout confuses screen readers, which announce the structure.
WHAT A DATA TABLE NEEDS
Header cells marked as headers, not as ordinary cells styled to look bold A caption or heading describing what the table contains Headers associated with their rows and columns
WHY
A screen reader announces the relevant header when reading each cell. Without proper headers, the user hears a stream of values with no context.
COMPLEX TABLES
Tables with merged cells or multiple header levels need additional markup.
Frequently it is better to split a complex table into several simple ones.
ON MOBILE
Wide tables do not fit. Horizontal scrolling within the table is acceptable; the whole page scrolling sideways is not.
Some designs stack table rows on small screens, which works if the headers are repeated.
WHAT TO AVOID
Presenting data as an image of a table, which is unreadable to assistive technology.
TESTING
Check header cells are actually marked as headers in the markup.
