Ensure links have descriptive accessible names
Content available in English only.
Accessibility isn't just about avoiding violations — it's about ensuring that everyone can use your product with confidence. This guide explains each rule's intent, highlights common issues, and shows how to fix them according to WCAG and the European Accessibility Act (EAA).
These guidelines do not replace the official WCAG standards. They’re concise, developer-focused notes to help you identify and fix issues effectively.
A link must make sense on its own — no guessing required.
Overview
Why this matters
Assistive technology users often navigate by link lists outside of surrounding paragraph context. Generic link text forces guesswork and slows navigation because destination intent is unclear.
How to fix this issue
Write link text that identifies the destination or action. If design requires repeated short text such as 'Read more', provide a unique accessible name per link with `aria-label` or `aria-labelledby`.
Developer Guidance
Audit repeated link patterns in cards, tables, and search results. Avoid shipping collections where many links share identical accessible names but go to different URLs. Prefer explicit visible text; use ARIA naming only when the visual label must remain short for layout reasons.
Code Examples
Incorrect Implementation
<a href="/reports/q2">Read more</a>Correct Implementation
<a href="/reports/q2">Read Q2 accessibility report</a>Real-World Implementation
Before
<ul>
<li><a href="/posts/1">Read more</a></li>
<li><a href="/posts/2">Read more</a></li>
<li><a href="/posts/3">Read more</a></li>
</ul>
<!-- Links list is ambiguous -->After
<ul>
<li><a href="/posts/1">Read: Keyboard testing checklist</a></li>
<li><a href="/posts/2">Read: Color contrast pitfalls</a></li>
<li><a href="/posts/3">Read: ARIA naming patterns</a></li>
</ul>CSS Example (Guidance)
a:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.card a {
text-decoration: underline;
}Manual Testing
- 1. Open any screen reader link list view (NVDA Insert+F7, VoiceOver rotor, TalkBack links granularity).
- 2. Verify each link name is meaningful without needing surrounding text.
- 3. Check repeated UI patterns (cards/list rows) for duplicate vague names like 'Read more'.
- 4. Confirm links with identical names point to the same purpose; otherwise rename them.
- 5. Tab through links and ensure visible focus remains clear while labels stay descriptive.
Related Operable Rules
Trusted by organizations across Europe working toward WCAG and EAA conformance