Tables can be a very effective way of organising content and are - in themselves - an effective 'alternative format' compared to a linear text description of the same information. However the design of the table can make a huge difference to users. Complex tables can easily overwhelm users trying to "see the wood for the trees".

  • Create simple tables, one table per topic, one piece of data per cell.
  • Use tables only to organize tabular data, keep them as simple as possible.
  • Use the <caption> tag to describe the content of the table.
  • Put each data in its own cell. Create simple structures with a logical reading order and avoid merging cells.
  • Be consistent when aligning text, either to the left (or right for right to left languages) and numeric data to the right.
  • When using colour, make sure there is enough colour contrast between background and text and for headers and data cells.
  • Use colour along with other elements (text, icons) for conveying meaning.
  • Use two different background colours and use them alternately for rows to facilitate reading.
  • Provide additional information to provide explanation for complex tables.
  • When using multiple data tables in a row, resist the urge to put them into one table.
  • Break apart complex tables to make the data easier to interpret.

Remember! Confusing tables are particularly problematic for screenreader users who hear the table read in order from top to bottom, left to right. Use tables for data display, not for content layout.

Return to the category: Accessibility tips