You are here:
- Manual
- Development
- Links and navigation
- Colours and styles
Links and navigation: Colours and styles of links
Browsers keep track of the links on a page that have been visited before. The standard for an unvisited link in most graphic browsers is blue and underlined. A visited link tends to be purple and underlined.
Thew question how web developers should present these two links statuses and whether they should even present them at all has been discussion for years. In this manual the general recommendations are as follows:
If web developers decide to modify the appearance of textual links…
- …they must make links clearly distinguishable from other text
- …they must make a clear distinction between visited and unvisited links
Links that are clearly distinguishable from other text
Link presentation can be distinguished from the surrounding text by means of colour and form. It is possible that colour blind visitors will not be able to make out this colour (see also Use of colour). That’s why it is important that links are not distinguished by colour alone. For example, use a bold type and the colour red, or underlining and the colour blue.
Links must be easy to distinguish from other text.
Guideline R-pd.8.8
Web users usually interpret underlined text as indicating links. It is a good idea for web developers to make use of this strong signal.
Underlining non-link text is strongly discouraged. Even if the developer has decided to display links without underlining, underlining other text will confuse the visitor considerably. Rather than underlining, it is better to use italics or bold type.
Consist presentation
Consistent link presentation is encouraged. Only use variations in form and colour if these make the links more usable; for instance different styles to distinguish links in the main and sub navigation and links in the page content.
“Use navigation mechanisms in a consistent manner.”
Consistency in form and colour outweighs tradition. This means that links do not necessarily have to be blue, purple and underlined. Visitors are perfectly capable of recognising a visited or unvisited link, as long as the web developer is consistent. However, it might prove confusing if purple is used for unvisited links and/or blue for visited links.
“Shades of blue provide the strongest signal for links, but other colours work almost as well”
Guidelines for Visualizing Links, Jakob Nielsen
A clear distinction between visited and unvisited links
Web developers should make a clear distinction between visited and unvisited links. This can be achieved by colour, as well as by form. At least, make sure that the meaning is not conveyed by colour alone. See also The meaning of colour on the web pages.
The difference between visited and unvisited links does not have to be made everywhere, for instance in the main or sub navigation of a web page. Since their prominent position usually makes clear already clear enough that they are links, their style and colour can be different from link presentation elsewhere on the page.
“People get lost and move in circles when websites use the same link colour for visited and new destinations. To reduce navigational confusion, select different colours for the two types of links.”
Change the Colour of Visited Links, Jakob Nielsen
