Design Pattern Library 1.5

General Guidelines

Desktop/Web

Mobile (Tablet & Phone)

Visual Design Guidelines

Mobile - Links

Problem

The user needs to be able to navigate to other content, or features, within the application outside of navigation elements. These affordances need to be simple, intuitive and contextual.

Solution

Allow text within content to be hyperlinked to other content or features.

How

  • A color different from the color of the main content enhances the link's distinguishability.
  • Choosing a color that is brighter than - or at least in contrast to - the main text color enhances the link's distinguishability.
  • Underlining a link enhances the links distinguishability.
  • Links should take into account the requirements (spacing) outlined in the Touch Pattern.
  • Links with different targets (for instance target="_blank" for external links) should be clearly distinguishable.
  • Title attributes should be descriptive as to where the link will take you.