Links

Content guidelines

If you add a link, consider the user's onward journey. Sometimes links can distract the user from their core task meaning they may not return.

Use links to:

• help users get to where they need to go
• avoid duplicating information that exists elsewhere
• link to an authority on a subject

Link text must:

• not use vague terms, for example 'click here' or 'more information'
• describe the page it goes to, for example 'Co-op digital accessibility standards'
• make sense when read out of context – screen readers can read link text in isolation without the surrounding content
• reflect what the user will see when they get to the page
• be at the end, not the middle of a sentence – this makes it easier for people to scan

If the link is to an action:

• include the action at the start of the link, for example, ‘book an appointment’
• make the text between 2 and 4 words where possible – this can make the action quicker to understand
• consider using a button if the action is the main thing you want someone to do on a page

Regularly review the links you use and remove or update any that are out-of-date or no longer work.

Linking to other websites

You might need, or want, to link to other websites that are not owned by Co-op (external websites). Any external websites you link to must be:

• high quality
• relevant
• trustworthy

If they're not, it could damage Co-op's reputation.

If you're linking to an external site tell the user that they’re leaving our site, for example, ‘For more information visit citizensadvice.org.uk'.

If it’s a short URL (web address) – that is it contains no symbols and has a maximum of one ‘/' – use a full URL, for example 'For more information, go to bbc.co.uk/sport’. This means that people could remember it, or write it down, if they wanted to visit the site later.

If it’s a complex URL – that is it contains symbols or more than one ‘/' – use words as the link text, for example, ‘See the Content Design London Readability guidelines on links’.

Opening links

Links should usually be set to open in the same tab, so that people can use the 'back' button to navigate.

If you think the link should open in a new tab, include ‘(opens in a new tab)' as part of the link. For example, you can set a link to open in a different tab so that someone does not lose their progress in a form.

Design guidelines

Links should have the correct colour contrast. To see the colours we use for links, go to the guidelines on colours.

Underline

In general, links should be underlined. The underline should disappear when the user hovers their cursor over it.

You do not need to underline a link if:

• there’s another visual cue that indicates that it’s a link, for example the arrow icon
• it’s in context, for example within a header or footer

Focus ring

The focus ring appears as a purple outline around any object, including links, when someone selects it.

Do not remove the focus ring. Some people who use assistive technology need it to navigate our products and services.

SEO guidelines

Using relevant links in your content can help it to appear higher up in search results (known as search engine optimisation or SEO).

See how you can use links to help SEO.