文脈がなくても意味が通るリンクテキスト

Screen reader users often pull up a list of every link on a page. Each one must make sense on its own, with no surrounding sentence.

Imagine a list of ten links that all just say click here. Out of context they are useless, because nothing tells them apart. 😕

Good link text names where you are going. Use the page or document title so the link reads clearly all by itself.

Phrases like read more and learn more repeat across a page and tell no one what they actually lead to.

Put the most useful words at the start of the link. Users scanning by first letter find the right one faster that way.

A raw URL as link text reads as a long string of letters and slashes aloud. Use human words that name the destination instead.

If two links go to the same place, give them the same text. Different wording for one destination just confuses people.

If short visible text must stay, aria-label can give the link a fuller accessible name that screen readers announce.

When you add a label, keep the visible words inside the accessible name so voice-control users can still say what they see.

A link that is just an icon has no text to read. Give it a visible label or an accessible name, never nothing.

You usually do not need the word link in your text. The screen reader already announces the role, so it would be said twice.

Why is link text like click here a problem for screen reader users?

Write link text that stands alone and names its destination. Drop click here, and every link becomes self-explanatory. ✨