Hyperlinks connect a hypertext file or document to another location or file. Linked information is typically presented in the form of text, websites, files, or video content. Hyperlinks play a very important role in course accessibility.
Accessible hyperlinks are easy to create. There are a few simple concepts to keep in mind as you create these links in the resources you provide to students.
Embed a link within a concise string of text instead of using its URL as the link text. A screen reader user will more easily understand where an accessible link leads and will not have to listen while the reader pronounces every single character of a URL. Examples:
- Accessible: Lesson 2.6: Hyperlinks
- Not accessible: https://classroomaccess.oit.ncsu.edu/simple-wayslesson2/part-6-hyperlinks/
Create Concise Hyperlinks
Users can scan a concise hyperlink and quickly determine whether they want to click through and read the material it links to. Examples:
- Concise: Creating Accessible Hyperlinks
- Not concise: This page lists ways in which accessible hyperlinks can benefit screen reader users
NOTE: A longer link:
- Is more likely to break across lines in a web page or document and may appear to be two separate links.
- May reveal some of the information that users will find when they click on the link, which may or may not be your intention.
Create Descriptive Hyperlinks
Descriptive hyperlinks will more clearly explain what information they link to and will improve the experience of all your students. Examples:
Write Out Full Email Addresses
Use the full email address as link text rather than embedding it in other link text. Examples:
- Accessible: email@example.com
- Not accessible: Accessibility Help
This example does not convey that it is an email address.
Other Best Practices
- Choose hyperlink text that clearly identifies the content of the resource being linked to.
- Hyperlink text should not consist of the URL unless it is likely to be printed; e.g., Word document.
- If a hyperlink downloads a file, be sure to mention that.
Example: Campus Map (PDF, 5.62 MB)
- If a hyperlink opens in a new browser tab or window, be sure to mention that.
Example: NC State University Homepage (opens in new tab)
- Underline hyperlink text.
- Give hyperlink text a different color from surrounding text.
- Hyperlink text is usually blue but may be any color that contrasts sufficiently with surrounding colors.
- Use the same color for all hyperlinks in a given document or web page.