2.4.4 Link Purpose (In Context)

Level: A | Principle: Operable | Since: WCAG 2.0 | Automation: Partial (axe-core)


What This Means

The purpose of every link must be clear from its link text alone, or from the link text combined with its surrounding context (the sentence, paragraph, or list item it's in). Users must know where a link goes before clicking it.

Who This Affects

  1. Screen reader users — they often navigate by listing all links on a page. "Click here" repeated 10 times is useless.
  2. Cognitive disability users — vague link text increases confusion
  3. Everyone — descriptive links are better UX for all users

Common Pitfalls

1. Empty links

<!-- Bad: link with no text at all -->
<a href="/contact"></a>

<!-- Good -->
<a href="/contact">Contact us</a>

2. "Click here" and "Read more"

<!-- Bad -->
<p>To learn about pricing, <a href="/pricing">click here</a>.</p>

<!-- Good -->
<p><a href="/pricing">View our pricing plans</a>.</p>

3. Image links without alt text

<!-- Bad: image is the only content, no alt -->
<a href="/home"><img src="logo.png"></a>

<!-- Good -->
<a href="/home"><img src="logo.png" alt="Home"></a>

4. Icon-only links

<!-- Bad -->
<a href="/settings"><svg><!-- gear icon --></svg></a>

<!-- Good -->
<a href="/settings" aria-label="Settings">
  <svg aria-hidden="true"><!-- gear icon --></svg>
</a>

How to Fix

Descriptive link text

<!-- Good: link text describes the destination -->
<a href="/annual-report">Download the 2026 annual report (PDF, 2.4MB)</a>

Image links

<!-- Good: alt text serves as the link text -->
<a href="/"><img src="logo.png" alt="A11y Scan home page"></a>

When context is needed

<!-- Acceptable: link text + surrounding paragraph provides context -->
<p>
  Our Q3 results showed 23% growth.
  <a href="/q3-report">Read the full report</a>.
</p>

How to Test

  1. Open a screen reader and press the links list shortcut (VoiceOver: VO+U then Links; NVDA: Insert+F7) to view all links on the page.
  2. Read each link text and determine if its purpose is clear either from the text alone or from its surrounding sentence/paragraph.
  3. Check for empty links (anchor tags with no text or only whitespace) and image links without alt text.
  4. Look for generic link text like "click here," "read more," or "learn more" and verify the surrounding context makes the destination clear.
  5. Pass: Every link's purpose is clear from its text alone or combined with its immediate context, and no empty links exist.
  6. Fail: Any link has no discernible text, or generic link text whose purpose is unclear even with surrounding context.

axe-core Rules

| Rule | What It Checks | |------|---------------| | link-name | Links must have discernible text | | area-alt | <area> elements must have alt text |

Tools

Test this criterion with the Link Text Analyzer.

Sources

  1. W3C WCAG 2.2 — Understanding 2.4.4
  2. axe-core: link-name
  3. WebAIM: Links and Hypertext