Principle 2: Make It Easy to Use
Making your site easy to use is, well, easier said than done. According to usability expert Jakob Nielsen, visitors trying to find or buy something on a commerce site are only successful about 56 percent of the time.5 Your company might have invested in blazingly fast servers and ruthlessly squeezed extra bits out of your graphics, but if every other customer can't use the search engine or find the shopping cart, what hope do you have of delivering a valuable user experience?
Vincent Flanders calls this rollover icon design "mystery meat navigation." As he says on his site, Webpagesthatsuck.com, "Web design is not about art, it's about making money (or disseminating information). To make money, you don't want to design a site that might confuse someone."
"Make the interface intuitive!" is the battle cry voiced by CEOs and designers alike. We all say this because we've been told hundreds of times that an intuitive interface will win us friends and customers. Unfortunately, there is no such thing as an inherently intuitive interface.
In his book The Humane Interface, Jef Raskin explains: "When users say that an interface is intuitive, they mean that it operates just like some other software or method with which they are familiar."
Yes, it's true. You don't have to explore the depths of your customers' collective unconscious to design an interface. A successful interface incorporates many familiar elements already established on popular sites. If it's familiar, then there is nothing new to for the site visitor to learn. The more your site follows standards and design conventions, the better chance it will be easier to use.
Learning from convention does not necessarily mean that you must sacrifice the appearance of your Web site. Rather, your site's interaction and response should be predictable. Imagine how awful it would be if the dial pad of every phone worked as differently, as so many sites' interfaces do. The number of phone calls would certainly plummet.
Designers sometimes wrestle with conventions. Developing something fresh and new is part of our job. However, there are some things that shouldn't be messed with. A classic example is the shopping cart (See Fig. 2.6). For years, companies have tried to use other metaphors for the cart and failed miserably. One clever outdoor products company tried a shopping sled. No one understood it. They converted to the cart and revenues took off.
figure 2.6: stick with the familiar
Retailers have experimented with different cart metaphors to build personality and brand identityæfrom the sled to the wheelbarrow. To avoid confusion, use what is most familiaræthe shopping cart.
Organize in a logical way
Your site's success will also depend upon your ability to organize information. But organization requires understanding your customer's goals.
In a Blockbuster store, you'll find your favorite Jackie Chan movies under the aisle labeled Action. However, if a brand new Chan film comes out, it can only be found under New Releases. Stores deal with physical products, so a copy of Jackie Chan's latest movie can't be in two departments at once.
Because of this limitation, Blockbuster minimizes the number of categories for the customer and reduces the risk of ambiguity. Ambiguity in the store arises when something can be categorized in more than one way, but can only exist in one location (i.e., "It's action-packed and funny but it also has a heart.") A customer looking for a
Chan film might first think to look under the Action section. If they couldn't find there, Comedy would be a next likely choice.
Online, you're not limited by the physical constraints. Categorization can be broader, but still effective. Ambiguity is averted by placing the Jackie Chan film in many likely areas: Action, Comedy, Martial Arts, Foreign Film, New Release, and Popular.
Some designers of commerce sites make the assumption that they can apply an offline organizational scheme to their Web site. Unfortunately, the two situations are not equivalent. First, your Web customers might not be familiar with the nomenclature or departments of your "bricks-andmortar" store. For example, the store might have a department called "Relaxing," which has recliners, massagers, TVs, stereos, and soothing CDs. Online, the products are more likely to be discovered in literal categories: Furniture, Electronics, Music.
Navigating your way through a retail store is different than searching for something online. In a store, because a customer can scan in a large amount of visual information quickly, it's easy to browse through thousands of items in minutes. Online, that would be tedious and unnecessary because you can present the customer with a categorization scheme that best fits what they want to do.
For example, you own a Mac and want to buy some learning software for your child. In a store, you might go to the Mac section, and be presented with ten titles. However, in the Windows section, there are another fifty titles labeled For Windows and Mac. You probably didn't think to look in that section. Online, you could be presented with all sixty at once and even be given the option to sort this list further.
There are several useful schemes for categorization:
Alphabetical: The most logical organization scheme for a dictionary or phone book. It is typically used to provide order within other schemes. For example, Blockbuster organizes by movie genre then alphabetically by title.
Chronological: Organizing by date is useful for subjects like automobiles, antiques, and wines.
Geographical: Organizing information based on place is useful for gardening, real estate, and travel. It's also valuable when location is relevant to buying, i.e., shipping costs or physical store locations.
Task oriented: Requires that content be organized as an outline of a process. For example: Select a home, find an agent, choose a mortgage. The organization reinforces the steps a customer needs to take.
Topical: More challenging than the first four options, designing topical schemes requires defining limits to the breadth of content. Do you want to cover every topic like the Encyclopedia Britannica or a focused few like the Discovery Channel?
Visitor specific: You might wish to design your information to fit into neat categories for different types of visitors, based on psychographic or demographic traits. For example, an apparel site might have site content arranged differently for women than men.
In some instances, you might need to use a hybrid of schemes. Figure 2.7 shows how a national retailer could take advantage of a mix of topical and alphabetical groupings. What information does your customer need and how they might be guided to a decision?
figure 2.7: rational organization
A navigation list needs some measure of order if it is going to be quickly parsed by the site visitor. Example 1 has no discernable logic and is not useful. Grouping and alphabetizing make a list easy to use.
Organize around a customer task so you can understand your visitors' goals. "Chunking" is an important principle for organizing site information. In 1956, a Harvard psychologist named George A. Miller published a groundbreaking article titled "The Magical Number Seven, Plus or Minus Two."6 In this article, he reveals that people are adept at recalling small chunks of information as long as there are no more than nine pieces, with seven being an optimal number. Breaking information into appropriately sized chunks improves comprehension and our ability to find and retrieve information.
Be clear, stay simple
Knowing that people need information to be presented in easily digestible chunks means our designs and navigation must be simple and direct.
This might seem obvious to you, but it seems to have been forgotten by legions of other designers. As an example, take the phenomenon that can still be found on many sites, which we call "concentration navigation."
Concentration navigation is one of the cardinal sins of interface design. A rollover button forces visitors to mouse over an icon to identify it and then remember it for future use. The problem is exacerbated the more icons there are to identify. A few years ago, a global soft drink manufacturer used a navigation bar similar to the first example in Fig 2.8. The fifteen icons are almost twice as many as Miller's "chunking limit." In an information-overloaded society, the last thing you want to do is force your customers to memorize your navigationÑbecause they won't.
figure 2.8: concentration navigation
Typically, using icons as the sole means for navigation does more harm than good. Here's an example of pitfalls found on a menu bar of a large soft drink manufacturer site and some possible solutions.
Another complication when designing a navigation structure is that your site does not exist in its own consistent world. It's an interface within an interface within an interface Ñyour site, within a browser, within an operating systemÑeach with its own look and feel. The combination can be the source of endless frustration. For example, if your site disables the browser back button or scroll bars, you are killing something that customers are already familiar with. This unexpected change will make visitors impatient and confused.
Designing in a nested environment such as this calls for simplicity. Once customers have found your site, don't scare them off with an overwhelming flood of animated graphics, intricate backgrounds and strange buttons. Your most important job is to engage them to buy, not to marvel at your design acumen.