Ensure links are understandable and distinguishable from their surrounding text.
- Check that the purpose of each link is clear. [WCAG 2.4.4]
- G53: Identifying the purpose of a link using link text combined with the text of the enclosing sentence
- G91: Providing link text that describes the purpose of a link
- H30: Providing link text that describes the purpose of a link for anchor elements
- H33: Supplementing link text with the title attribute
- H77: Identifying the purpose of a link using link text combined with its enclosing list item
- H78: Identifying the purpose of a link using link text combined with its enclosing paragraph
- H79: Identifying the purpose of a link in a data table using the link text combined with its enclosing table cell and associated table header cells
- H80: Identifying the purpose of a link using link text combined with the preceding heading element
- H81: Identifying the purpose of a link in a nested list using link text combined with the parent list item under which the list is nested
- C7: Using CSS to hide a portion of the link text
- SCR30: Using scripts to change the link text
- ARIA7: Using aria-labelledby for link purpose
- ARIA8: Using aria-label for link purpose
- Check that links are distinguishable from their surrounding text. [WCAG 1.4.1]
- Group sets of related links. [WCAG 1.3.1]
A common problem when creating hyperlinks is that the text inside of the link does not provide the full context of what is being linked to. The assumption most people make is that links are only encountered where they are placed in the text, when in reality users can iterate over the links before, during and after reading a section. Without meaningful labels, the result can be a confusing mess of "see here" and "read more" link text being offered with no indication of where those links go.
To avoid this problem, always ensure that the text you hyperlink is meaningful on its own. If you can read the link out of the context of its surrounding prose, and it clearly indicates where links to, you will improve the experience for users using ATs.
A more complicated issue with links is the number to include in a document. The more that you use, the more inconvenience it can cause to your users. For example, keyboard users may have to tab through all of the links to locate one they want to follow after finishing a section. Another problem is that linked text is often preceded by the word "link" being announced to the user, which can disrupt the reading experience when done in excess.
The complicating factor is that generous hyperlinking can also be of benefit to many users, too. Keywords are often hyperlinked to their definitions, for example, which can quickly lead to tens and hundreds of hyperlinked words in a chapter. Although an impediment to some users, the ease of access often facilitates the process for users with learning disabilities and cognitive issues.
Removing redunant links from EPUBs is a good idea, but what constitutes redundant linking has to be addreesed on a case-by-case basis. Hyperlinking only the first instance of a keyword in each chapter might be one method of reducing the overall number, for example.
Another problem with links is that they cannot always be perceived by a user (e.g., color blindness may make the links imperceptible from the surrounding text), in which case the person will not be aware that they are potentially missing access to additional information.
To avoid the problem of links blending into their surroundings, hyperlinked text should be discoverable by more than just its color. Underlining of links is not required, but some other visual cue should be provided if underlines are removed (e.g., increased bolding of the font).
Avoid overriding the color of visited links to make them match unvisited links, particularly in heavily cross-referenced works. A lack of visual distinguishment of where the user has already been can cause navigation problems for some users.
- HTML5 — The