Link purpose: accessibility for web writers, part 9

Write links that clearly describe their purpose or content. Meaningful links make content more usable. They usually stand out on a web page (as they’re a different colour and underlined), so anyone who can see the page can scan it and identify the linked content. Search engine optimisation experts tell us that meaningful links can improve search ranking, making content easier for users to find.

Meaningful links are vital for making content more accessible to people with disabilities.

A series of 'read more' links can create usability and accessibility problems

  Meaningful links help users with disabilities

• Vision impaired users who use screen reading software to listen to a web page can ‘scan’ a page by jumping from link to link. They can also open up a list of links on the page and use that to decide how to move forward. Well written links will help these users navigate with confidence and efficiency
• People with limited vision may use screen magnifier software. If a link is clearly described, they will not have to scroll around text near the link to figure out where it leads. This will save them time and effort, and reduce the chance of them clicking on links that are not relevant
• Users with reading or cognitive limitations can be confused or distracted by bland or ambiguous links. Meaningful links will reduce these problems and save time that would otherwise be lost by following irrelevant links
• People with mobility impairments who cannot use or control a mouse may have to expend a lot of energy to move through a page. Following misleading links can cause fatigue. Well-written links will limit this.

'Click here' links shown in a screen reader's links list

Tips for better links

• Clearly describe the content or function of the link. Avoid using ‘click here’, ‘read more’ and other ambiguous labels
• Use meaningful words, particularly keywords (terms users are likely to search with) as these will act as trigger words, drawing users’ attention to the link. Using keywords will also improve search rankings
• Place keywords as close to the start of the link as possible. This aids scan reading and screen reader users, who often only read the first word or two in a link
• Avoid using URLs as links. URLs can be ambiguous or difficult for some users to understand. For links to email addresses, use the email address as the link text. This makes the link purpose obvious and allows users to cut and paste email addresses into web mail clients
• Avoid using the same link text for links that lead to different places unless doing so would clutter the visual design (For instance, a hotel booking site may show a list of hotels in an area. Each has a link to a map, photos, rooms, features, and so on. Distinguishing each of those by adding the hotel name may create visual clutter. Instead, you could add some distinguishing words that are hidden from the visual display. See the Web Content Accessibility Guidelines, technique C7: Using CSS to hide a portion of the link text)
• Keep links concise while including enough information to allow users to identify the linked resource
• Position links carefully within content. Links embedded in paragraphs can be a distraction from content that users may need to read. They may also end up wrapping to another line, making link fragments hard to scan-read
• Warn users, within the link, when links will open documents (PDF, Word and so on). Include the document type and size within the link
• Avoid opening links in new windows, except for documents and help text. Warn users within the link when help text will open in a new window
• Don’t link just because you can. Only include links that are directly relevant to the tasks users may be doing. If you must include links to sources, do so at the end of the content

Web Content Accessibility Guidelines references

• Link purpose (in context): understanding success criterion 2.4.4
• Link purpose (link only): understanding success criterion 2.4.9
• C7: Using CSS to hide a portion of the link text

Earlier articles in this series

• Introduction: accessibility for web writers, part 1
• Text alternatives for images: accessibility for web writers, part 2
• Info and relationships: accessibility for web writers, part 3
• Sensory characteristics: accessibility for web writers, part 4
• Colour: accessibility for web writers, part 5
• Contrast: accessibility for web writers, part 6
• Images of text: accessibility for web writers, part 7
• Page titles: accessibility for web writers, part 8

You can subscribe to any comments to this entry via RSS 2.0. Both comments and pings are currently closed.