Links and Label Names: Be Specific

Make sure users can easily understand your navigational labels. When people are in navigation mode, they usually ignore large blocks of content and home in on links to glean the site's meaning. Keep link names as brief and specific as possible to maximize scanning. Clever made-up words or category names are problematic because people don't understand them. If you must have clever names, always explain their meaning. People tend to skip over meaningless words.

Tighten up your links by starting with keywords or an information word. Remove extraneous words, such as repeating your company name in each link; this adds unnecessary complexity to the interface. Links that start with identical or redundant phrases require people to carefully read all of them to glean the differences.

Don't use generic instructions such as Click Here as link names. Instead, help people quickly differentiate links by giving them informative names. Rather than just linking to More, for example, tell users specifically what they'll get more of.

Help people quickly differentiate links by giving them informative names. Rather than just linking to More, for example, tell users specifically what they'll get more of.

(Facing page, top) Old design: Vague words and category labels such as discover, learn, and live annoyed our users. Some wondered what "live: with our products" meant. Even with the description, the wording is trite and unclear. A label such as "how to have a healthy lifestyle" would provide more useful information. Catchy names are useless if they don't help people predict what's behind the link:

"The topics aren't what I think they're going to belike Head to Toe Solutions should be Body Wash or something like that."

"I think this is hard to do. There aren't enough categories to quickly find what I'm looking for."

www.bathandbodyworks.com

(Facing page, bottom) New design: After we had completed the test described in the previous figure, Bath & Body Works redesigned its site. This homepage replaces vague category names such as learn and live with more direct ones, such as Face, Hair, and Articles & Advice. Good move.

www.bathandbodyworks.com

BBW never stops. As we were finishing this chapter, the company launched yet another redesign, this time with more descriptive navigation labels. Even though the label Face would be too obscure on most Web sites, we thought that it was acceptable here. Yet even on this site, the new, more explicit label Facial Skincare has stronger information scent and thus works better at directing users to the products they want to buy.

www.bathandbodyworks.com

Old homepage: The British government's revenue and customs site homepage provides facts about Value Added Tax refunds and other information of interest to travelers with descriptive links such as "Your customs allowances" and "VAT refunds for visitors," which tell users exactly what information is behind them. The site smartly places commonly used links in the main area of the page, free from many other distractions.

www.hmce.gov.uk

New Homepage: Unfortunately, this redesigned homepage is a definite downgrade in usability because the headers, links, and navigation don't say exactly what they mean. For example, what is "eVat Services"? If you just traveled to the U.K. for vacation, what would you click on to see how you can get your Value Added Tax refund? There are many places that say VAT, but which one is the best choice? In the old design, there was an obvious link that said "VAT refunds for visitors," but this no longer exists. Bad move.

In general, it's almost always a warning sign when you find yourself using names that start with "e" or "Internet." Users know that they are online when they are accessing a Web site, and there's no need to call further attention to this fact by cyberfying the names of your services.

www.hmce.gov.uk

The generic "Learn more" links sprinkled throughout the American Heart Association site don't help guide users to the areas of interest. People can't quickly scan the links to get the gist of their meaning. Instead, they are required to read the caption, which unnecessarily slows them down. It's better to explicitly tell people what they'll learn more of than to tease them with links that don't contain pertinent information.

www.americanheart.org

People find it difficult to differentiate between meaningless category names such as Club and Passbook. It's nearly impossible to glance at the options and decipher their meaning without clicking on each. This type of navigation requires too much work.

www.dimewill.com

(Facing page, top) Old design: This car site stumps users because its vehicles are organized by model name. This is fine for people who are familiar with Honda models but not for those who aren't. Users in our testing wondered what kinds of vehicles the different models were and didn't know, for example, the difference between an Odyssey and an S2000. While there is an All Models link at the bottom of the list, many people overlooked it.

www.automobiles.honda.com

(Facing page, bottom) New design: Honda improved its navigation categories slightly in this redesign. Note that the link previously labeled Odyssey is now Odyssey Minivan and that S2000 has been changed to S2000 Roadster. These changes are not much better than band-aids, though: They dress the wounds without curing the disease. It would have been better to design a navigation system that clearly explained the difference between the models rather than still requiring users to navigate by model.

www.automobiles.honda.com

This page does a better job of depicting the various models by including prices and photos. The images help provide an indication of the vehicle type. However, the photos are relatively small and many of the models look very similar, making it difficult to ascertain, for example, if the Civic Si is a minivan.

www.automobiles.honda.com

(Facing page, top) This site does a good job of classifying vehicles because it employs terms that people understand. Rather than assume that users are familiar with Ford model names, it uses simple and familiar terms such as Pickup Trucks and Minivans/Vans, which are more helpful than model names.

www.ford.com

(Facing page, bottom) Flooring types on this site are organized by product line, and not by traits. This structure might make sense for Anderson employees, but not for potential customers who search products by attributes. Names like Appalachian and Biltmore may be meaningless to users. When site designers feel it's necessary to provide instructions for how to navigate their site, it's a sign that the interaction design doesn't work. Better to meet people's expectations than expect them to meet yours.

www.andersonfloors.com