Link purpose (in context)
This information relates to criterion 2.4.4 link purpose (in context), which states:
The purpose of each link can be determined from the link text alone or from the link text together with its programmatically determined link context, except where the purpose of the link would be ambiguous to users in general.
The principle of this criterion is the same, whether you are creating a web page, document, presentation or anything else. If you have a hyperlink, the text on the page must be meaningful and must tell the user where the link will take them.
How to make a good link
There are two parts to a link:
- The text on the page
- The URL or destination.
A screen reader will read out the text on the page. It is this text on the page that must be meaningful. Most screen readers allow the user to bring up a list of all the links on the page. If the list is like this, it won't be very useful.
- Click here
- Read more
- Learn more
- Link.
None of these tell the user where they will be taken and especially if there are several links all with the same meaningless name, it becomes pretty useless! It is much better to use the name of the linked website or the purpose of the link.
Also, do NOT use the word link in the text, as a screen reader will already announce that anyway.
The URL or destination of the link does not need to be on the page. Many URLs have long strings of random letters. If the URL is on the page, a screen reader will read them all out... which is very annoying!
HTML code
To create a link on a webpage, the html code should use an anchor element. This is an <a> tag. It must have an href attribute, which contains the URL. The meaningful link text should go inside the anchor tags, like this:
<a href="https://webaim.org/resources/contrastchecker/">WebAIM colour contrast checker</a>
The code above will display like this: WebAIM colour contrast checker
Microsoft Office
In most Microsoft applications, you insert a link by identifying and selecting the text on the page and then inserting a link. This brings up an edit link box. Put the URL or other destination in the address field and save.
