Users Scan Before Reading
Most visual users quickly scan content pages and often their visual focus is primarily on the links (things they can do). Some people (e.g. Screen reader users) similarly scan pages by tabbing through from one link to the next or by listing just the links.
It is important that links have inherent and sensible meaning to support this scanning behaviour. You should not force your audience to read all the surrounding words if you could convey the essential information in the link itself.
Links in Content
It’s more efficient to highlight keywords in your text, rather than using words like “read more” or “click here” as links to other pages. It’s generally more efficient to embed a link within a sentence than to provide a description of a link with a click here link. Keyword links are also more explicit about where the link is taking the user.
Tip: Copy out just the links from your page. Can you distinguish between them? Can you predict the result of clicking on each of them? If not, change them.
Tip: Insert a link onto telephone numbers so that users on their phone can ring directly via the link. To do this highlight the number and when inserting a link include tel: at the beginning of the URL. An example would be tel:00123456789 and the text to display could be Tel: 00 1234 56789.
Top Tips
- Avoid 'click here' type terminology:
- Do not use 'click here', 'more', 'full information', 'pdf', 'file', etc;
- Each link should clearly indicate its destination or function, out of context of the text surrounding it;
- Each link should be distinct from others in the page
- Examples:
- DON'T: “To read the chairman’s annual report for 2022, click here.”
- DO: “Read about the Chairman’s annual report for 2022 [pdf].
Poor: to go to the location map, click here. GOOD: Go to the Location map for directions
- Links should be short, but descriptive:
- Don't link whole paragraphs
- Avoid unnecessary words:
- 'link to...', 'click to...' etc. is unnecessary it should be obvious that a link is a link.
- Provide useful information about the link:
- e.g. the file format, the size of a download, notification of an external site, notification of a pop-up window;
- This information is useful to provide in the link itself but sometimes, to assist with reading of the links, it may be more sensible to include the information next to the link
- Separate adjacent links with a non-link printable character:
- 'link | link2' or '[link] [link 2]' is standard:
- This was a particular requirement for some older adaptive technologies - not as important now but still worth doing.
- Lists of links should be presented as lists (e.g. bullet points or numbered lists):
- This avoids confusion caused by links wrapping over multiple lines where it may be unclear whether they are single links or multiple separate links;
- This also has other benefits - the correct coding of lists passes extra useful information to screen reader users - make sure you specify to your developer that you want them coded as real lists.
