Complete conversions, transfers and changes includes lots of information in tables.

As we uncovered more needs for additional information in these tables, we decided to make changes.

Our plan was that these changes would help to communicate information as simply as possible and make the tables easy to understand.

Our users already use tables

Tables are a great way for our users to compare and understand information.

Many of the workarounds users created to help them manage their projects are a form of tables.

They use spreadsheets to keep track of things like which academies are ready to open or transfer and what money needs to be paid trusts.

Tables fit our users' mental models.

Early table designs

Our early designs for tables included an "View project" link in the last column, on the right of the table.

We felt that this may be more accessible than linking from the establishment name on the left of the table.

We designed it so that a screen reader would announce the establishment name as part of the "View project" link.

This would help to differentiate it from other "View project" links in the table when announced by a screen reader and help users to understand which project they would open when they select that link.

However, the duplication of multiple links using the same content on a page had negatives. It took up a lot of space in the table.

In general, people often ignore repetitive content too, meaning we take up valuable screen space with information that users don't pay attention to.

We could use that space for something more useful, or to free up space in the table for remaining content to become easier to read.

A table of information including the school name and an link to "Open project" under the column title "View project"

We wanted, and needed, to help reduce the number of columns. This would give information in the tables more space and make them easier to read.

We did this by removing the "View project" link from tables. We made the school or academy's name the link to open the project.

The MOJ design system uses this pattern for tables with large number of columns.

A table using the Ministry of Justice table pattern structure to link to a project directly from the school name

Testing changes with users

While this link is not descriptive of the thing that will happen, it has tested well with users.

They understand what links look like and think about projects in terms of the name of the school.

Seeing a school name as a link, they instinctively made the association that using that link would open the project.

What we'll do next

We plan to roll this pattern out across other tables in the Complete conversions, transfers and changes.

We will continue to check for and listen to user feedback on this and iterate the design as that guides us.

Share this page

Tags

Content design Interaction design