Tables

When to use tables and how to make them accessible.

When to use a table

Use tables to present data or information that can be organised in a structured way. This could consist of numbers, text or statistics.

A table should make it easy to:

• understand the relationship between different types of data

• examine a range of possibilities at a glance

Do not use tables for cosmetic reasons or when you can use normal page structure to present the information, for example headers or lists.

See instructions on how to publish tables.

How to structure your table

Here is a table showing the number of different animals in 3 different farms. 

	Woodchurch	Moat	Jenkey
Sheep	50	60	80
Cows	200	38	75
Pigs	150	70	35

Woodchurch, Moat and Jenkey are the column headers. Together they form the header row.  

Sheep, Cows and Pigs are the row headers. Together they form the header column. 

How to make tables accessible

To make sure your table is accessible, you must have:

• a descriptive header for every column

• one header row only 

• only one item per row cell

• ‘no data’ or ‘not applicable’ instead of empty cells

You should not have any split, merged or empty cells. The only time you should have an empty cell is the top left cell. This is used if you have a header row that does not need a column header.  If you’re copying and pasting a spreadsheet or a table from a document, remove any split or merged cells and fill in any empty cells. Empty cells make it difficult for users of assistive technology in particular to navigate the table.

Use headers

Tables must always have a header row that includes a header explaining the content of each column in your table.

Headers help users understand the table’s structure.

Table headers should:

• accurately describe the content in the relevant row or column

• be unique and not repeated within the table

• be capitalised

You can use links in row and column headers.

If your table also has a row header, use the # header Markdown. The row headers must be in column one. In the example below, the 3 different types of fruit are row headers, and Alice and Ben are column headers. 

| | Alice | Ben |

|--- |--- |--- |

|# Apples | 0 | 3 |

|# Bananas | 2 | 3 |

|# Pears | 0 | 0|

As shown below, both the first row and the first column are marked as headers. As the row headers do not need a column header, the first cell is empty. 

	Alice	Ben
Apples	0	3
Bananas	2	3
Pears	0	0

In the example below, ‘Total score’ is the column header for the row headers. In this example, the top left cell is not empty as the row headers need a column header.

| Total score | Grade | Description| 

|---------|---------|---------|

|# 0-30 | Fail | Your performance is unsatisfactory |

|# 31-42 | Grade B | You’ll stay on the approved driving instructors (ADI) register |

|# 43-51 | Grade A | You have shown a high standard of instruction and you’ll stay on the ADI register|

Total score	Grade	Description
0-30	Fail	Your performance is unsatisfactory
31-42	Grade B	You’ll stay on the approved driving instructors (ADI) register
43-51	Grade A	You have shown a high standard of instruction and you’ll stay on the ADI register

Watch how screen readers use headers to make table content accessible. You can find the transcript in the video description on YouTube.

How screen readers use headings to make table content accessible

Help the user

Carry out any calculations, for example include totals or differences between amounts at the end of columns or rows.

You must only have one item per cell. If there are multiple items per cell, an assistive tech user will find it difficult to understand your table. 

For example, 

Name	Company name	Position held
John Doe	British Geese Juggling Association International Cat Herding Committee  Save the Dodos	Consultant Member Member
Alice Smith	International Cat Herding Committee Animal Book Club	CEO Member

A screen reader user will not be able to understand the different positions held at each company. 

Instead each company and position should have a cell. 

For example,

Name	Company name	Position held
John Doe	British Geese Juggling Association	Consultant
John Doe	International Cat Herding Committee	Member
John Doe	Save the Dodos	Member
Alice Smith	International Cat Herding Committee	CEO
Alice Smith	Animal Book Club	Member

Make your table easier to read

The size of a table affects how easy it is for people to read and understand it.

The minimum size for a table should be 2 columns and 3 rows (including a column header), but if your table is this small it may be better as normal text.

A large table will be difficult to navigate, especially with a mobile device. On GOV.UK you can see about 4 or 5 columns and 10 rows without scrolling depending on how much text you have in each cell. Check your table in preview mode to make sure it is not too big.  Avoid using large tables and if possible, break them down into smaller tables.

If you’re dealing with a huge amount of data that cannot be split up, it might be better presented as a CSV (spreadsheet).

You should avoid publishing complex tables. Your table must only have one header row and / or header column. If your table has more than one header row or column, you should try to break it down into smaller tables. If you cannot break it down, make sure that the headers in your single header row or column are descriptive and unique. 

For example, the table below shows information about livestock over 2 periods, from 2021 to 2022 and from 2022 to 2023. 

	2022-23			2021-2022
	Feed cost	Newborns	Profit	Feed cost	Newborns	Profit
Cows	3500	20	5%	3000	15	25%
Pigs	1500	7	3%	750	5	6%
Sheep	150	50	20%	100	35	15%

There are 2 header rows in this table - one for the years and one for the feed cost, newborns and profit. A screen reader user will not be able to understand which of the column headers refers to which year group. For example, a screen reader would read ‘Cows, newborns 20, cows newborns 15’ - the user would not be able to tell which year the number refers to. 

In this case, you could have 2 separate tables or use descriptive and unique headers as shown in the example below. 

	Feed cost 2022-23	Newborns 2022-23	Profit 2022-23	Feed cost 2021-22	Newborns 2021-22	Profit 2021–22
Cows	3500	20	5%	3000	15	25%
Pigs	1500	7	3%	750	5	6%
Sheep	150	50	20%	100	35	15%

Put important information first

Put the information that most people are looking for at the top or in the first few columns.

Convert tables to barcharts

In HTML publications you can convert tables into barcharts which are accessible to users with screen readers. Users can switch between the table and bar chart view.

Style

Keep text in cells concise and clear, and follow the GOV.UK style guide. You can depart from GOV.UK style to:

• truncate the names of months to save room, for example Jan, Feb

• use a dash to show a span between numbers, for example 500-900

• use numerals throughout (do not use ordinals, for example first, second, 10th)

If you do not need to use exact numbers, consider rounding large numbers with decimal places, for example £148,646,000 = £148.6 million. 

It is best practice to use right-aligned numbers if they are in the same column and need to be easily compared.