Brightspace, our Learning Management System (LMS), was designed with accessibility in mind. However, it is the responsibility of the instructor and/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative text, tables, lists, etc.
I am writing a series of accessibility related blog posts that will provide suggestions on how you can make small changes when creating course content to make it accessible. This is the third tip in my series of accessibility related blog posts and it focuses on descriptive links.
Links are like sign posts. They should tell you what you will find when you follow them. When using a computer, people are generally skimming pages for links. They tend to skim pages to quickly find what they are looking for.
Text links on a page are easily identifiable to persons who are not visually impaired because they are normally colored and underlined, and therefore stand out from the other information on the page.
Persons with a visual impairment using screen reader software are presented with a “links list” with all the available links found on the page. Screen reader users and persons using text-to-speech browsers often navigate websites going from link to link using the tab key, so providing descriptive links is extremely important.
Link text stands out in the same way that bold text does. If all your links have non-descriptive link text like "click here" or "more information" users are forced to read the text around the link to understand the context of the link and where it will take them. Therefore "click here" and “more information” are more of a hindrance than a help.
For effective skimming, both visual and non-visual users benefit from link text that can stand on its own without the surrounding context of the page. Good link text provides a clear description of the page that will load when following a link. With good descriptive link text, users can skim links and make quick informed decisions about the path to take to accomplish their task. With non-descriptive link text, users cannot ascertain where the link will take them from the link text alone. Therefore, you should avoid non-descriptive link text such as:
- Click here
- Here
- More information
- Read more
- Continue
These types of non-descriptive link text offer no explanation and require users to expand their focus to the surrounding context or follow the link to discover its destination.
Consider this example of a list of all the links on a page that a visually impaired user has pulled up for quick access.
As you can see, the list of non descriptive links is meaningless. Descriptive links as shown in the image below are far more useful.
When choosing descriptive links the link text needs to be long enough to convey the purpose of the link and no longer. Make link text clear and self-explanatory to support quick and effective navigation.
When scanning links, the first words in the link text are the ones most likely to grab the user’s attention. Link text that begins with keywords is easier to scan efficiently and works better with software features like "link lists" that visually impaired individuals use to get an alphabetized list of links on a page.
Links beginning with non-descriptive words are not very helpful. Consider these two examples "All about ocean acidification" and "Learn more about global warming." Scanning these links will be slower and the alphabetized links list is not going to be very useful. A better approach is to use only the keywords for link text. For example those two links could be improved if they were formatted as "All about ocean acidification" and "Learn more about global warming."
Some users make links out of entire sentences or entire paragraphs. These long links are probably unnecessary and are not user-friendly for screen reader users. Remember that screen reader users cannot visually scan through lengthy links. They have to listen to the entire text. Some screen reader users get frustrated with long link text and move on to the next link if they cannot understand the purpose of the link after the first few words.
URLs are not always human-readable or screen reader friendly and therefore using URLs as link text should usually be avoided. Exceptions are when the document is intended to be printed or if the URL is relevant content.
In most cases, it is better to use human-readable text instead of the URL. The human-readable link Inclusive Design for a Digital World is more user-friendly than the link to purchase the book by the same title on Amazon.com, which consists of this 170-character link full of letters, numbers, slashes, and text that is not very human-readable (https://www.amazon.com/Inclusive-Design-Digital-World-Accessibility/dp/148425015X/ref=sr_1_1?keywords=Inclusive+Design+for+a+Digital+World&qid=1563708616&s=audible&sr=8-1.)
Additionally, links don't always lead to web pages. It is equally important to make this clear in your link text. Users appreciate knowing in advance, for example, that if they click on a link on their mobile device they will download a 20Mb PDF. In this case, the link text should indicate that it is a link to a file, including type and size of the file. Here's an example: Assignments Tool Quick Reference Guide (pdf 587KB).
Hyperlinks that are good for both accessibility and usabilty use descriptive text and retain the standard underline style.
Ugly (and unclickable): https://webaim.org/techniques/hypertext/link_text Bad: Click here to learn more.
Good: Accessible link text and appearance by WebAIMIf you are interested in getting more information about descriptive links refer to “Link Text” at webaim.org.