What makes good link texts
A good link text says where the link leads, even without the text around it. Links made of an icon only need a name the screen reader can read out.
How it works
Screen readers don't only read links in running text. Many users bring up a list of all links on a page or tab from link to link. They then hear only the link text, without the sentence before it.
In that list, “More” ten times in a row helps nobody, and a link made of an icon only is simply called “link”. What the screen reader announces is the link's accessible name: its text, the alt text of an image inside it, an aria-label, or the text that aria-labelledby points to.
WCAG 2.2 requires in success criterion 2.4.4 that the purpose of a link is clear from its text or its immediate context, and in 4.1.2 that every link has a name.
What matters
- Every link has a name. An icon link, say to Instagram, gets an
aria-labelor visually hidden text; the icon itself getsaria-hidden="true". An image used as a link needs an alt text naming the target. - The target is in the link. “See prices” rather than “click here”, “Guide to signing up” rather than “read more”.
- Same text, same target. If several “Learn more” links lead to different pages, they can't be told apart in the link list. If they all lead to the same page, that's fine.
- aria-label contains the visible text. If the visible text stays short, an
aria-labeladds the topic. It should start with the visible text so that voice control finds the link (success criterion 2.5.3): visible “More”, name “More about plans”.
<a href="/plans" aria-label="More about plans">More</a>
<a href="https://instagram.com/example" aria-label="Example Ltd on Instagram">
<svg aria-hidden="true" focusable="false">…</svg>
</a>- No bare addresses. A long URL as link text is read out character by character.
How to set it up
You change link texts in the content in your CMS editor: select the words that describe the target and put the link there instead of on “here”. Teaser tiles with “Read more” and icon links in the header and footer come from the theme or a plugin; whoever maintains the theme adds the aria-label there, often with the post title filled in.