# Vague link text in React

> How to fix vague link text in React — with the exact fix and copy-paste code.

_Category: Search visibility · Detector `seo` · Check `generic-link-text` · Severity: info_

Link text like “click here”, “read more”, or “learn more” carries no meaning on its own. Search engines use anchor text to understand the linked page, and screen-reader users often pull up a list of links out of context — a list of ten “read more” links is useless. AI-generated CTAs default to these generic phrases.

## The fix for React

Pass a descriptive label, or an `aria-label` when the visible text must stay short. Next.js `<Link>` is identical.

```tsx
<Link href="/pricing" aria-label="See pricing and plans">Read more</Link>
```

### Steps

1. Rewrite generic links to name their destination
2. For unavoidable short CTAs, add an `aria-label` or visually-hidden text
3. Verify each link makes sense out of context

## How VibeCheck detects it

The `seo` detector flags this live in the browser and reports it to the widget's Problems list — and to your coding agent over MCP.

- **Issue string:** `Vague link text`
- **Threshold:** link text matching /click here|read more|learn more|here|more|link|this/i

## FAQ

### Is “click here” really that bad?

For usability and SEO, yes. Anchor text describes the destination to crawlers and to screen-reader users reading a link list. “See pricing” beats “click here” every time.

### How do I keep a short button label but still be descriptive?

Add an `aria-label` that names the destination, or include visually-hidden text. The visible label can stay short while assistive tech and crawlers get the full meaning.

See the general, framework-agnostic fix: https://vibecheck.wcgw.fun/fix/generic-link-text.md

---

Fix guide from VibeCheck — https://vibecheck.wcgw.fun/fix/generic-link-text. Full site index for LLMs: https://vibecheck.wcgw.fun/llms.txt
