When setting the table for a dinner party, the focus should be on the food ...
|
The dining table, the cutlery and the china may vary substantially in appearance, however they generally follow a standard form that we are well accustomed to using. We don't even consider how a chair, a fork or a plate works, we simply focus on the meal at hand. The consistency of the 'tools' facilitates our consumption of the meal. This obscure analogy illustrates a point, that as web publishers, we are attempting to focus our audience on our message. The navigation and site branding should not dominate the attention of our visitors.
|
Accepted web practice — The visitors tools!
|
When a new visitor comes to your website, they are not a 'blank page', they already expect that their device, their browser and the websites that they encounter will work in a certain way. These visitors understand web practices, norms and behaviors, that they have gathered from visiting websites in the past. They have not come to your website for a lesson on how to consume web content, in the same way that our dinner guests are not arriving for a lesson on using a chair, table, fork or plate. The emphasis may seem strong here, so take a moment and think how many times you have been to a website and thought ... 'why are they making navigation of their site so difficult?' How, as a consumer did you respond? Demanding that someone learn 'new tools' simply to consume your message is a path to both cognitive overload and cognitive dissonance and your visitor's rapid departure from your website.
|
The web equivalent of chairs, forks and plates ...
|
Exploring this metaphor for a moment, lets call the 'tables and chairs' the platform. The platform in our web publishing case is the device and the browser. We need to be aware of how they work and the standards involved in bringing our visitors 'to the table', so to speak. Most of the time, if everyone has followed the 'standards', then we should all be 'at the table ready to eat', regardless of which chair we are sitting on.
So lets make the 'plate' our equivalent of the 'website's design and branding' and our 'cutlery' the equivalent of the 'website's 'navigation model'. So with this in mind, lets take a look at both website branding and website navigation and accepted practice in these areas.
|
Accepted practice in website branding ...
|
Lets for the sake of the argument say that there are three key sections to a website, and for that matter any web page. In this argument, these sections are (1) the site brand, (2) the site navigation, and (3) the site content.
In the 'Site Brand', we are talking about the answers to the questions, 'who's web site am I on?', and 'how does this website feel?'. The accepted practice is that there is some form of 'mark, logo or name' and this device is usually on every page and doubles as a link back to the home page (it is also most commonly located in the top-left). The brand also includes the URL, the page template design, the font (type style) choices and color choices that all create the 'feel' of the website. The 'brand' is included first, because it impacts the style of both the navigation and the content. We discuss all of these choices in more detail in the section on design.
|
Accepted practice in website navigation ...
|
Now lets have a look at website navigation. As we know, there are billions of web pages (which makes the 'dinner analogy' interesting, given that the world probably consumes more web pages in a day than it does meals), and yet in practice, when you remove the branding differences, there are probably less than a dozen established website navigation models. This is because, like our cutlery, these models work. They work because we understand them and our use of them has become habitual and instinctive. We rapidly appreciate what we are dealing with, understand what is required of us, and can quickly focus on the content and key messages, reducing the risk of cognitive overload that can be triggered by unfamiliar navigation models.
In the 'Site Navigation' we are talking about answers to the questions, 'how do I move around this site?', 'what sort of material is on this site?', and 'how big is this site?'. What follows below, is a table that explores some of the factors that determine which navigation model may best fit your website and your website's audience requirements. This table is only indicative, as any model is only short-hand for the real complexities of the reality it represents. The table links to 10 navigation types that we discuss in more detail in the section on structure.
Although the 'best fit' may not be your ultimate choice for other reasons, including branding or technical considerations, these 10-types are tried, tested and generally understood. You depart from these models at your considerable peril ...
|
— Types of site navigation
|
| | | | | | | | | | | — Large website (> 500 pages)
|
| | | | | | | | | | | — Small website (< 100 pages)
|
| | | | | | | | | | | — Focus on limiting options
|
| | | | | | | | | | | — Offer large set of options
|
| | | | | | | | | | | — Maximize navigation space
|
| | | | | | | | | | | | | | | | | | | | | | — Highly experienced web users
|
| | | | | | | | | | | — Inexperienced web users
|
| | | | | | | | | | | — Content doubles as navigation
|
| | | | | | | | | | | — Content doesn't offer navigation
|
| | | | | | | | | | |  | | | | | | | | | | |
|
|
Accepted practice in website content ...
|
There are also established practices in the area of website content and message, however we will examine these topics in more detail once we have dealt with branding (design) and navigation (structure).
|
Keeping the attention of your audience ...
|
After everything we have discussed above, if tables, cutlery and china, were all exactly the same, then dining would be a relatively uninteresting experience. We can argue that efficiency is served by common interfaces, navigation and structures, however best-practice web publishing requires that we engage our audience. Keeping 'accepted web practice' in mind, we also need to generate interest and attention, to achieve this we need to consider elegant variation in our application of accepted practice. The 'Black Art' is striking the right balance between efficient standards and attention grabbing difference.
|
|
