Why this matters
Screen reader users often navigate by listing all links on a page. If your links say 'click here', 'read more', or nothing at all, users have no idea where they go. Descriptive link text also helps Google understand your page structure.
Code examples
✗ Incorrect — fails WCAG
<a href="/contact"><i class="fas fa-envelope"></i></a> <a href="/report">Click here</a> <a href="/blog">Read more</a>
✓ Correct — passes WCAG
<a href="/contact" aria-label="Contact us by email"> <i class="fas fa-envelope" aria-hidden="true"></i> </a> <a href="/report">Download accessibility report</a> <a href="/blog" aria-label="Read more about WCAG 2.2 updates">Read more</a>
How to fix it — step by step
- 1Make sure every link has visible text that describes its destination
- 2For icon-only links, add aria-label='description' to the <a> element
- 3Add aria-hidden='true' to decorative icons inside links so screen readers skip them
- 4Replace vague text like 'click here' or 'read more' with descriptive text
- 5For image links, add alt text to the image that describes the link destination
- 6Never leave a link completely empty — it traps keyboard users
Reference: WCAG 2.2 Success Criterion 2.4.4 (Level AA)
Test it for free
Use WebPossum to automatically detect this violation and every other WCAG 2.2 issue on your site. Free, instant, no signup required.