Links

It's important that people understand what will happen when they use a link.

Ensure the purpose of each link is clear from the link text alone or surrounding context.

Example of link text that makes sense in isolation: Find Ipswich bus timetables on Suffolk Onboard.

Example of link text that makes sense in context: "Facebook page" as link text in a councillor page list titled 'My links'.

Set internal links to open in the same browser tab and external links to open in a new tab.

Link practices to avoid

Do not use generic link text like "click here" which relies on surrounding context if descriptive link text could be used instead. Avoid forcing users work harder to understand a link's purpose.

Avoid using a website URL as link text unless the website is better known by its domain, for example GOV.UK. (If using a website URL as link text do not include the https or www prefix.)

Do not use a webpage URL as link text, for example suffolk.gov.uk/about/contact-us/contacting-customer-services. Use descriptive link text instead, such as "contact customer services".

Do not use the same link text for different destinations. For example, "Download" used multiple times on a page linking to different documents.

Do not link headings.

Documents

How to publish information

Publish information as website content (HTML) rather than files (such as PDFs) wherever possible.

This is because PDFs:

do not change size to fit a web browser
are not designed for reading on screens
don't allow us to track how people use them offline
can be hard for some people to access
are harder to keep up to date

More information: Why GOV.UK content should be published in HTML and not PDF

'Open' versus 'closed' file formats

Avoid using document formats such as .docx or .xlsx where possible. These are ‘closed’ formats, which means they can’t be opened and edited in all software applications.

Use .doc or .csv instead, which are open formats.

Document file names

Give all files you upload a meaningful file name. Do not use vague file names, for example, v62.pdf or application-form.pdf.

A good file name will make sense to the user if they find it in their download folder. It also makes it easier to analyse data in Google Analytics.

The file name should:

be written entirely in lowercase
use hyphens or underscores instead of spaces
make sense out of context, for example, v62-application-vehicle-registration-certificate.pdf

The file name should not include:

a version number, ‘draft’, ‘clean’ or ‘final’, unless those words are part of the document title
a date, unless the date is part of the document title, for example, a business plan for 2023 to 2024

Document file size

The maximum file size for suffolk.gov.uk is 5MB. You should aim for your file to be less than 2MB if possible.

There are many free online tools that can shrink your file size.

Formatting your document link

Use the document publishing format: 'Linked file name (file type, file size)'.

For instance: Example document (Word, 12KB).

If your document is not accessible

Add this messaging near to the document: 'This file may not be suitable for users of assistive technology. Request an accessible format.'

You can read the guidelines section on accessibility to make your documents more inclusive.

Images

Types of image

There are three main types of image:

informative - which help to explain something visually
decorative - to improve the look and feel of the page
functional - for a user action, such as a print icon or 'start' button

How to use images

Use images to inform the user.

Avoid using images for decoration (some exceptions apply).

informative example: an image showing pothole depth is informative, as it can help explain what a dangerous pothole looks like
decorative example: an image of children in a classroom on a school term dates page is decorative, as it does not help explain anything

Functional images like buttons and navigation tiles should be added to a page using CMS features, not by inserting an image file.

Do not use images generated by AI.

Adding a description to your image

Add alternative text (alt text) description to your image. This tells people with screen readers what the image shows. It'll also help people find your page through search engine image results.

For example, 'A dangerous pothole with a depth of X centimetres' is good alt text for an informative image.

You don't need to start the alt text with 'Image of...' as screen readers will announce that it's an image before reading out the alt text.

Image practices to avoid

Do not link images, for example, an image of another website to take the user to that site.

Do not publish images containing text (except logos). This can be hard to read and makes the information inaccessible to screen readers and search engines.

Uploading and adding images to a page

Images uploaded to suffolk.gov.uk should be:

a JPG or PNG file format
maximum 1200px wide
less than 1MB file size

Before uploading or adding an image, search the image library before adding a duplicate. If you need a particular image which is not already uploaded, contact the CDT.

Videos

You can embed YouTube videos on suffolk.gov.uk using the Video Embed component.

Your video (if prerecorded) should include closed captions (CC) for things like dialogue and sound effects. It may also require audio description (AD) if there's visual information not described in the main audio track.

It's best practice to also provide a version of your video that includes British Sign Language (BSL) interpretation, but this may not always be practical.

Live video including CC, AD and BSL is best practice, but not always practical and not mandatory on suffolk.gov.uk.