Articles
Reinforcing location
14 July 2007
Getting lost within a website is not uncommon. The lack of tactile pages and a table of contents presents a challenge that many designers fail to consider—how do you help users understand where they are? Throughout my experience as a website designer I’ve developed a few techniques that I now incorporate from habit. Most in the profession will not learn anything new from this. Nevertheless, I’d still like to share.
Use the title tag.
At the very top of your browser window, you’ll notice some text. That valuable space should be filled with the contents of the title tag, yet far too many inexperienced designers simply repeat the name of the site, or worse, leave it blank or “Untitled.”
Why is this bad? Two reasons: browse history and search engines. If the user views the web browser’s history, they are shown the title tag of each page they’ve visited. Naturally, a more descriptive title, such as “Nuts & Bolts,” will be far more helpful than “Untitled” or “Smith Hardware.” Search engines also rely heavily on the title tag when spidering websites, so it’s even doubly important fill it with appropriate text.
Clearly title each page of the website. (Not to be confused with the title tag.)
The moment after a user selects a link to delve deeper into a site, they have some expectation of what they are about to see. A large, easy-to-read page title that repeats the text of the selected link is a simple method for reassuring the user that they’re in the right place. “I clicked on ‘Nuts & Bolts’ and the new page says in large type ‘Nuts & Bolts’—that’s where I want to be!”
Also, if you’re trying to decide what to put in the title tag, this is a good place to start.
Highlight the current page in the site’s navigation.
Once a user makes a selection from a site’s navigation, the new page should then show that selection as “highlighted”—different in someway from the rest of the navigation so as to appear selected. For example, if the navigation uses a tab styling, the current location should appear as the front-most tab while the others recede slightly. Done well, this can almost eliminate the need for large page titles (but I wouldn’t recommend it!).
Use breadcrumb trails, especially on larger sites.
One little line of text easily explains where you are:
Home >> Nuts & Bolts >> Stainless Steel Bolts
I prefer to place them right above the page title and link them all to their corresponding locations. The last I leave unlinked since it indicates where you currently are.
Always provide an easy link back to the homepage.
Linking to home is the equivalent of allowing the user to start over. And while making the logo always link back to the homepage is certainly a common convention, don’t expect all users to know about it. The homepage should be treated like any other section of the site and given its own link in the main navigation.
If you are forced to only use the logo as a link to the homepage, at least add some visual indication of it being a link. Something as simple as a left-pointing arrow and the word “Home” can help greatly.
Whatever you do, be consistent.
No matter what technique you use, apply it consistently. As with any part of interface design, users need to easily become familiar with the elements that are necessary for getting around, as well as recognizing where they are. Reinforcing location is simply another way of reducing frustration and making the user’s experience more pleasant.
