Buttons and Text Links

Overview

When writing for buttons and links, ensure they are descriptive to provide users with the proper context of where clicking the link will take them. Screen reader users often navigate websites going from link to link, using the tab key, so providing links that make sense is vitally important and necessary.

  1. Use language that is easy to understand and straightforward. Complex words or jargon might confuse or exclude your audiences.
  2. Describe as concisely as possible where the link will take you or what following the link will do.
  3. Indicate relevant information about the link target, such as document type and size, for example, ‘Proposal Document (PDF, 2MB)’.
  4. Use judgment when linking full URLs. When linking a URL, consider users who must speak it out loud and who must listen to a screen reader announce it.
  5. Link at least one full word. Two words are commonly better.
  6. If you must add action prompts to your link, put them at the end. For example, “Contact us (opens popup)”.

What to Avoid

  1. Avoid using ambiguous link text, such as ‘click here’ or ‘read more’. These kinds of links can be confusing when a screen reader reads them out of context.
  2. Avoid duplicate link text on the same page and instead use unique link text where possible. You should never have two links pointing to different locations that share the same text. Be mindful that this includes links found in the global header, global mega menu, and global footer.
  3. Avoid opening links in a new window.
  4. Avoid using images as links. If an image functions as a link, the image must have alt text that conveys the location and purpose of the link. The alt text should not describe the image. Treat image links as links, not as images.
  5. Avoid using a URL as your link text; especially if it is long or complicated. Short, easy to read aloud URLs are acceptable to be used as link text.
  6. Never include empty links, using href=””.
  7. Do not use descriptions that rely only on sight.