Cookies on ons.gov.uk

Cookies are small files stored on your device when you visit a website. We use some essential cookies to make this website work.

We would like to set additional cookies to remember your settings and understand how you use the site. This helps us to improve our services.

You have accepted all additional cookies. You have rejected all additional cookies. You can change your cookie preferences at any time.

Skip to main content

For everyone Survey material design

Overview

The Office for National Statistics (ONS) collects data through large-scale business and voluntary social surveys.

Read more about our specific studies on the ONS website (opens in a new tab) 

Accompanying printed material is given to participants, whether they complete online or paper surveys.

It is very important to set the right tone with the content and design of the accompanying material, to encourage participants to complete the survey.

Designing survey materials

All survey guidance has been created in partnership with the ONS Social Surveys Transformation team. It is based on user research conducted by ONS, or best practices advised by GOV.UK.

We can produce various materials to support a survey or contact letter, including booklets, leaflets, and postcards.

To request a survey letter, survey suite or supporting material, submit a design request form to the Design team (opens in a new tab) 

Text

Survey materials should:

  • use Open Sans with “stylistic set 1” turned on in the Opentype options to use the more accessible “g” and “I”
  • have a minimum font size of 12 points, except accessibility statements which should have a minimum font size of 14 points
  • use font size and weight to create hierarchy between headers, subheadings and paragraphs
  • have left aligned paragraph text , do not justify text as this is hard to read
  • use bold or semibold for phone numbers, emails and URLs
  • never rely on colour alone to highlight important bits of content; in this case, use bold to create hierarchy.
  • never use italics, underlining or capitalisation

There is further guidance available on designing online survey materials on the Government Analysis Function website (opens in a new tab) 

There is more information for designing printed documents available in our typography guidance.

Icons and illustration

Icons cannot convey information alone, so should only be used to accompany a clear text description.

We can use icons to break up text and highlight content, such as hyperlinks, phone numbers and important additional information.

There is further guidance available on how to use icons.

You can also find out how we can improve leaflets and supporting materials by using illustrations.

Colour

The majority of ONS surveys are designed using “Night blue”, the standard support colour from our brand colours.

Census 2021 and surveys created in collaboration with external agencies have their own colour palettes, separate to our brand colours.

For text, we use pure black with a 95% tint as this helps reduce glare.

We avoid using large-scale gradients, such as a whole page, as not all ONS surveys are printed in-house.

Brand details

Callout bar

We use a callout bar to highlight the important information in a survey letter. To create this:

  • use a gradient or solid colour for the 5 millimetre (mm) bar at the side of the callout bar (with 3mm bleed)
  • use a 10% tint of this colour for the callout bar
  • bleed the bar to the edge of the page, research shows users find it makes the letter look more official

The simplified version of the callout bar is a white box with a dotted 3 pixel border.

An example of a portrait A4 survey letter with a shaded callout bar highlighting important content.
Example of callout bar highlighting important content

Step-by-steps

Step-by-steps are used for giving instructions and it is important to number the steps in the order we need users to read them.

When creating step-by-steps:

  • dotted lines are used to guide users through the steps
  • numbers are always placed inside white circles with solid borders
  • icons can be used as supporting images if needed – these must always be after the text when in action steps
  • we can also use the steps to show alternate forms such as A, B or C
  • steps can be included outside of the callout bar
An example of a portrait A4 survey letter giving instructions through a step-by-step process.
Example of step-by-step process with supporting icons

Help improve this page

Let us know how we could improve this page, or share your user research findings. Discuss this page on GitHub (opens in a new tab)