Use a hyperlink when you need to navigate the user to more information about the text that was selected. Hyperlinks are best used for tertiary actions outside the main work flow.
- Hyperlinks may appear as standalone elements (on a line by themselves), or inline elements (in the middle of regular text).
- Use inline hyperlinks within the context of a sentence or a paragraph.
- Within a paragraph, hyperlinks should inherit the same formatting as the neighboring text as far as font size and font weight. Inline links will appear underlined.
- Two hyperlinks can appear consecutively on separate lines of text and wrap.
- Hyperlinks text must be clear and unique.
- Multiple links to same location should have identicle link text.
- Don’t use hyperlink to initiate actions (Ex. to download a file). Instead, consider using action trigger.
- Don’t use hyperlink for calls to action (Ex. "buy". Consider using call to action instead.
- Don’t use hyperlink for the final action in a workflow. (Ex. "save" settings.) Consider using button instead.
- Don’t hyperlink entire sentences. Instead keep hyperlinks to just a few words, 4-5 max.
- Don’t include the period in the hyperlink if at the end of a sentence.
- A hyperlink is required to have two points of visual distinction when inline. The underline and visual state colors are both required for accessibility.
- Schema definition: The hyperlink schema defines the acceptable configurations, requirements, and options for each component.