Motive [Home].Glossary.

Guides

The Motive Web Design Glossary

navigation

Navigation is both the system(s) that a visitor can use to move around a website (global navigation, breadcrumb trails, related links, pagination (previous/next page), footer navigation, etc.) and the visual manifestation of such systems (hyperlinked text, tabs, buttons, etc.).

Website navigation has two main functions:

In the case of text-based hyperlinks, navigation may also inform the user of where they have been.

Depending on the interface conventions used, links that have been followed may be assigned a different visual treatment than an unvisited link. For example, on the Motive website, unvisited links are red, and visited links are grey.

If the user is familiar with the notion of unvisited and visited link states, they may revise their browsing behaviour, e.g. “I’ve been to that page already and didn’t find what I was looking for—so I’ll try that (unvisited) page instead.”

Navigation is often referred to when discussing website structure and information architecture.

Global/top-level/persistent/primary navigation

Global navigation helps to orient the user

‘Global’, ‘top-level’, ‘persistent’, or ‘primary’ navigation is navigation that is displayed on every webpage, usually at the top or left of the screen.

This type of navigation provides access to the main content sections or services. In function it is similar supermarket signage—it helps to orient the user to their surroundings.

In addition to the main sections of a website, global navigation often includes a link to the homepage, contact information and a search feature.

In-page navigation

When arriving at longer-length webpage, a person may need to scroll down to get a sense of the topics covered. If content has been structured through the use of headings, then they will be able to figure-out if they have found the content they are looking for (before they start reading).

In-page navigation simplifies this initial orientation process (also referred to as ‘scanning’), by linking to major content headings from the top of a webpage.

Within the Motive Glossary, this form of navigation is headed up as ‘On this page’. This label is used to avoid potential confusion with terms such as ‘table of contents’ or ‘contents’ which, in the real world, typically relate to multi-page documents.

In-page navigation is of most benefit on webpages that extend beyond two ‘scrolls’. The value of this form of navigation is limited on shorter pages; as adding it may push headings and content (that a person would otherwise have been able to see), further down the screen (under the fold).

Footer navigation

Footer navigation provides links to administrative information

Footer navigation is also often displayed on every webpage and as such is global navigation. However, rather than linking to content sections, footer navigation typically links to administrative content; copyright statements, terms of use, legal disclaimers, website feedback links, etc. Footer navigation also tends to be presented as text links.

Repeating section links in footer navigation

A common practice is to repeat content-level global navigation options in the footer navigation. This is often borne out of a desire to make a website more accessible, in particular if images or an image-map have been used to display global navigation items.

Repeating the navigation as text-only links ensures that a user accessing the web with a screen reader or without displaying images can still use the website. However, text-only links are unnecessary if navigation images have appropriate alternative (alt) attributes.

…choosing a new section is often a change of task…

An additional argument for providing redundant section links in footer navigation is that it is more efficient; when a user reaches the bottom of the webpage they will not need to scroll back to the top to choose a new section.

The counter-argument is that choosing a new section is often a change of task, and that a form of cognitive ‘resetting’ occurs.

This resetting includes:

Presented as text-links and located at the bottom of the webpage, footer navigation has a negative perceived affordance; it just doesn’t look like a starting point.

An additional usability argument for not duplicating global navigation in the footer is that it introduces uncertainty—a different visual treatment may infer a different destination webpage (even if the label text is identical).

Related terms: above-the-fold, gateway, hyperlink, information foraging, interface, label, landing page, look-and-feel.

Reference links and further reading

 

Motive Web Design Glossary Trivia