NextStage's Joseph Carrabis explains that making sure your website's navigation works is crucial for creating a happy customer experience.
In my last column, I started the conversation of designing Tourist-Friendly and Local-Friendly sites, and I'm going to continue that conversation with a technique that has proven successful in both sorts of sites: creating navigation landmarks. I introduced landmarks (or road signs) in another column about defining visitor action.
This time, I'm going to amplify that concept with some examples, while continuing our theme of devising non-obvious and powerful solutions to design problems.
Visitors didn't know where they were
A client asked for an analysis of their current site, and we noticed something so pervasive that all but two of 60 pages analyzed suffered from the same problem: visitors couldn't easily and quickly figure out where they were on the client's site. The problem was compounded by the following factors:
- Visitors were searching for something
- Tests indicated that visitors either knew or remembered that what they were searching for was somewhere on the client's site
- Visitors knew or remembered that what they were searching for was on the client site, but they couldn't remember exactly where they'd last found it
- Visitors became annoyed and/or frustrated when they couldn't find what they were searching for and left the site before completing their task or achieving their goal
This problem and its different facets is, of course, an example of poor visitor experience. You always want the visitor to have the best experience possible, to believe they've been successful and completed what they wanted to do and had a great time doing it (okay, at least an acceptable time doing it).
The task before us, then, is to provide landmarks that quickly explain each page's purpose, what can be accomplished on the page, next steps and how to find help (if necessary). The technique we're going to use is one you've already spent two weeks practicing because we discussed it in the Tourists & Locals column mentioned above.
Creating Landmarks
In Tourists & Locals, we figured out that the first step to creating a Local-Friendly site was to write down two to three bullets about what you do or offer and put that information on your Local-Friendly welcome page. We're going to take that concept and make it page specific.
The problem here is that people can't find what they want but know it's there. The solution is to provide clear and obvious navigation aides -- landmarks -- so that the visitor will know within seconds of being on a page if what they're searching for can be found on the current page.
Site search capabilities won't provide this unless your site search tools have semantic capabilities or your visitors can remember the exact terms used when they performed their search.
Landmarks follow these rules:
- They are obvious
- They are concise
- They show direction
Placing landmarks and making them obvious
Making a landmark obvious is the easiest of the three steps. You make the landmark obvious by placing it where people will see it and by drawing conscious attention to it.
People perform a very fast, non-conscious visual scan starting at the 10 o'clock position and ending there, so that's where the landmark goes -- in the 10 o'clock position of the webpage. This will be beneath the banner, just above the middle of the page, left hand side.
There are six colors everyone recognizes without question, black, white, red, yellow, green and blue. Pick one of these colors as your landmark color and use it consistently on every page on your site. Assuming your site is targeted towards western cultures (contact me for color choices if this isn't the case) give your landmark a reddish border, tinge, or use red fonts on it. Remember to do all these things within your page's aesthetic. Providing a landmark wildly outside your site's aesthetic is more a navigational hazard than an aide.
Landmarks are concise
This is where the two to three bullets come in. Product-oriented sites should label their landmark "You Are Here..." followed by a description of the page's purpose, content and takeaways -- the three bullets. Service-oriented sites may want to use "On This Page..." followed by the same three bullets. Product-oriented sites should include a call-out graphic that shows where visitors are in relation to the website's overall taxonomy when the products are distinct enough to be described on distinct pages.
In all cases, use small enough print so that the minimum amount of page real estate is devoted to the landmark and large enough print so that visitors can learn in a quick glance if they're on the right page or not.
Landmarks give direction
Visitors will tell you which pages are similar enough to each other that the pages are confusing at a casual or even intentional glance. They'll tell you this in your website logs. Look for flips and near flips, back-and-forths, between two or three pages on your site.
Remember: it doesn't matter if these pages look completely different to you, it matters that visitors were flipping between them and not others. This is often an indication that visitors found something similar on the pages or were referencing something from one page to another.
These back-and-forths become the "See Also" part of your landmark. Provide quick, no-nonsense links to these back-and-forth pages. You're providing direction to visitors based on where their online experience has demonstrated that they need direction. They were hungry for some Italian food, for example, and found Ristorante Toscana when what they really wanted was Angelo's Italian Sub Shop. Point them to Angelo's and they'll also remember that they found Angelo's via Ristorante Toscana and come back when they're ready for a bigger meal.
That bigger meal has many dividends to you and to whomever you're designing a site for.
- There's a much better chance visitors will have a positive experience navigating the site.
- You'll increase branding because chances are they'll stay on the site longer.
- You've increased upsell paths because the "Sub Shop" page now directs visitors to the "Ristorante Toscana" page when they either have or want a little more on their plate.
- There's a much higher probability visitors will become repeat visitors due to the items 1 and 2 above, which is the first step towards creating loyalty, which goes a long way in both B2B and B2C business.
Joseph Carrabis has been everything from butcher to truck driver to Senior Knowledge Architect to Chief Research Scientist. His 22 books and 225 articles have ranged among cultural anthropology, mathematics, information mechanics, language acquisition, neurolinguistics, psychodynamics and psychosocial modeling -- and other eclectic topics. His knowledge and data designs have been used by Caltech, Citibank, DOD, IBM, NASA, Owens-Corning and Smith-Barney among others. Carrabis is CRO and Founder of NextStage Evolution and NextStage Global, founder of KnowledgeNH and NH Business Development Network, and inventor and developer of Evolution Technology. Carrabis will be speaking about "Six Web Techniques that Get New Business" at the Sept. '05 MCAN management meeting in Baltimore. Come on by and introduce yourself. You can download sections of Carrabis' next book, "Reading Virtual Minds," at www.hungrypeasant.com.
