Images

Guidance for GOV.UK content publishers on how to use images and make them accessible. This chapter also includes the copyright standards for GOV.UK.

If you work on a service team, read image guidance for designing online services.

To find out how to upload images on GOV.UK read Images and videos in the How to publish manual.

Types of images

Images in GOV.UK can be broken down into three categories:

  • informative
  • decorative
  • charts, diagrams, infographics and scientific equations

Using informative and decorative images on GOV.UK

Informative images

Do not use images alone to provide information. This will exclude users who cannot see or access the image.

Text is easier to read than images when scaled up by people using screen magnifiers. Images may become pixelated and need to be scrolled vertically and horizontally when zoomed in.

Only use images if they help users understand information in a different way.

Avoid images with text. Write it in the body text.

Informative images can help users understand the written text in a different way. You must leave the ‘Alt text’ field empty and write a description in the body of content. This means the description is available to everyone.

Screen reading software will ignore images without alt text. If you can, describe the content of the image as though there is no image on the page. For example, write “the minister tweeted…”, instead of “an image of a tweet by the minister”.

Another way to make sure you are describing the image properly is to imagine that you’re reading out the content of the page on a telephone. When you get to the image, what would you say to help the listener understand the point the page is making?

When using photos or logos, use simple images that can be explained easily with text.

You can use the caption and credit field to name a person in an image.

Decorative images

Decorative images are generic images which do not give any additional information to the content. For example, an image of laptops in a blog post, or featured content on departments’ organisation pages.

You do not need alt text for decorative images.

Charts, diagrams, infographics and scientific equations

Format

Check the examples of tables and charts you can create using Govspeak on GOV.UK.

If you cannot create your chart in Govspeak, you may need to upload it as an image. Upload the image in SVG (scaleable vector graphic) format. SVGs allow users to magnify images without losing any quality. Find out how to create an SVG file in the images guidance.

Colours

Do not use colour alone to convey information. Some visually impaired users will not be able to see colour differences. Ensure there is a high enough colour contrast ratio between segments, lines, text and background colour.

Read more about using colours in charts on the Government Analysis Function website.

Charts

All charts should have two titles, a headline title and a statistical title. The headline title of the chart should summarise the main message of the chart. This should be followed by a statistical title that describes the data shown.

Example

The headline title: Oliver stays on top of baby names list

The statistical title: Figure 1: Number of baby boys given the top 10 most popular names, England, 2020

Charts as images

If you provide your chart as an image, the alt text field for the chart should be left blank. Instead, the chart should be followed by at least one of the following:

  • a description of the chart directly under it
  • a table of the raw data
  • a link to the raw data in an accessible file

If you write a description, imagine you are describing the chart to someone over the phone. Avoid describing the chart vaguely or too broadly. For example “The bar chart shows EU funds by percentage on the vertical axis and EU countries on the horizontal axis” is too broad.

You need to explain what is happening in the data and any important trends. Do not just repeat the headline title, for most charts, the description will need to be more detailed than the title.

If you choose to provide the raw data as a table or in an accessible file in GOV.UK, make sure your table is formatted correctly and consider if it is an appropriate alternative. For example, when you have a chart showing a long time series of data, a description of the trends will be more appropriate than a table. The experience should be the same as looking at the chart.

Guidance from the Government Analysis Function

Read guidance from the Government Analysis Function about:

Diagrams

Only use a diagram if it makes the content clearer, or summarises a large amount of information.

Diagrams need to be clear and easy to understand. Follow the government design principles, for example by sticking to one idea per diagram.

When you’re creating the diagram, try to:

  • follow normal reading direction - users want to read from left to right
  • avoid overlapping connector lines
  • use simple shapes - and as few different types as possible
  • make it clear where the starting point is for process and flow charts
  • use black and white as a default

Include a detailed explanation of the processes and relationships explained in the diagram in the body text. This is helpful for users who cannot see the diagram.

Leave the ‘Alt text’ field empty.

Infographics

An infographic is an image which usually displays data, graphs, charts or text to explain a complex process or overview of a subject.

Infographics can be hard to make accessible if they’re too complicated. This is because screen magnifier users may need to scroll horizontally and vertically across the image. This may make them hard to understand when not seen all at once. It can also be difficult to describe in text. The image may also become blurred and pixelated when magnified if you’re not using an SVG format.

If you choose to publish an infographic you should provide a plain text version of the content. This should explain everything that is shown in the infographic and be in the body text next to the infographic.

Read more about creating accessible infographics in the infographics guidance on the Government Analysis Function website.

Scientific equations

Describe the equation in the body text and leave the ‘Alt text’ field blank.

Image copyright standards

These copyright standards apply to all images on GOV.UK, including those within a publication.

If possible choose images that are free to use. These will usually be either:

If you want to change the image, such as by cropping it or changing the colours, check that the licence you’re using allows for adaptations or derivatives. For example, some Creative Commons licences have a ‘no derivatives’ (ND) rule.

Paying for third party images

If you pay to use third party images you must:

  1. Buy the right type of licence.

  2. Accredit the image properly.

Buying the right licence

Content on all government websites will be permanently available on the UK Government Web Archive. If you’re using an image which is not covered by crown copyright you must:

  • get worldwide rights
  • get the rights to use the image forever (in perpetuity)
  • get the rights to use the image on anything
  • agree the fee

Image licences must not:

  • be for a limited time period
  • be based on page impressions

Do not use embedded images that remain under the control of the supplier.

Image credits

Always attribute images to their source, unless it’s an Open Government Licence (OGL) image. OGL images are covered by the statement at the foot of GOV.UK pages:‘Open Government Licence v3.0’.

Credit Creative Commons images and all third party images. State if the image cannot be reused for free.

Find out where to credit your image and how.

Using images of people

Check with the copyright holder if the people in the image are happy for you to use it.

Get written consent from people if you’re arranging the photography yourself.

Think about the context: avoid showing identifiable people in connection with things that may cause offence.