Creating meaningful link and button text

Quick summary: 

Don’t use link text like “click here” or “read more.” They’re not helpful.  

The problem

One layer of providing web content that is accessible, equitable, and usable is thinking about the various ways that users interact with our content.  Using links or buttons with generic text labels like: “click here,” ”more information,” and “read more” fail to provide meaning. 

The discussion

Links and buttons should have unique or descriptive text that should be meaningful when read out of context.  Likewise, the purpose of the link or button should be determined from its text.

Consider the various ways users interact with links:

  • Screen reader users can generate a list of links and navigate them alphabetically. Redundant or generic link text such as “More” is meaningless in this context.
  • Assuming all users click on links is inaccurate.
    • You don’t click on mobile devices. 
    • Using a computer without a mouse (example: screen reader) you tab to the links and then press the enter key.
  • Users of speech recognition technology can select a link with a voice command like “click” followed by the link text. Therefore it is also helpful to use unique link text that is short and easy to say.

Getting to the destination

Each link and button should be unique and informative. Links such as “Click Here” or “More Information” do not clarify the destination of an activated link. 

This is especially important when there are multiple buttons on the page that navigate to different places or perform a different task. Examine each link and button and make sure that they have a unique and informative text so that users know what will happen when they activate that control. 

What not to do

Avoid using full URLs as link text

When text like “https://www.ucsc.edu” is used, sighted users can see the words UCSC’  and ‘edu’, but a screen reader is going to read the URL letter-by-letter. “H-T-T-P, Colon, Slash, Slash, Double-U, Double-U, Double-U, Dot, U-C-S-C, dot, E-D-U “

As you can imagine, this becomes unintelligible after the first 4-5 letters.

Don’t use the word “link” in your links

Screen readers tell the user when they encounter a link, so you don’t need to use the words “link” or “links to” or “goes to” in your link text.

Keep learning

WebAIM: Introduction to Links and Hypertext

WCAG: Understanding SC 2.4.4:Link Purpose (In Context)

Using Link Titles to Help Users Predict Where They Are Going

Sources: Oregon.gov, Stanford.edu

Last modified: Apr 22, 2024