When we write links on a web page, we rarely think about how a visually impaired person who navigates with a screen reader interprets them. Phrases like “click here” or “more information” may seem harmless, but for many people they represent a barrier.
In this article you will learn how to write accessible, descriptive and understandable links, aligned with the web accessibility guidelines (WCAG) and with good practices of UX Writing.
How does a screen reader navigate links?
Users of screen readers—such as JAWS, NVDA, or VoiceOver—can access a list of all links on a page, without context. In that list, only the anchor text of each link is read.
What if everyone says “click here”?
Exactly: there is no way to know where they lead. For example:
- “Click here”
- “More info”
- “See more”
Thus it is impossible to understand the purpose of the links. This breaks with WCAG criterion 2.4.4, which states that the purpose of each link must be determinable from its text, alone or in conjunction with its immediate context.
Why is “click here” a bad practice?
- It is not descriptive: It does not indicate where the link leads.
- Depends on the visual context: People without vision cannot “see” what surrounds the link.
- Problematic for keyboard or touch screen navigation: The term “click” is mouse-specific.
- Does not help SEO or quick scanning of content.
- Reduces the overall usability and accessibility of the site.
In short: it is an obsolete and inclusively exclusive practice.
So… How to write accessible links?
The general rule is simple:
The link text should clearly describe the destination or expected action.
Some key tips:
- Use active and precise verbs.
- Do not repeat the URL as link text.
- Avoid generic phrases like “here”, “this”, “read more”.
- If the link is inside an image or button, add a descriptive alt or aria-label attribute.
Before and After: Examples of Accessible Links
| BEFORE (NOT ACCESSIBLE) | AFTER (ACCESSIBLE) |
|---|---|
| Click here | Download the complete web accessibility guide |
| More information | Learn how a screen reader works |
| Read this | See the official WCAG guidelines |
| Watch video | Watch the video on inclusive design |
| This may interest you | Discover good practices for accessible links |
Pro Tip: What if the link is in an image or button?
- When you use an image as a link, you need to make sure the alt attribute describes the action. For example:
- If you are using a button (for example, in React or with JavaScript), you can use aria-label:
Thus, a screen reader will read what it should, not simply “image”, “button”, or worse yet: nothing.
Recommended Resources
- WCAG 2.4.4 Documentation – Link Purpose (in context)
- WAVE extension to audit web accessibility
- WebAIM Accessibility Guide
- axe DevTools for Chrome and Firefox
Final Good Practices for Accessible Web Links
- Check your links with screen readers or tools like WAVE.
- Make sure all links have clear purpose taken out of context.
- If you use serial links (for example, in lists), vary the anchor text.
- Integrate the links naturally in the writing (not at the end like “read more”).
- Add semantic links in HTML () and not with simulated
or .
