PIEPP stands for:

Problem recognition - Identifying a need, whether “real” or not.

Information search - The more complicated the object, or the higher its ticket price, the more the information is needed to make a purchase.

Evaluation of criteria - Assessing whether the product meets your needs - a conscious and unconscious process.

Purchase decision - Are there any barriers to stop]]> Ecommerce user journeys contain many phases where retailers can inluence outcomes, corresponding to phases within the purchase decision cycle. The PIEPP purchase decision cycle model is great at helping to explain the complexities of human decision-making when we buy things.

PIEPP stands for:

Problem recognition - Identifying a need, whether “real” or not.

Information search - The more complicated the object, or the higher its ticket price, the more the information is needed to make a purchase.

Evaluation of criteria - Assessing whether the product meets your needs - a conscious and unconscious process.

Purchase decision - Are there any barriers to stop you making the purchase?

Post-purchase evaluation - Did you make the right decision? Why should you come back?

As the user journey progresses and more factors come into play, the user will loop back and forwards between the various phases until either all of the barriers to purchase are removed (resulting in a successful completion), or a barrier prevents further progression and the journey comes to a stop.

An example user journey is shown below, broken down into individual steps with comments to describe the corresponding phases of the purchase decision cycle, and the requirements they present in the commercial environment.

An Example User Journey: Sean Upgrades his Router

Sean thinks his computer is a bit slow, especially when online.

["Problem Recognition" phase]

Reading internet articles on how to speed up connection performance, he realises that a faster router might improve his connection speed. He currently has a “wireless-G” router.

At the top of one of the articles he notices a display banner for a Linksys Wireless-N Gigabit router, and conciously reads it.

This shows the importance of correct message targeting, matching ad content to relevant placements.

Sean clicks on the banner and is taken to a product page, and learns that the product is a “gigabit” router that conforms to IEEE 802.11n-2009 standard (”wireless-N”).

["Information Search" phase]

Sean researches the IEEE 802.11n-2009 standard, and uses search engines to find product reviews and recommended products.

He identifies a basic list of requirements for his router, and creates a “requirements” checklist in his head that includes features, price, etc.

This demonstrates the necessity for search visibility and including content which addresses common questions and explains features and benefits.

["Evaluation" phase]

Sean visits a number of ecommerce stores to try and find products that match his criteria.

He finds that stores with conventional navigation make it more difficult to identify products by feature, whereas ecommerce stores with faceted search allow him to cut their inventory according to his criteria - enabling him to find the results he needs quicker and easier.

Consumers now expect the option of a faceted search in ecommerce stores, as it provides them with a flexible method of drilling-down and identifying the products they require in a much shorter time frame than conventional navigation.

Sean draws up a list of products that match the criteria on his checklist.

This highlights the importance of sales promotion, price sensitivity, USPs, benefit statements and differentiation.

As he starts to evaluate each of the products on his list, he finds that one of the products has a built-in firewall.

Sean now has an additional criterion to add to the list, and therefore loops back from the “Evaluation” phase to the “Information Search” phase.

["Information Search" phase]

Sean adds “Built-in Firewall” to his checklist.

["Evaluation" phase]

Sean re-checks his product shortlist to ensure all products still match the updated checklist, and removes any that now fail to meet all the criteria, including the new “firewall” criterion.

He whittles his shortlist down to a list of suitable products, including the original Linksys Wireless-N Gigabit router, and the equivalent Netgear product.

Sean uses search engines to find ecommerce stores offering best prices for each product.

As he checks each retailer, Sean notices that some of the retailers offer USPs such as free delivery.

With another criterion to add to his checklist, Sean loops back from the “Evaluation” phase to the “Information Search” phase

["Information Search" phase]

Sean adds the “Free Delivery” USP to the checklist.

["Evaluation" phase]

Sean re-evaluates his product list to ensure all products still match the updated checklist, and removes any retailers not offering free delivery.

Sean’s list now comprises of the original Linksys router and the equivalent Netgear product, and the ecommerce stores that offer free shipping for these products.

Sean decides he trusts Linksys more, and he identifies the Linksys as his final choice of product - even though it is marginally more expensive.

This is an irrational decision on Sean’s behalf, as it is based on “gut feel” rather than scientific evaluation. Humans make irrational decisions regularly, and advertising can help build affinity with a brand to help capitalise on this behavioural impulse.

Sean starts researching the retailers on his list for the best price, identifying a number of potential candidates. The cheapest price is for the product only, whereas the 2nd cheapest is only marginally more expensive, but has a free wireless-N-compatible wireless card.

["Purchase Decision" phase]

Sean identifies the 2nd cheapest option as the one offering the best value – but is aware that he is not a computer hardware expert, and is aware that he may encounter issues when setting it up.

Realising he needs a way of returning the item if there turns out to be a problem - Sean loops back from the “Purchase Decision” phase to the “Problem Recognition” phase.

["Problem Recognition" phase]

Sean realises that if he needs to ensure he can return the item if there is a problem, he needs to verify that the ecommerce store he buys from has a favourable returns policy.

["Information Search" phase]

He adds “Returns Policy” and “Wireless-N-compatible Wireless Card” to his checklist.

["Evaluation" phase]

Sean re-checks his retailer list and removes cheapest option – as it doesn’t come with a wireless card.

After more searching Sean finds a third retailer who offers the same ticket price, but with no free wireless card. This retailer does, however, offer a free customer support line.

Again, Seans research behaviour highlights the importance of data structuring to enable USPs to be easily identified.

Sean finds the returns policy, and satifies himself that he can return the item if there is a problem.

Having verified the returns policy, Sean has more “trust” in this retailer. The trust factor is one of the most important element of successful ecommerce, so it is vital to ensure that any issues which impact on your website’s trust factor are resolved.

He considers the higher price tag (once the wireless card is factored-in) is still reasonable, as it provides him with access to the customer support line – a service he previously did not have.

["Purchase Decision" phase]

So, confident that this ecommerce shop offers value for money and a trustworthy service, Sean tries to purchase the router - however, he finds he cannot, as the payment gateway does not accept his Diners Card.

The issue that Sean runs into while using the payment gateway illustrates the importance of improving the factors relating to user experience, in order to remove the barriers to the purchase decision - a process known as Conversion Rate Optimisation (CRO).

Unable to purchase the router from the retailer offering the free customer service, Sean re-evaluates the original cheapest option – even though does not have support or a wireless card.

His initial choice of retailer denied him, Sean has looped back into the “Evaluation” phase in order to assess the next best option…

["Evaluation" phase]

He considers that the initial cost saving will offset the cost of wireless card, and support if needed.

Sean moves back into the “Purchase Decision” phase.

Sean feels the website has high trust factor, as it is a retailer he has heard of before, includes a clear returns policy, and uses a secure payment gateway.

He decides to purchase - this payment gateway accepts his Diners Card and he successfully completes the transaction, filling in his contact details and purchasing the product.

This again demonstrates the importance of Conversion Rate Optimisation in the “Purchase Decision” phase, removing any possible barriers to purchasing to provide the best possible user experience.

["Post Purchase Evaluation" phase]

After 3 weeks of happily using his new router, the online shop he bought it from sends a follow-up email, requesting he fill in a questionnaire. The email reads:

“Thank you for joining thousands of satisfied customers in purchasing the Linksys Wireless-N Gigabit router from us - voted the most popular router on the market by PC Flannel magazine in 2010. We would appreciate it if you could spend a couple of minutes filling in this questionnaire to help us choose future products”.

Sean reads the email, and sees the sentence “voted the most popular router on the market by PC Flannel magazine in 2010″.

He immediately feels validated in his purchase, knowing this was a award-winning product.

Sean’s “Post Sales Evaluation” phase of his user journey shows the importance of Customer Relations Management and using personalised email marketing to increase repeat purchase.

Sometimes customers will feel unsure about their purchase after buying it - the mental discomfort felt when two conflicting ideas are held simultaneously is known as “cognitive dissonance”.

In this case Sean needed the router, but has not necessarily bought it in the most cost-effective manner, as he has to buy a wireless card seperately.

However, when he finds out about the most-popular-router accolade, Sean feels vindicated and happier about his purchase - so by revealing this information, the retailer has removed any cognitive dissonance Sean may have felt about not purchasing the router/wireless-card bundle which would have worked out cheaper for him.

By resolving Seans cognitive dissonance, and because Sean has had a good purchasing experience with this retailer - even though it turned out more expensive in the long run - he is more likely to repeat-purchase from them because the purchasing experience itself was good.

Sean is now more likely to buy from this retailer again next time…

Summary

As can be seen from the imaginary scenario detailed above, even relatively simple-seeming tasks involve more complex user journeys than you might first imagine.

Highlighting the different phases of the purchase decision cycle model serves to emphasise the “looping” process that the user will inevitably cycle through; looping through individual phases many times over until all the barriers to purchase are removed, or the journey cannot progress any further.

By understanding more about the user’s intentions at that point in the user journey, we can assess the most appropriate method of interacting with that visitor and maximise our chances of a successful conclusion - an online purchase!

Information Architecture & Information Retrieval

Before we start discussing website navigation and structure it is important to touch on information retrieval as a driving force behind good information architecture design.

Information retrieval is the science of searching for documents, for information within documents and for]]> In Part 2 we discussed optimising navigation and website structure to get the most out of your information architecture. In this part we will discuss issues relating to information retrieval and how computers and humans absorb your messaging and the way you present your data.

Information Architecture & Information Retrieval

Before we start discussing website navigation and structure it is important to touch on information retrieval as a driving force behind good information architecture design.

Information retrieval is the science of searching for documents, for information within documents and for metadata about documents; it is the academic subject that search engine engineers study e.g. Brin & Page, Google’s founders, read Information Retrieval at Stanford University; and it is all about matching relevant documents or data to a search query.

Information retrieval is about seeking, analysing and comprehending data. In other words getting data.

Conversely information architecture is about how you structure, shape and logically display data; in other words IA is about presenting data.

Therefore, to design a decent IA (presenting data) you need to first have some idea how information is going to be retrieved (getting data). This means understanding the two main information retrieval “systems” your data will be interacting with:-

1. Machine based systems - automated software systems such as search engines
2. Humans - sentient carbon-based lifeforms

Let’s take a quick look at these two “systems”.

Machine Based Information Retrieval

Search engines are the current leading information retrieval systems in public use (defence intelligence ontological analysis systems eavesdropping data-communications and “chatter” could arguably be seen to be more sophisticated but little is known about them for obvious reasons).

Search engines presently use mathematical algorithms to calculate “relevance” using a series of equations and routines.  This is based on analysis of data from websites, web pages and documents they have “crawled” with an automated programme or script called a spider/robot/crawler.

The automated spider goes out across the web following links (hyperlinks) to find and retrieve data for the search engine’s data centre. This data is then crunched in the algorithm against the context of the “document set” - in this case the web itself - comparing the documents and web pages against each other for any given search query a human has requested.

“Search engines can only retrieve what we give them” - Strange

Rather than getting too concerned just yet about the detail of what the search engines are looking for, it is first really important to explain the basic concept that search algorithms are “dumb”; they have no way of reading between the lines; anything they infer or guess is not really inferred or guessed - it is based on some crumb of data  - in  other words an algorithm can only ever output the product of data it has received.

Once you grasp that search engines can only ever return the data we give them - it makes designing IA for information retrieval much simpler.

In essence we must shape the data to provide contextual meaning, semantic definition and topic scope so the search engine can figure out what things are, what we consider to be important, what the relationship between things are etc. etc.

This means from a machine based information retrieval perspective we have quite a scientific solution - a check-list of elements we need to ensure have data that can then be interpreted by the search engine - for example this might be the HTML page title schema providing an indication of taxonomical hierarchy so we know what categories things are in, or simply ensuring metadata is provided to a basic standard (e.g. Dublin Core) . The point is these are not difficult/complex things so do - there are just lots of things to do - and check have been done right.

Human Based Information Retrieval

“We humans are full of unpredictable emotions that logic alone cannot solve.”  - Captain James T. Kirk

So for machines we have a scientific check-list solution, ticking off criteria we know the search engines will be looking for.

With the humans, unfortunately “logical” behaviour does not always occur. However, just because it is not as logical, human behaviour and interactions with websites can be predicted in many ways based on our understanding of cognition and psychology.

This field of knowledge is still in its infancy (behavioural economics) and therefore, we often have to based decision on empirical data and experience.

This greying of certainty is where the art (heuristics) rather than the science of IA design comes in. The good news is there are some things humans do universally which we can count on when designing IA but each market or target audience also behaves in slightly different ways in other areas; which is why experience, knowledge and judgement need to be applied rather than blithely executing the psycho-sales play-book.

Predicable Human Behaviour

Uncertainty is at the heart of much of the online human decision making process and therefore,  information architects need to be mindful of this.

You might like to  read through James Kalbach’s paper “On Uncertainty in Information Architecture” which addresses decision making and IA and explains how uncertainty affects all aspects of the user journey. His discussion of breadth vs. depth and information scent are most useful.

Because we often don’t know exactly what we are looking for we have doubts; and this lack of confidence and assurance has some direct impact on the way we need to help users find what they are looking for (or what we want them to find in some cases).

“All our final decisions are made in a state of mind that is not going to last.” -  Marcel Proust

However, uncertainty and our reaction to it is somewhat predictable. Within the realm of IA and uncertainty one needs to understand when different stimuli will work, how layout can help or hinder user journeys, and how to overcome certain cognitive baggage that affect decision making  (e.g. post-sale cognitive dissonance means we tend to justify poor decision even when clearly dubious).

The brain is a complex old thing - and when we say old, we mean it - millions of years of the Darwinian stuff means we have decision making systems that date back to our days in the primordial swamp!

The brain has three areas/functional response mechanism that we are interested in with our look at designing navigation and website structure; the reptilian/amphibian brain (found in the brain stem); the Limbic brain found in the inner region of the Cerebrum; and three lobes of the Cerebrum (Frontal, Parietal & Temporal Lobes).

Reptilian Brain & Limbic Brains - the Lowest Common Denominators!

As man/woman evolved and pulled ourselves out of the primordial swamp, losing the scales and web fingers, we grew some hair and learnt to stand upright and use tools.

All very Darwinian and logical. The thing is, through natural selection we retained the parts of our brain that worked protecting us from threats, finding food, hunting, sensing danger etc. etc. ; so deep within the fancy-pants enlightened human brain is the stem with elements left over from the Mk1 reptilian/amphibian brain and limbic brain on top of this which ran our marsupial/rodent type fore-bearers.

So what you say? Well lets just see how these can impact directly on the way we present information.

“Instinct is the nose of the mind” - Delphine de Girardin

Ever wondered why humans find moving images compelling? Why we like bling? What make us look at the TV without really “watching” it? Why is red more threatening that green? Why does someone standing on your left or right periphery prove so distracting?

Well, it is your little reptilian brain stem, transfixed by the shiny-flashy-movement type things that represent the type of threats/lunch opportunities it might have faced back in the primordial swamp.

The limbic brain, like the reptilian brain, has some core survival functions - the freeze, flight or fight mechanic (often misrepresented as fight or flight) and is a hugely powerful subconscious driver of human behaviour.

Non-verbal communication which governs about 80% of what we say is controlled here (which is understandable give our recent ascent from primate society in which our neurolinguistic highpoint might have been a growl, hoop or cackle.

The Limbic brain is also thought to control neuropharmacological reward/pleasure response levels (dopaminergic system) and plays a role in problem solving and sexual arousal.

“Hey I want to design IA not do neuroscience 101″ - hold your horses!

Let’s look at some practical examples of things to consider; we’ll call it the lowest common denominator check-list as they tend to pander to the most primitive parts of your brain that drive your instincts:-

Trust

Does your design look trustworthy? Fewer people are going to feel like getting their credit card out if your design looks cheap or does not look like someone cares about the website!

Tone

Aesthetic qualities such as taste and demeanour play an important part in talking to the subconscious mind (limbic brain). If you use gopping (awful) colours,  random/irregular layouts or awkward typography it needs to “work” or else you’ll alienate your audience before they have even “thought” about it. Gladwell’s “blink response“!

Resonance

Your website is a communications platform directed at an audience - so you must know the personas that make up the audience and ensure that your website fits their needs and expectations so it talks to them visually, emotionally and eventually - consciously.

Imagery

Often viewed purely as part of the “creative” solution images actually are crucial within information architecture. The oft quoted “A picture paints a thousand words” whilst trite is nevertheless still an axiom to hold dear when considering marketing communications.

Although the parietal lobe handles image processing in the brain - your limbic system is going to be where you emotionally respond to it (and your initial response is not reasoned but hard-wired).

• A pretty girl on a shiny car is going to make men “look”
• A smiling helpless baby is going to make women “look”

These are hard-wired responses; we may not like them exploited in marketing communications, but they are there.

From a marketing communications perspective we need to consider the wider picture - we don’t need to use sexist or exploitative imagery to utilise the power of the limbic brain.

A smile, any genuine human smile engenders feelings of happiness. An images of a sunny day makes us feel positive; an image of a sombre day makes us feel melancholic.

Whilst these examples are somewhat over simplified - the point holds true - images set the emotional tone of your marketing communications.

The quality of imagery will also reinforce a sense of quality - meaning investment in your images leads to credibility and trust. In short great photography equals trust!

As well as emotional visual communication, images are also going to provide oodles of contextual information to users.

Layout

Spatial demarcation of elements is really important - the more clutter there is the less the brain is able to “see”.

We want users to be aware that there is some stuff here or there without them having to know what it is.

Step back from your website design - 2 to 3 meters from the screen and squint your eyes - you ideally should be seeing topic and function areas distinct from one another.

Recent studies eye tracking studies bear out the Gestalt Laws of Perceptual Organization - specifically:-

The Law of Proximity: Stimulus elements that are closed together tend to be perceived as a group

Grouping related things together helps users work out what things are -  it is what users’ brains do naturally, so your job is not to confuse it and keep things clearly grouped and distinct from one another.

This is what we mean by spatial demarcation.

Visual Cues

Make things obvious - Steve Krug was certainly on the money with “Don’t make me think” - if you want users to react in certain ways or know certain things then you need to signal it to your users.

We write with punctuation to allow the author to convey meaning and intent; punctuation hopefully provides clarity as to the exact meaning intended, the intended rhythm, metre, timbre and tone. In short, punctuation allows the author to express himself more precisely.

Visual cues are equivalent to punctuation - they let you signal to the user what things are and what they do - they’re visual punctuation.

Visual cues are commonly used in typography:-

• Headings (scaled)
• Quotes
• Indents
• Lists
• Bold
• Italics

Visual cues are also used in interactive functional elements

• Buttons
• Navigation
• Widgets
• Tabs

Visual cues are also used in design elements

• Icons
• Panels
• Headers / footers

There are two keys to making visual cues work:-

cue must stand out - it must looked “designed” i.e. the user must automatically infer that you meant something with the element and thus made it distinct

cue must be consistent - so if you use a primary call-to-action button style on one page, then this style must also be used on other pages - to signal it does the same thing.

Clarity

“Is it clear”

As stated information architecture is about presenting data to make information retrieval as easy as possible. So with clarity we have an over-arching principle that must be applied to everything you do - is it clear?

Language

Accessibility requirements mean we should be proposing that you simplify your language and lower the reading age. Plain English etc etc.

This is great advice if you want a vanilla, characterless website that talks to everyone but speaks to no one.

But if you’re marketing to an audience then you need to talk to them in an appropriate style. It doesn’t matter what the style is - as long as it is appropriate to the audience and resonates with them.

Building an online business and brand is about injecting character and differentiation into the website; so to a degree you need to do your own thing and not worry about “the rules”.

As long as you always write with your audience in mind and have their needs at the top of your list then they should be able to get what they need out of  your website; and this will make them want to engage with your business.

Simplify Choice

By reducing options and choices we help people decide!

Don’t give users too many choices - start getting nervous when you offer 7 or more choices. People find it difficult to cope with too many choices (so make none). By reducing options and choices we help people decide!

If you’d like to learn a bit more about decision making and choice I’d recommend Sheena Iyengar’s The Art of Choosing, Dan Ariely’s Predictably Irrational and Barry Schwartz’s The Paradox of Choice - all are very readable and entertaining as well as insightful.

Some basic tips for simplifying choice:-

• Use silos or a taxonomy within your IA to break choices down into more manageable sizes
• Keep forms simple and use steps to break up long daunting forms
• Provide filters and sort functions on search and category listings
• Provide paging view options for the number of items to be listed on search results or categories
• Use cumulative positive and negative facets in your faceted search (green or blue but not yellow)

Test, Test, Test!

Every market and audience coupled with your offering will produce slightly different behaviour characteristics; there is always something to be learned from testing. So whilst the factors discussed above will help improve information retrieval through better IA, you cannot assume your website is optimised until you test it.

If you’re unsure how to go about planning and executing testing for your website then read Steve Krug’s Rocket Surgery Made Easy which will give you a step-by-step guide.

Well planned and conducted user testing and MVT will provide you with both insight and significant improvements in conversion rates for whatever your website is geared to do.

Not matter how much you know about retailing, behavioural economic and human decision making I guarantee you you’ll learn something you did not know before about your market/audience once you run a test - and those insights are golden.

What is so important about navigation and structure?

How do I get around?

Navigation - determines how easily people can find things and retrieve data from the website - a vital component of successful task completion activities that drives bottom line. Taking a user perspective - when they hit a page, will they]]> In part 1 we discussed a rudimentary appraisal of your website’s information architecture so you could gauge whether it met some basic commercial requirements. In this part we will discuss issues relating to navigation and website structure.

What is so important about navigation and structure?

How do I get around?

Navigation - determines how easily people can find things and retrieve data from the website - a vital component of successful task completion activities that drives bottom line. Taking a user perspective - when they hit a page, will they know what’s available and where can they go? Is the offering shown in the navigation elements?

Where am I?

Structure - determines the breadth and depth at which data is held at, and whether the user will know where they are relative to the rest of the data. Structure should provide context. Again, you need to see things from a user perspective.

• When they hit a page will they know where they are?
• How do they get to the bit they’re interested in?

Website structure can essentially follow two models:-

• Taxonomy - traditional hierarchical classification e.g. Groceries > Fruit & Veg > Apples > Braeburn
• Faceted search - attribute-value data e.g. Apple, Fruit, Sweet, French, Eating, Green Skin, 0.5 kg Bag, £2.00 - £2.50

Planning your website structure is something that a good deal and time and effort needs to be taken on;  re-structuring later because you did not anticipate the scalability or flexibility required can be very costly.

For example the “Spingfield-O-Rama” (see Figure above) mock-up sitemap is not very scalable and the taxonomy and nomenclature are a bit weak - i.e. how many characters are we going to have to put in “Ancillary” as this is pretty much every character in the Simpsons outside of the family, school, work, church and cameos.

This is a great example of NOT anticipating where growth will occur - in this example every episode is likely to generate a new characters or two so we’d need a more scalable IA to tackle characters in the Simpsons! Think ahead…

Navigation

Apologies - this is going to be a little long-winded but that’s because there is a lot to touch on, and we’re really only touching the surface here - so think of this navigation discussion as a round-up of things you’ll want to consider that impact UX and commercial outcomes.

Link Types

Website navigation in its simplest sense is a link (hyperlink) to somewhere else (a web page, a file or document). Often links are grouped and placed in panels to create defined spaces for navigation (e.g. primary navigation, secondary/tertiary, administrative navigation in the header or footer). Let’s look at the link types that go to make up navigation.

Hyperlink

This is the generic name for a link on the web and the thing that converts an index of documents into the hyperlinked web! A hyperlink works by requesting a new page/document from a server which is then delivered to the users browser (client side).

Text Link (Hypertext)

This is often called link text or anchor text (the HTML tag used to create links is called the anchor tag) and is the link type that is most accessible to humans and search engines as the words describing the link destination are there in the link itself as text.

Strange Corporation

This is the link type that provides the greatest commercial benefit as it affects search engine optimisation and link analysis most readily.

Image Link

This is where the HTML anchor tag <a> has been placed around an image allowing it to act as a link. Because an image link has no text (so to speak) both the image’s alt atg and the wrapping link’s title-attribute need respectively to explain 1) what the image is and 2) where it goes. Notice in the code below how there is no actual text between the anchor tag in an image link - just the alt tag text.

This is why this type of link is less suited for search engine optimisation and accessibility as neither the spider or human using a screen reader genuinely knows what is in the image and are entirely reliant on the alt tag being accurate and meaningful.

Image Map Link

An image map is a plotted HTML link zone that can be superimposed on an image allowing the plotted zones to be used as links. Again, just like an image link because there is no inherent text within an image it is not ideal for SEO; you must also ensure that each plotted polygon has an appropriate alt tag to explain where the link is going.

JavaScript Links

This client-side scripting language is ubiquitous in web browsers and a driving force behind dynamic functions we tend to now take for granted. JavaScript links can be initiated from a variety of elements in the Document Object Model (DOM) and user interactions. The thing to remember about JavaScript navigation is that it is largely inaccessible to search engines and many users with accessibility issues (Google however, does now follow very basic JavaScript links) .

Therefore, it is strongly recommended that any JavaScript link functionality that you provide is backed-up with a more accessible HTML alternative to ensure humans and the search engine spiders can get to the same link destinations.

Form Submit Button

The submit element within a form is a link and makes an HTTP request when clicked. Example submit buttons from left to right Amazon, John Lewis and eBay are shown below.

Submit bttons are usually associated with important call-to-action functions - therefore, the copy used in the text will have an important influence on conversion rates and user response levels.

Form Elements

Other elements within a form such as an option-select drop down menu can be used as navigation elements, but these are not links in themselves, but merely ways of triggering JavaScript links or using JavaScript to initiate a hidden form submit button.

Flash/Silverlight/Apps

Web based applications such as Flash and Silverlight can deploy links in a whole range of ways; but in the simplest sense they still fire an HTTP request. Like images, which are not text based, Flash & Silverslight, and any other web apps need to consider accessibility for humans and search engines during development, and alternative functionality needs to be available if the app cannot meet this need!

Navigation Design Tips

Here’s a quick list of consideration for any navigation design you do:-

Compact - screen real estate is at a premium - don’t waste it on navigation if it can be made more compact

Logical menu structure - don’t confuse users - keep it simple - don’t create weird hierarchies or coin new words - don’t display unusual relationship between topics/things (so displaying groceries by country of origin might be cool, but most shoppers are used to more traditional hierarchical groups in their supermarket).

Self evident labels - Definitely take the Ronseal stance with navigation menu labelling “It does exactly what it says on the tin”. Make it no-nonsense plain language with clarity and context. What is the topic/thing - then call it that!

Intuitive functionality- the navigation must work in a manner that anyone can understand merely by using it.

Fast - the download and response times must be quick (almost instantaneous) - good lean coding and use of caching will ensuring this.

Browser compatible - your navigation must work in all the major browsers if you don’t want to lose visitors or give them an awful user experience.

Scalable and future proof - your navigation has got to use technologies that will survive (HTML/CSS and JavaScript solutions are going to give you longevity). Likewise you need to consider how your business and website structure might change. Does your navigation provide scalability? If you needed to double the number of products you offer can you do this? If you stop offering something can it be extricated with out leaving a conspicuous hole?

Navigation Types & States

When considering navigation design you need to think about the navigation states you’ll require; what needs to be shown everywhere (global navigation); will the navigation interact with the user (conditional navigation); what scalability is required and how will you sort topics/silos (secondary navigation and taxonomy/facets); lastly do any areas require access to be restricted to allow only certain types of users (logged-in/registered users)?

Lets take a quick look at navigation types/states:-

Global Navigation (Persistent) - As the name suggest global navigation appears on every page of a website and is the top level navigation’s hierarchy.

It usually consists of the primary navigation (see Apple’s example above), administrative header and footer navigation (see John Lewis’s example below) , search and sometimes search widgets/guided search tools. The global navigation should be those links considered a sine qua non to commercial success and your users’ needs.

Conditional Navigation (Persistent/Non-Persistent) - These are links that appear through interaction with the user (i.e. a conditional state has been met). Classic conditional navigation examples are roll-out/drop-down navigations (see Dell’s example below), AJAX search widgets and links found on tabs when in-page tabs are clicked on the same page. When conditional navigation is constructed using HTML/CSS it can be entirely accessible to both humans and search engines.

However, care and consideration must be taken when deploying conditional navigation as:-

1) Links are often initially hidden (and therefore their presence must be signalled to users or inferred by users based on “convention”)

2) It is all too easy to make conditional links inaccessible to humans and search engines if one does not consider how things work without JavaScript running the show. We’d strongly recommend having an HTML/CSS back-up methodology that works without JavaScript .

The main advantages of conditional navigation are:-

1) It does not use much screen real-estate until the users wants to navigate, at which point more options become available

2) Many levels of navigation can be shown to the user without the user having to navigate off the page they are on saving time and clicks when navigating

3) When built using flat HTML/CSS but driven with JavaScript it presents search engines with a flat-linear access to all your important links, often nicely categorised - in effect providing your website with a large global navigation inventory/site map of the important pages. Good search engine fodder!

Secondary Navigation (Non-Persistent) - These are links to sub-pages such as categories and subcategories or silos under the primary hierarchical tier (see John Lewis’s example to the right). Traditionally these have been deployed in the left-hand or right-hand columns, although this is by no means universal. Secondary navigation can be deployed as a contextually persistent element (i.e. always visible within the relevant category) or in a non-persistent fashion (i.e. as conditional navigation).

The key to good secondary navigation design is clearly expressing the grandparent-parent-child page relationship and how the users navigates up or down the hierarchy. A user needs to know:-

• what is available on the current level (sibling pages)
• what is above the current level (parent and grand parent pages)
• what is available  below the current level (child pages).

This needs be made obvious - use category indication (labels saying where you are e.g. “Men’s Boots” if you in the men’s boots section) with links to parent categories made clear and spatially relevant (e.g. the “Men’s Footwear” parent category link needs to be near/adjacent to the link for the current “Men’s Boots” page).

The current page should be indicated as being active with the link state indicating “this page” is active within the navigation panel.

Same level sibling navigation must be placed adjacent to the active page link.

Child level sub-navigation should be indicated visually using labels and/or visual communication techniques such as indentation, iconography and colour indication.

Breadcrumb Navigation - This is a classic example of secondary navigation providing a means of navigating up the hierarchy of a taxonomy and giving the user a sense of website geography/hierarchy:-

Great Grand Parent Page > Grand Parent Page > Parent Page > Current Page

Whilst providing a means of navigating up the hierarchy, breadcrumb navigation cannot help users find child or sibling pages, only parents and grand parents - so you can only go up, not down. Therefore, another means of navigation is obviously required to go down to lower level pages.

In-Page Tabs & Content Visibility Links - Many website use HTML/CSS to alter the CSS visibility/display states of HTML elements, thus either injecting/removing content or displaying alternative content in the same space. The advantages of this are:-

• More compact page layouts
• No need to refresh the page for additional content
• All the content can be seen for accessibility purposes (to humans and search engines alike)

The downsides to having variable display states are:-

• Users may not spot the hidden content - it needs to be signalled clearly with obvious visual communication
• It is technically spam (hidden content is frowned on by the search engines) - however, it has becomes so ubiquitous that it is unlikely this will cause an issues if implemented moderately.

Restricted Navigation (Non-Persistent) - There are often areas of a website you only want available to certain users (e.g. registered users) Generally any of the above types of navigation can be used in areas with a restricted view - so as a type of navigation “restricted navigation” does not really exist - it is merely a way describing access.

The reason for mentioning it is that it is “restricted”! Therefore you cannot have a login area (members zone or such like) and expected restricted data to be indexed by search engines/be publicly available. So you need to plan carefully what is fully accessible, and what is not.

Navigation Methodologies

So now we know what types of links are available, let’s look at some methodologies used to deploy them and some of the ingenious solutions that have evolved to deploy navigation IA.

Horizontal Bar

This is a very common form of navigation, usually constructed using the <UL> HTML element with the list-items deployed side-to-side (controlled via the CSS).

This type of navigation is typically going to be used for the primary navigation.

Vertical Menu

This is also a very common form of navigation and in most cases will use almost identical HTML as  found in the horizontal bar - with an unordered-list container holding the list-items which wrap around each of the links themselves.

This type of navigation is typically going to be used for either the primary or secondary navigation depending on the size of the offering /information resource that needs to be accessed. Bigger websites will tend to use this type of menu for secondary/tertiary navigation.

Dynamic Menus - Roll-out Menu

The roll-out menu uses HTML/CSS (sometimes with JavaScript) to display the menu on-hover (sometimes on-click) using either the anchor element’s pseudo class a:hover or the DOM to enact the menu appearing.

Caution should be taken if considering  nesting child sub-menus off the roll-out menu as these have proven to offer weaker usability performance. Also when adding additional sub-menus to a roll-out navigation you need to consider page width. There are many small screen resolutions form factors entering the market (hand-hand devices and smart phones) so overly wide navigation relying on hover-states to remain open can impair usability (fiddly stuff on a phone, netbook or tablet) so keep these menus as narrow as possible.

Dynamic Menus - Drop-down Menu

Like the roll-out menu, drop-down menus can use the same HTML/CSS and JavaScript techniques.

Caution should be taken not to make the menus to long/deep as this will also impair usability and prevent some users being able to navigate as desired.

Obviously you could make this a roll-up menu, but users might find this a bit confusing as it is a bit unconventional; and unconventionality usually means lower conversion rates - so it needs to be very intuitive if you plan on doing something original and innovative.

Dynamic Menus - Drop-down Panel

This is a variation on the drop-down menu theme. Instead of showing just the immediate child pages this technique will often show either categorised child pages with heading elements or grand-child pages with the child pages forming the categorised heading links in a large panel which can accommodate more links.

The advantages are:-

• You can show a lot of links in a organised fashion without the users having to navigate of the current page
• You can access these links from every page of the website when applied to the primary nav as in the example from John Lewis
• The links do not clutter the offering or take vital screen real-estate until needed.

The disadvantages are:-

• You need to be careful of the size of the panel and you users’ screen resolutions
• The links are hidden unless the user interacts with the primary navigation.

Dynamic Menus - Scrolling Menus

Like most dynamic navigation, scrolling navigation can be made usable and accessible or not! However, the nots tend to be a bit more prevalent with this type of navigation. So double-check with your web development team that any deployment is fully accessible. If it does not work without JavaScript it is probably going to be inaccessible.

Horizontal and vertical scrolling navigation allow you to provide more links in a limited space which can be an advantage in many circumstances. However, be aware that unlike “hover state” type reveals for navigation elements, a scrolling navigation is much more difficult to interact with and a significant reduction in usability is consequent - so use judiciously and sparingly.

Dynamic Menus - Carousels

Carousels are innately inaccessible as they rely on either JavaScript (via libraries such as JQuery) or third party programmes such as Flash or Silverlight to provide the lateral flow function. So when you use a carousel you must either provide an alternate navigation methodology or build the element so it degrades elegantly into some form of HTML/CSS equivalent.

The advantage of a carousel is that they provide slick and high-gloss to the UI and a richer more engaging experience - so they certainly have their place and appropriate deployment - just make sure you provide an accessible alternative.

Dynamic Menus - Accordion Menus

Accordion menus dynamically open and reveal child links when the parent link is either clicked or hovered over. Again the advantage of this technique is that the “pancake” is more compact and parent-child relationships become more clear (as child pages only appear when you interact with the parent link). Below we can see an “accordion” on the Apple website opening and closing with three different categories as the active element with their child sub-links being displayed in each case.

Generally these menus will be built as a standard vertical menu, with the hiding of the appropriate child links being handled by JavaScript - consequently this usually means they are completely accessible unless implemented horribly!

Search Widgets / Search Tools

These are glorified pre-populated forms that help guide your user searches. They let users know what you’ve got from pre-defined list. You can jazz them up with client-side scripting and frameworks such as AJAX, but again remember they must work without the JavaScript/client-side scripting to be accessible.

The advantages of search widgets is that they allow users to quickly discover what’s in your offering and get to what they want to find. Search widgets work best when all/most parameters are known in advance and the data is well structured based on the attributes used in the widget.

Faceted Search

Similar to search widgets, faceted search breaks down your offering into attribute silos. Most faceted search layouts will use either vertical or horizontal HTML links with the number of results associated with a facet indicated in the link text e.g. Apples (23) Oranges (4).

See John Lewis’ example to the right for LCD TVs.

Some faceted search will dynamically update in-page without a refresh using AJAX/clinet-side scripting to give you a running tally of your selections. However, like everything else we’ve mentioned, to be accessible you’ll need to be able execute HTTP requests for facet combinations without the use of client side scripting (i.e. a standard URL request to get the combination of facets desired).

Faceted search is ideal for complex offering with many possible choice combinations, allowing users to whittle down the results to just those elements they consider important to the purchase or information search and seeing all results that match their criteria (a key element in the purchase decision cycle - evaluation of the criteria).

Filters, Sort & Paging/View Functions

These elements allow users to make sense of category search results found on most ecommerce solutions.

Filters - These allow you to include or exclude results - generally this will be based on the “select” form element which appears as a drop-down menu, but sometimes a free-text input field can be used with include/exclude selection drown-down options or radio buttons. The similarities between filters and faceted search are largely semantic to many users - for them the end results are the same, namely keeping in or keeping out what they want or don’t want respectively. Classic ecommerce filters include:-

• Brand/Manufacturer
• Price Range Brackets
• Size/Weight/Volume/Dimension Range
• Colour/Style/Finish

Sort functions - these allow you to order the results of a category page as you desire. Often these are just ascending/descending arrow links. Classic ecommerce sort functions include:-

• A-Z ascending/descending
• Price ascending/descending
• User Rating/Review/Satisfaction ascending/descending

How you implement your default view state can have a significant impact on commercial outcomes

Page view functions - these determine how many items appear in a category result set.  How you implement your default view state can have a significant impact on commercial outcomes. Too many products/results will increase server load and increase the amount of data that must be downloaded.

However, many years of user testing by UX professionals and ecommerce retailers has shown that users prefer more rather than less results when they look at a category - they want to see what you’ve got! With the mouse-wheel being ubiquitous people intuitively scroll down - however, they’re less likely to hunt for and click on the “next >” link.

So your default view state (the number of results shown on a category) is a significant commercial decision that you must finely balance between:-

• how many products/results you have in any category
• how many results can be displayed without slowing the page (to the point of UX impairment)

In addition to the default page view limit, it is strongly advised to offer users their own choice of items to be viewed on a page with a range of page view limit options in a select drop-down menu (e.g. “View 10, 20, 50″ results or whatever ranges suit the offering best).

Consult your web analytics to see what users are doing and which view state is most popular - this might be the quickest and easiest way to determine what suits your website, offering and audience best when it comes to your default page view.

Paging functions - these are closely tied to page view functions as they determine how the user gets to the next page in a results set when the number of results is greater than the current page view number. These are generally simple links with Next>, <Previous, Last>>, <<First and numbered page links.

Filter, Sort & Page View Accessibility - Filters, sort  and page view functions require a visible “submit” button when viewed without JavaScript/client-side scripting to ensure these form elements are fully accessible as the select drop-down and other form elements used to provide this functionality cannot directly submit data to the server. A visible submit button makes life easier for the user not able to use client-side scripts.

Filter, sort, page view and pagination functions are generally presented in a single bar across category results pages. It is strongly recommended that the bar is present at both the top and bottom of the results set as this improves usability.

Tags/Tag Clouds

Tag clouds are clusters of links based on keywords that have been tagged to data. One of the key advantages of tag clouds is that they generate an “organic” link architecture - i.e. this is a user/author generated link architecture that develops of its own accord as data is published with its associated tags.

Tag clouds often use variable font size to visual communicate relative importance/weight within the results set - the more articles/results that contain a tag for a keyword, the bigger that tag appears in the “cloud”

Tags and tag clouds are particularly useful when:-

• applied to user generate content (UGC)
• the primary data is non-textual (e.g. images, video, audio)
• the primary data is not self-contextual (data sets, non-prose textual data such as programming code)

By adopting users tagging large document sets can to some degree overcome metadata deficits and the expense of adding metadata post hoc within a formal schema.

So in short allowing data to be tagged by users makes the data more useful and accessible - which is good for everyone.

Structure

So we’ve taken a look at navigation (the means of getting around the website) but now we must turn to the structure of the website itself. This is a serious business, as structure affects everything in IA.

Types of Website Structure

There are two types of structure you can employ to present your data based on classification models used to order/sort stuff in all fields of life. These are:-

• Taxonomy
• Faceted Search

Taxonomy

A taxonomy is a pre-defined hierarchical order of things; so websites using a taxonomical structure have “Parent-Child” relationships between web pages. There is a family tree like structure with the home page as the eldest relative, under which are the first generation of children - the main categories, and under these sit the categories, the subcategories on so on, until you reach the end of the branch where document pages reside (content/product pages).

Because taxonomies rely on the grouping of related things within each branch it is necessary for the information architect to ensure that these groupings are logical to the user. The information architect must also be highly conscious of “branching” i.e. how many things are in each category.

Rule of 5+/- 2

Humans retrieve information best when there are between 3 and 7 items (know as the rule of 5 plus/minus 2 as the optimal number of items is 5) so the development of any “tree” needs to be mindful of this user requirement. Often you’ll be faced with a reality that cannot be circumvented and more than 7 items will be required in a menu structure, so this is why clarity in the navigation design and layout becomes even more important.

Keyword Research & Search Engine Ontology

Keyword research to help define and populate your naming scheme (nomenclature) is one of those oft overlooked and undervalued things that needs doing to ensure better commercial outcomes.

Because taxonomies rely on a pre-defined nomenclature for branching elements (categories and subcategories) careful selection of keywords used for each element is recommended.

Search engine algorithms gain their understanding of data and what they’re looking at (ontology) by looking at the linking relationship (link architecture or structure) between web pages and what those web pages contain in textual content. Therefore, a taxonomy and what you name things has two really important functions:-

• Taxonomy naming (nomenclature) using relevant keyword increases the likelihood of receiving increased levels of relevant search engine traffic for specific and related keyword terms
• Your taxonomy’s nomenclature affects the semantics of other keywords within the “branch” (tiers below and above) as the search engine can better infer context and comprehension due to keyword relationships - which increases accuracy and therefore, relevance - improving search ranking.

You’re looking to identify and use the most likely keywords your target audience will associate with the topic of the branch in the taxonomy. In do so you significantly increase the likelihood the search engine will find your offering relevant for the desired topic.

Maximising the benefits of organic search algorithms by using the most sensible keywords in your category naming is going to help drive more relevant “qualified” traffic to your website. As organic search traffic is free, this is going to create low-cost high-converting traffic opportunities that you’re less likely to receive when keyword research is eschewed.

Website Scalability

As mentioned in the introduction, one of the biggest shortcomings in website IA design and schema is not anticipating growth or changes in the offering.

So be mindful of the need for a basic flexibility in your structure and the ability to generate new branches within any topic or remove existing branches without having to rebuild the website.

Any half-decent front-end templates of a content managed website should employ a basic level of flexibility and dexterity with regard to website structure. So if you’re currently planning or preparing a website build project brief for an internal team or 3rd party developers/agency do make sure this is part of the conversation, because once something is hard coded (i.e.inflexible) it becomes a great deal more expensive and time consuming to put right what should have been there from day one.

Faceted search

Faceted search (faceted navigation/browsing) is a linear/flat structure with no real hierarchy. It is based on attributes associated with document pages so all structure is organic in the sense that your offering/inventory attributes define the criteria by which users can search.

Very few true faceted search websites exist; most are hybrids using a mix on traditionally taxonomies to handle the basics and faceted search to handle criteria selection in the offering/inventory.

The key to an effective faceted search implementation is it needs to be self evident how it works. So keep the user interface (UI) simple.  Some basic advice would be:-

• Show available facets as links or check boxes + links as this make them crawlable by search engines - select menu items are not - so another route in is required if you want your facet combinations indexed by the search engine spiders
• Indicate how many results are associated with each facet
• Keep faceted search links/functionality in the same place
• Allow users to add/remove facets from the list
• Allow users to search on one facet or combination of facets and then refine their search further by adding more facets
• Allow results to be sorted using addition functions - i.e. not native to the facet logic as this will provide greater flexibility to the user to control the data - filtering will remain controlled through facet selection

We could discuss faceted search and navigation at length, but it is the initial planning phase where things can go awry with significant implications so let’s take a quick delve into that and we’ll look in depth a faceted search in general at a later date…

Data Structure & Keyword Manipulation

When planning your website architecture the key to successful and useful faceted search implementations is the granularity and consistency of your relational database’s data set for each row item (product/offering).

You need to think of all the different attributes you can associate with an item and then define attribute-pair values for each (i.e. the attribute name and its value) consistently to all items. For example let think about a pair of Levi’s® 501 Jeans. What attribute-value pairs would this item present?

Example Attribute-Value Pairs for Levi’s ® 501 Jeans

• Gender: Men’s
• Manufacturer: Levi’s ®
• Style: 501
• Model: 005010460
• Fit: Standard Fit
• Fit Leg: Standard Leg
• Fit Fly: Fly Button
• Material: 100% Cotton
• Material Weight 13.5oz.
• Fabric: Denim
• Generic Type: Jeans
• Type Synonym: Trousers
• Colour Generic: Blue
• Colour Specific: Heavy Stuff
• Finish: Vintage/Distressed
• Retail Price: £60.00
• Size: 32/32
• Detail #1: 5 pocket
• Detail #2: rivetted
• Detail #3: rear pocket red tab
• Detail #4: brand logo /size patch

As we can see, a simple pair of jeans can have quite a few attribute value pairs, and most of these could conceivably be used within the context of faceted search. So the more granular you can make the data you hold for each product the more you can do with it.

Keyword String Concatenation

Likewise, granular data allows you to not only drive faceted search logic, but it also allows you to dynamically present textual-string data through concatenation in ways that offer optimal use of the code flow for search engine consumption.

In English, that means you can cut and re-cut the data to form sentence structures for things like the Title, Heading, Breadcrumb, Links, Unique Selling Points and Benefit Statements using different combinations of the data. So from the example above we can create many different concatenation from the array of data to describe the same product:-

• Levi’s ® 501 Denim Jeans
• Levi’s ® 501 Jeans 100% Cotton
• Levi’s ® 501 Jeans 32/32
• Levi’s ® 501 Jeans 32/32 £60.00
• Levi’s ® 501 Jeans 32/32 Blue
• Levi’s ® 501 Jeans 32/32 Heavy Stuff
• Levi’s ® 501 Jeans 32/32 Vintage/Distressed
• Levi’s ® 501 Jeans Fly Button
• Levi’s ® 501 Jeans Standard Fit
• Men’s Levi’s ® 501 Blue Jeans
• Men’s Levi’s ® 501 Denim Jeans
• Men’s Levi’s ® 501 Jeans
• Men’s Levi’s ® 501 Jeans 100% Cotton
• Men’s Levi’s ® 501 Jeans Fly Button
• Men’s Levi’s ® 501 Jeans Standard Fit

How we use these data strings or any other conceivable concatenation to influence search engines and present the data in the most favourable light (i.e. where to put what data) is where IA structural design and search engine optimisation (SEO) come together. This is where some of the biggest commercial benefits with IA planning can be found.

If you’re planning new ecommerce website we’d recommend you talk to an IA/SEO specialist as part of the process to outline where and how you can reap the most benefits from your “potential” data and the real opportunity cost associated with generating more granular data as part of the product database population process.

The key is to tie the concatenated strings (your optimised keyword combinations) into the HTML elements that directly support the faceted search combination page. So if the facet search combination page is a category for the following facets:-

• Men’s
• Jeans
• Levi’s ®
• 32″/32″
• 501

Then the category page itself and all the pages shown in the listing need to have relevant keywords in the right HTML elements that the search engine is going to evaluate.

A quick summary of those elements might be something like this:-

• Category Page HTML Title
• Category Page Meta Description
• Category Page H1 Heading
• Category Page Faceted Search Function Panel / Breadcrumb
• Category Page Link Text
• Category Page Thumbnail Image Alt Tag
• Category Page Listing Call-to-Action Button
• Product Pages  HTML Titles
• Product Pages Meta Descriptions
• Product Pages H1 Headings
• Product Pages Summary / Description
• Product Pages Attributes / Specification Tables
• Product Pages Image Name, Alt Tag & Caption
• Product Pages Related Product Link Text

By having granular textual data you can ensure that the concatenated strings are grammatically correct and provide meaning and context (semantic optimisation) within each HTML element. That helps information retrieval systems such as search engines understand what a web page is about - any you’ll be rewarded for making your offering clearer and easier for them to understand with increased relevance and search engine rankings.

Getting Around

Let’s be clear about IA and user experience - many of your users are not going to browse and navigate their way down through your website hierarchy to a product page - they’re going to use the internal search function.

However, and this is the really important commercial tip - you IA has a dual and equally important function of explaining your website and its data to the search engines - which will be your main source of traffic in any decent online marketing strategy.

Internal Search

The ultimate faceted search is the natural language internal search function and it is often going to be the preferred means of getting around a website for many users.

Some basic thing to consider with internal search:-

• Make it easy to find
• Make it part of the global navigation - i.e. on every page
• Make the call-to-action button say “search”
• Don’t suck! - give relevant result

The last of these criteria is easier said than done. Often a commercial-off-the-shelf (COTS) ready made solution is going to get you the best results, so if developing your own website we’d recommend avoided tackling your own information retrieval development and simply plug a reliable third-party proprietary system that’s within your budget into the website. This way your result might prove relevant to your users!

Where Am I? User Location Indication

Another function navigation performs is to let user know where they are. This function is two-fold:-

• For users browsing through the website
• For users landing on the website via deep linking such as from a search engine results page (SERP) or email campaign

It is important to provide a clear indication of where they are and where they can go. This is called providing “information scent” and it is key to tackling the bete noir of conversion - user uncertainty. So a little checklist for providing users with a sense of website geography would be:-

• Place navigation in conventional locations
• Make navigation obvious
• Make grandparent - parent - child page relationships clear
• Indicate active /current location links
• Use a breadcrumb
• Use a hierarchical HTML title structure
• Use a category indication subheading

What Next

Well, that’s it for now. In the next part we’ll discuss how humans and computer/machine systems retrieve data looking into things such as behavioural economics, persuasion and the limbic brain and search algorithms and how these all tie into IA design and UX planning.