Send us the RFP Sign up free
Sign up free Send us the RFP
Back to course

F3 Accessible Content Basics

0% done: 0 of 7 lessons

Lesson 2 of 7 · Simulation

Links that make sense on their own

Progress is saved on this device only. Keep it across devices with a free LFW account.

Curriculum0 of 7 done

Simulation

Rewrite three links so they make sense on their own

A working copy of the real screen. Use it as you would the real one. Nothing you type leaves this page.

This exercise runs in your browser and needs JavaScript. The lesson text above covers the same steps.

Not done yet.

Write link text that says where it goes, so it works when read aloud, listed alone or spoken as a voice command.

Notes

Step 1 of 7

Start here

Links are the doors of your website. Their words tell people where each door goes. On a page full of "click here" and "read more," those doors are unlabeled.

Step 2 of 7

How people use links

Screen reader users often pull up a list of every link on a page and choose from it. In that list, each link appears alone, without the sentence around it. Ten links reading "click here" become ten identical doors.

Voice control users say the words they see: "click Apply for a permit." Clear, visible link text is what makes that work.

Everyone scanning a page reads the links first. Good link text helps sighted readers too.

WCAG 2.1 calls this link purpose: the purpose of each link should be clear from the link text, or from the text together with its sentence. Writing link text that makes sense alone meets that and goes further.

Step 3 of 7

The rule: say where it goes

Make the link text the name of the destination or the action:

  • Instead of "To pay your water bill, click here," write "Pay your water bill online."
  • Instead of "Read more," write "Read more about the library expansion."
  • Instead of "Agenda (link)," write "May 12 council meeting agenda."

Put the link on the words that matter, not on "here," "this" or "link."

Step 4 of 7

Avoid bare web addresses

A full address like https://yourtown.gov/departments/finance/utilities/pay gets read aloud character by character on some screen readers, and it tells a scanning reader little. Use words, and keep the address for print, where people cannot click.

Short, memorable addresses are the exception. "Find us at yourtown.gov" is fine.

Step 5 of 7

Say when it is not a web page

If a link opens a document or leaves for another site, say so:

  • "2027 budget (PDF, 4 MB)"
  • "Apply on the state licensing site"

People on a phone with limited data, and people whose screen readers handle PDFs differently, can decide before they tap. Lesson 4 covers PDFs.

Step 6 of 7

Links and buttons

A link goes somewhere: another page, a section, a file. A button does something: submits a form, opens a menu, plays a video. If you are adding something in an editor that does an action, ask whoever manages the site whether a button is the right component. It matters to keyboard and screen reader users, who expect each to behave its own way.

Step 7 of 7

Make links look like links

Links should be distinguishable from surrounding text by more than color alone, usually with an underline. Lesson 5 covers color. If your site's style removes underlines from links in paragraphs, tell your web contact.

Sources

Task

Your task at your institution

Quiz

4 questions. Choose one answer for each, then check them. Each answer shows its reason.

1. Which link text is best for a page about paying a parking ticket?
2. A page has five links that all say 'Read more.' What is the problem?
3. A link opens a PDF. What should the link text include?
4. Why should link text match the words on screen for voice control users?
Show the answers
  1. B. Pay a parking ticket online. It says where the link goes, in words. It makes sense when read alone in a list of links.
  2. B. In a list of links, five identical labels give no clue where each goes. Screen reader users often pull up a list of all links. Five 'Read more' links are indistinguishable there.
  3. B. That it is a PDF, and its size if large. People on phones and screen readers deserve to know before they open a document that it is a PDF.
  4. A. They say the visible words to click the link. Voice control users say what they see, like 'click Apply for a permit.' Matching words make that work.