Best practices for authors and editors for creating accessible hyperlinks
If your Components contain links, either to another Component or to an external URL, observe some common rules in order to make the published content accessible.
- Link text
- Ensure that link text describes the purpose and the destination of the link, and remains understandable when stripped out of context (without the surrounding sentence, paragraph, and so on).
titleattribute-
If it's impossible to add a link text that makes sense when taken out of context, set a
titleattribute. This creates a worse user experience but can sometimes be the only solution. - Images as links
-
If your link is presented as an image, rather than as text, set the
altattribute of the image to your link text, followed by the word "link". This allows the screen reader to identify the attribute as being a link description. - Links that open in a new tab or window
- If your link opens its target in a new tab or window, include the text "(opens in new window)" at the end of the link text.
- Links to downloadable files
- If your link points to a file that the visitor can download, include the type of the file in brackets at the end of the link text. For example, if your link points to a downloadable PDF document called "Corporate Ethics Manual," "Corporate Ethics Manual (PDF)" should be your link text.
- Links versus buttons
- Don't confuse links and buttons. A link navigates to a non-interactive piece of content; a button performs a clickable action, such as initiating a download, starting a sign-up process, or logging out.