Links
The text of a link should adequately describe the link's destination (and/or what will happen when the user follows the link).
Do
- Use clear and concise language that describes the destination.
- Use consistent language throughout a site to link to a specific page, site, or section.
- When providing a list of links with similar text, the text which differentiates the links should be placed at the front of the text, when possible.
Do Not
- Do not use vague text for links, like "Learn More" or "Click here".
- Do not use URLs for link text.
- Do not use the link's Title.
- Do not use the same text to link to different locations/pages/documents.
- Do not make assumptions about how the user is interacting with the content.
- Do not force the user to interact with the content in a particular manner.
Other Types of Links
Email Addresses (mailto: links)
- Use the email address as the link text.
- Do not attempt to obfuscate the email address in any way.
It is very common for the user's browser to not handle email links properly, so they should be able to copy the email address or write it down. Do not attempt to obfuscate the email address in any way. Our Content Delivery Network (CDN) provides email address obfuscation automatically to protect against automated email harvesting.
Phone Numbers (tel: links)
- Use the phone number as the link text.
- Include the area code and full phone number.
Documents, Videos, Audio, etc.
- After the link text, indicate the type of file being linked to in parentheses.
- Do not change the link's behavior based on the file type.
When linking to anything that isn't a webpage, email address, or phone number, the user needs to be informed of what type of content is linked, in case they experience any issues navigating to the content or have a particular preference in how to handle those types of files.
The user may want to download the file to open in a different application or open the file in a new tab, but you should not make those decisions for your users.
More About Links
Assumptions About User Interaction
In links, or when describing how to navigate a page, do not use words that assume the user is interacting with the page in a specific modality. For example, users don't "click" on links when they can't use a mouse (whether using their phone to access the page or using some alternative input device) and not all users can "see" your content. In addition to screen readers, users may be using a device which doesn't have a screen, like a "smart speaker" or accessing the content in some other way we didn't anticipate.
When browsing a site, we often like to choose an alternative method of opening a link. For example, we might open a link in a new tab/window so we can come back to the current page without losing our place or come back to the link at a later time while continuing to read the current page. Another option might be downloading a PDF or spreadsheet so we can open it in another application. We often think it would be helpful to make these links behave this way all the time, but our users may not agree. They may be using the site in a different manner or following a different workflow and automatically opening links in new tabs or downloading a file they could have opened in their browser can be confusing or frustrating to users, especially since they can still choose to do those things on their own (and may not know how to force your links to behave normally if you're forcing the other behaviors).
Clarity in Link Text
Do not use the same text to link to multiple locations. If two links on the same page use the text "Office of Admissions", the user will expect those links to lead to the same destination. Ideally, where this link sends the user would be consistent throughout SDSU. If they point to two different pages, the text of the link should be different (perhaps on a page for a joint program with UCSD where one of the links points to the UCSD Admissions website). If that is not possible for some reason, it is recommended that you contact an account administrator for help in applying an accessible label to the link.
Following with that example, if you link to multiple places with similar text, the differentiating text should be first, when possible. Following from the above example, you might have:
- SDSU Office of Admissions
- UCSD Office of Admissions
In many cases rearranging a sentence can make it significantly easier to provide clear and concise link text which allows the user to differentiate between links based on the text alone and find the specific link they are looking for in a list more quickly.
