Link text is descriptive and meaningful when read in isolation; no "click here" links

Screen reader users frequently navigate pages by cycling through links alone, hearing each link text in isolation without surrounding paragraph context. When links read "Click here", "Read more", or "Download" repeatedly, users cannot distinguish between them or understand where each leads. WCAG 2.2 SC 2.4.4 (Level A) requires link purpose to be determinable from the link text or its programmatic context; SC 2.4.9 (Level AA) tightens this to link text alone. Section 508 2018 Refresh 502.3.7 requires textual information to be available to AT. Generic link text also harms SEO, compounding both accessibility and discovery failures.

Replace every instance of generic link text with text that describes the destination or action. In blog listing components and card components, update the link text directly:

{/* Before */}
<a href={post.slug}>Read more</a>

{/* After */}
<a href={post.slug}>Read more about {post.title}</a>

For icon-only links, add aria-label:

<a href="/contact" aria-label="Contact support">
  <EnvelopeIcon aria-hidden="true" />
</a>

For PDF downloads and external files, describe the destination and file type:

<a href="/files/q3-report.pdf">
  Download Q3 2024 Financial Report (PDF, 1.8 MB)
</a>

Audit by searching src/ for >read more<, >click here<, >learn more<, and >download< in isolation.

• ID: gov-section-508.keyboard-assistive.link-text
• Severity: medium
• What to look for: Check all <a> tags and <Link> components. Examine the link text (the visible text between opening and closing tags). Look for generic text like "click here", "read more", "link", "learn more" without surrounding context. Links should be understandable to screen reader users who navigate by reading only the link text.
• Pass criteria: All links have descriptive text that explains the destination or action (e. At least 1 implementation must be verified.g., "Contact form", "View all products", "Learn about our pricing"). Links that appear near explanatory text (e.g., "Find out more in this article") count as passing if the surrounding text provides context.
• Fail criteria: Any link has generic text only (e.g., "click here", "read more") without surrounding descriptive context, or link text is unclear to a user seeing only the link (e.g., "link" or just a URL).
• Skip (N/A) when: Never — link text affects both accessibility and SEO.
• Detail on fail: Count the affected links and give examples. Example: "12 'Read More' links appear on the blog listing page with no context about which post they link to. Links to PDFs use just 'Download' instead of 'Download Q3 2024 Financial Report.' Footer links include one that says 'here' in the sentence 'Details are available here.'"
• Remediation: Use descriptive link text:

  // Poor
  <a href="/blog/post-1">Read more</a>
  
  // Good
  <a href="/blog/post-1">Read more about our Q4 roadmap</a>
  
  // Good with aria-label for icon links
  <a href="/contact" aria-label="Contact support">
    <ContactIcon />
  </a>