Writing accessible web content

Hyperlinks on the web

Use descriptive and meaningful link text so users can understand what your links are about.

What links and link text do

Links, or hyperlinks, are selectable text that take you to another place, website or digital format. Their purpose is to let you know what you'll find on the other side of a link.

Web developers may sometimes design accessible images or buttons to work as a link. But for most web content, you should write and present links as selectable text.

Link text is usually a different colour to normal text and underlined.

You can create links to:

an internal page within our website
an external website, like a government resource, trusted organisation or approved third party application
a different digital format like a PDF, video or online form
to an email address

Links work best when written as descriptive and meaningful text.

Give link text enough context

Users must be able to understand what each link will do. Poorly written links can confuse and disorient users, especially those using assistive technology.

Link purpose (link only)

The most accessible links are those where the link's purpose is clear without the nearby text. This helps everyone understand links quicker, especially those with:

visual limitations or who use screen readers because they can list links (out of the page's context) and still be able understand what they are about
cognitive limitations who might become disoriented or frustrated by extra navigation to and from unneeded content
motor impairments because they can skip unneeded web pages, avoiding the keystrokes needed to visit a link and return

For example, consider the following sentence:

'The government has created this guidance on writing good link text (GOV.UK).'

If you read only the link text (out of sentence context), it reads:

'guidance on writing good link text (GOV.UK)'

The link could also be written like this:

'The government has created guidance on writing good link text on the GOV.UK website.'

The link text, on it's own, tells what the page is about and who wrote the guidance.

This is the most accessible way to present links because it helps everybody understand links quicker.

Link purpose (in context)

A less accessible way to present links puts the links main purpose outside the link text. For example, in the text immediately preceding the link.

Web developers may also sometimes add an 'aria' label in a website's code to make links clearer only to assistive technologies like screen readers.

Where possible, try to avoid presenting links this way in web content. It helps less people.

Aim to make your link's purpose clear within the link text (outside of its surrounding context).

Let people know what a link will do

Let people know what will happen or where they will go when selecting a link. Make it clear if a link goes to:

content from an outside source, like (GOV.UK)
a system that's different to a standard web page, like [Microsoft Forms]
a different content format, like a [PDF] or other document file
non-text content, like a [YouTube] video or [SoundCloud] audio podcast
content with barriers to access, like [requires a login]
an email address which can open an application the user does not want to use

You may have to restructure or reword content which contains links to better meet these recommendations.

Different websites or council systems

We recommend you use (curved brackets) to identify websites or council systems that are external to where your main web page content is.

Do not use for internal links, unless it's unclear. For example, avoid (Nottinghamshire County Council) if it's clear to the user they are already on our website.

Do not use web addresses in text links, use the organisation's brand name instead.

Sometimes, though, they can be similar. For example, the URL for the government's website is 'www.gov.uk', but the government's brand name for the website is GOV.UK (all upper case).

A link to GOV.UK could be displayed like this:

Read more about writing good link text (GOV.UK)
The government has created guidance you can read on writing good link text (GOV.UK)

You do not need to use curved brackets if the owner is clear in the link's structure. For example, 'Read GOV.UK's guidance on writing good link text.'

Barriers to access

We recommend you use [square brackets] within the link text to identify potential barriers to accessing a link.

Examples include:

document or image file types: [Word], [PDF], [Excel], [JPG] or [PNG]
time-based media formats, including their lengths if needed (rounded to the nearest minute): [YouTube, 12 minutes], [SoundCloud]
very large file sizes - for example 'Download the concert event promotional pack [Word, 10MB]'
other barriers to access like [opens in new tab] or [requires login] - for example, "While reviewing our development plan, please fill out our feedback survey [opens new tab]."

Link writing tips

Writing good links takes practice and judgement. Here's what we can recommend to help.

Writing link text

When writing link text, do:

be descriptive and accurate - consider when to use the page or document title
'front-load' most important words, for example, 'Before you arrive at a recycling centre, check what you can recycle'
start with an active verb for an action, like ‘‘Apply for or renew a Blue Badge’
use neutral terms like 'select', 'read', 'go to', or ‘visit’
use sentence case, not title case (except for proper nouns) - 'This is sentence case' and 'This is Title Case'
try to link to a page a document is on, not the document itself, like for documents in our Policy Library or for those hosted on external websites
link emails like 'departmetname@nottscc.gov.uk' because they are usually short and descriptive

Do not:

use unhelpful link text like 'click here', 'read more' or the word 'link'
have links with the same text on a page go to two different places - for example, repeating ‘Book this course’ on a page with different booking dates
have links with the same destination on a page have different text
use links longer than a sentence or very short 1 or 2 character links
describe actions users cannot perform - mobile users do not 'click'
copy and paste full URLs with 'http:' as link text

Using a URL as link text

Avoid using a URL as link text unless there is a real user need. They are long, can contain special characters and are not screen reader friendly.

For example, you may need to use a URL in document content meant for both print and online reading, like:

alongside a QR code image
in an easy read document

If you use a URL as a link, make it short and meaningful with no special characters, 'https://' or long paths.

For example, 'www.nottinghamshire.gov.uk/recyclingcentres'.

Contact the Communications team before setting up a short URL.

Positioning links in content

When positioning links in content, do:

put links in context at the point in the text where it's most useful
aim for an uninterrupted flow of reading by putting links at the end of a sentence or on a new line if it makes better sense

Do not:

have mid-sentence or mid paragraph links if it makes your text harder to read
place links next to each other in a sentence - they can be harder to select on mobile devices or for people with motor difficulties
repeatedly present a link every time it's mentioned on a page - position it only where it's most useful
put links in document titles, page summaries, headings or subheadings
put all links together at the bottom of the page

Link text examples

Link text for an internal website

Good: 'Find out more about how to the council works.'

Good: 'Find out more about how to the council works.'

Bad: 'Find out more about how to the council works by clicking this link'

Link text for an external website

Good: 'The government has created this guidance on writing good link text (GOV.UK).'

Good: 'The government has created this guidance on writing good link text on the GOV.UK website.'

Bad: 'The government has created this guidance on their website about writing good link text.'

Bad: 'The government has created guidance on their website about writing good link text. Click here to learn more.'

Document file links

Good: 'You can download and print a paper short breaks application [PDF].'

Bad: 'You can download and print a paper short breaks application.'

Bad: 'You can print a paper short breaks application by downloading this PDF.'

Call to action link text

Good: 'Before you arrive at the recycling centre, check what you can recycle.'

Bad: 'Before you arrive at the recycling centre, check what you can recycle.'

Content structure using links

Good: 'Digitally accessibility helps people with colour vision deficiency, blindness and vision loss, hearing loss, Dyslexia and Autism. Find out more about these conditions on the NHS's list of conditions.'

Good:

'Digital accessibility helps people with:

- - colour vision deficiency
  - blindness and vision loss
  - hearing loss
  - Dyslexia
  - Autism

To find out more about these conditions, go to the NHS's list of conditions'

Bad: 'Find out more about colour vision deficiency, blindness and vision loss, hearing loss, Autism and Dyslexia on the NHS website's list of conditions.'

Pasting URLs from Microsoft Edge browser

Sometimes when you copy and paste a URL from a browser like Microsoft Edge, it displays as descriptive link text by default. Make sure you check and alter this text so it follows our recommendations.

For example, consider this link pasted from Edge: 'How to write hyperlink text for better web accessibility (scope.org.uk)'

While descriptive, we recommend you edit the link text so the website name is replaced with the brand name, like 'How to write hyperlink text for better web accessibility (Scope for business)'

Learn more about URL copy and paste in Microsoft Edge (Microsoft Support)

Broken or outdated links on council managed websites

Check links regularly to make sure they are not broken or out of date.

If you work for the council, report a broken or outdated link using a website change request (for council staff only). If you do not own the content where the link sits, let us know so we can contact the correct team to fix it.

If you are an external partner or a member of the public and would like to report a broken link on our website, contact the Customer Service Centre.

It will help if you let us know URL of the page you found the broken link on.