Hyperlinks: Make links clear and useful
Accessible hyperlinks tell people exactly what they will get, where they will go, save time, reduce confusion, and help people decide if they should select it, or not. Accessible hyperlinks also help users scan a list all links on a page at one time.
How to create accessible hyperlinks
- When writing links, use short, descriptive text that names the action or destination page title. For example, "Apply for travel reimbursement" tells users exactly what will happen when they follow the link. Avoid vague phrases like "click here", "read more".
- Put the link on the words that matter, not on a whole sentence. This approach improves scannability and makes it easier for screen reader users to navigate. If the link opens a file, mention this when it helps users make decisions, such as "Quarterly results (PDF)" or "Budget template (Excel, 125 KB)".
- When you have several similar links, make each one specific to avoid confusion. Instead of multiple "Read more" links, use descriptive text like "Benefits overview" and "Benefits eligibility dates". This specificity helps all users, especially those using assistive technology.
Context and placement
- Place links close to the information they relate to. If you need to explain why a link is useful, add a short line before the link rather than relying on visual cues.
- Avoid writing "the link on the right" or other directional references that don't work for all users.
- For file downloads, use clear file names and link text so people know what they're getting. Mention the file type and size when it could affect someone's choice to download.
- Share the main location: When possible, share the main, up-to-date location rather than copies that may become outdated.
Testing your links
To verify your links work well for everyone, try these simple checks:
- Read links aloud: Go through each link on the page individually. Do they make sense without the surrounding text?
- Test keyboard navigation: Use the Tab key to move through links. Is the order logical? Can you clearly see which link has focus?
- Check visual contrast: Ensure links are easy to distinguish from body text, even in black and white.
Special considerations
Other types of links
- For email links, use descriptive text like "Contact support team" rather than displaying the raw email address.
- For telephone links: Include context about the purpose: "Call customer service: 1-800-555-0123". Link the entire phrase, not just the number, to provide better context for screen reader users.
Standards and resources
- CAN/ASC – EN 301 549:2024 Accessibility requirements for ICT products and services: Official publication
- BATI/ITAO Accessible Documents resources: Accessible documents