Originally Published: October 9, 2009
Speaking navigation: Intuitive and effective
Carefully selecting a navigation label can be a painstaking process. As information architects and Web designers, we want to choose a word or series of words that provide an appropriate balance of generality and specificity. To this end, we can use trigger words, but struggle to avoid making the label too long thereby creating clutter.
Some navigation labels are easy. If you see a link to “Blog”, you can be reasonably confident that a person or an organization’s blog will load up.
What might be hiding behind “About”? Or “International”? What would you expect to find if you clicked on one of those links? Certainly, contextual embedding (the website you are on) allows visitors to make a good guess, but cognitively they spend more time considering it, which is the opposite of what Steve Krug argues for in his highly influential book Don’t Make Me Think.
Speaking navigation is a design trick to provide the best of both worlds. You can have a generic label, but it can then be accompanied by specific trigger words.
Let’s look at a few examples.
Note: Clicking on the screenshots should open a larger version.
NYU Poly (http://www.poly.edu/)
Poly uses single-word labels and accompanies them with short action phrases. They are easy to scan, and clicking on one you feel quite confident about what to expect on the other side (whether or not it’s there is another question).
The other nice thing about Poly’s speaking navigation is that the green text does not look separate. Each block appears to be a full visual unit. That is, you take in the whole of it as one option, not separate options. In a moment we’ll look at an example that makes you hesitate and think that the “speaking” text is something else you can click on (not an ideal situation).
University of Nevada, Reno (http://www.unr.edu/)
Nevada-Reno shifts gears from Poly in that their primary navigation is audience-based, not topical (compare the labels). Because the terms are somewhat less ambiguous, feed-forward speaking navigation is not terribly necessary to explain what’s behind each door. Also, the language used here isn’t as strong. “Alumni … Home means Nevada.” That doesn’t really give me deeper insight into that link.
George Washington University (http://www.gwu.edu/)
A college named after the first elected American president brings us back to topical sections. They also add a second level of navigation (hover menus) that show up as you move your mouse over the main label. Rather than use verb-based speaking text, George Washington is using noun language to add to the label. Interestingly, the verbs have been moved to be the main label for each navigation option. So the action is the label, and then nouns are used to further describe it.
- “Explore … our university”
- “Apply … to GW admissions”
- “Learn … about our academics”
- “Discover … our research in action”
There is a lot to like about this approach.
University of Pennsylvania (http://www.upenn.edu/)
The first three examples we looked at use a horizontal style of navigation that glides across the page. UPenn changes things up because they have a vertical, sidebar-style navigation structure.
Old-school Yahoo-style navigation involves a header with clickable links beneath it. That’s what UPenn’s navigation looks like, except that the text beneath is not clickable. So if I see the exact text describing an action I want to take (example: “Applying to Penn”), I can’t actually click on it.
While speaking navigation is generally great, the implementation used by UPenn could actually frustrate visitors more than if they were not using that extra text at all.
University of North Carolina (http://www.unc.edu/)
Note: I apologize for not including any site branding in this cropped screenshot, but it would have made the image excessively large.
North Carolina’s speaking navigation is similar to University of Pennsylvania’s in that the speaking portion looks like little links I can click on, but you actually cannot. At least the headers are in blue and look more like links than the smaller dark text beneath them does.
Discussion and future directions
Speaking navigation, when used effectively, is a brilliant compromise between short, generic labels and deeper feed-forward specifics. To put it another way, speaking navigation can be a valuable tool in creating information scent and guiding site visitors to a desired destination.
In terms of usability, speaking navigation probably acts along the satisfaction dimension. When you feel confident about the navigation choices you make, your perceived ease of use of that technology will increase. Speaking navigation could also act on effectiveness and efficiency by simply getting people to the content they want, and doing so quickly.
Further research on speaking navigation and its direct impact on usability is needed to perpetuate its use on the Web.
Did you like this article on speaking navigation?
Follow David L. Mulder on Twitter
