GovWire

Tables

Government Digital Service

August 9
16:39 2024

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 youre 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 tables 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 | Youll stay on the approved driving instructors (ADI) register |

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

Total score Grade Description
0-30 Fail Your performance is unsatisfactory
31-42 Grade B Youll stay on the approved driving instructors (ADI) register
43-51 Grade A You have shown a high standard of instruction and youll 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

Related Articles

Comments

  1. We don't have any comments for this article yet. Why not join in and start a discussion.

Write a Comment

Your name:
Your email:
Comments:

Post my comment

Recent Comments

Follow Us on Twitter

Share This


Enjoyed this? Why not share it with others if you've found it useful by using one of the tools below: