Accessibility Tips: Accessible Links

Have you seen “click here” links while browsing? I think this is one of the most common inaccessible elements I have seen.

Why is “Click here” inaccessible?

People with vision impairments may use a software (called a screenreader) to read out screen content to them. Screen readers can be programmed to give all links in a page as a list to allow quick navigation. Did you know if you are on a web page and press Tab key it will jump from one link to another?

When a screenreader user tabs through a page, if the page is using “click here” as the link text what the screenreader will read is “click here” [tab] “click here” and so on. This makes navigation almost impossible for a visually impaired user.

However, if the page is created with well thought out link text links, navigation will be much easier than in the first scenario. For example, if the webpage is about a course module, and there are links to learning outcomes, assignments and assignment calendar, we can use meaningful text to create the links. Then when the screenreader user navigates the page it will read something like “learning outcomes” [tab] “assignments” [tab] “assignment calendar” giving the user an indication of what each link will reveal.

I tried to demonstrate this with NVDA 2019.2.1 in the video. In the video I navigate the same page first with inaccessible “click here” links and then with accessible meaningful links.

Is it only for web pages?

No. Wherever you use text to link to another place, for example in a document or even in an email you should use meaningful text as the link.

Is there a standard?

Using meaningful link text is recommended in Web Content Accessibility Guidelines (WCAG).

To be precise WCAG success criteria 2.4.4 Link Purpose (In Context) and 2.4.9 Link Purpose (Link Only) address accessibility of links.

Where can I learn more?

There is a good article Links and Hypertext created by WebAIM (Web Accessibility In Mind).