Tables

Think about whether you really need to use a table

Using a table can make it easier for a user to compare and scan information, but it can also cause accessibility issues. Never use a table:

• for fewer than 2 rows of data
• if there's a simpler way to present the information, such as, in a paragraph of text

Use a table for exact values and information that's too detailed for text.

Simplify your table

Make sure your table is as simple as possible:

• it must only contain information that's necessary, don't add extra information on the off chance someone might want it
• don’t make tables with other tables inside them (nested tables)
• do consider splitting a large, complex table into smaller, simpler tables

What to put in a blank cell

Header cells

Empty header cells break the logical structure of a table. You must put something in all of your header cells (cells using a <th> tag).

Data cells

You can have empty data cells (cells using a <td> tag), but they're often skipped by screen readers which can be confusing for a user.

It's better to put in something relevant to the situation. For example:

• 'No data': when values are missing or unavailable
• 'Not applicable' (not 'NA' or 'N/A'): when values are not applicable
• 'None': when the absence of a value is intentional
• '0': if zero is a valid and meaningful value

These options are better than using a dash, as dashes can be misread by screen readers.