Site Navigation for Ecommerce

The two most common methods of setting up a navigation scheme for an ecommerce site are product indexes and product grouping. A direct index that lists items by manufacturer and product number is the fastest navigation method for someone who already knows what he or she wants to buy, but it is nearly useless for someone who is browsing for something, like an inkjet printer, and may not know one model from another. This person is better off navigating through product groupings, where a number of similar products are displayed on one page and can easily be compared with each other. A third, less common method of indexing products is by brand name. This is not as useful to most customers as the other two, but it pleases suppliers, and this is a factor that should not be overlooked by any retail or wholesale merchant, especially since co-op advertising deals through which manufacturers pay for some or all of a wholesaler's or retailer's promotional efforts on behalf of their products are starting to become as common online as they are today in newspaper, broadcast, and direct mail advertising.

If you must pick just one navigation method, product grouping is probably the most natural. It also lends itself best to information layering. The accompanying illustrations, from MexGrocer.com, show how product grouping and information layering work together.

Figure 3-4 shows the MexGrocer.com main page, the same one we saw in Chapter One. It's simple, it's easy to understand, and it gets right to the point, putting featured products in front of you as soon as it starts to load. There is no introductory page to get in your way, and you instantly know what kind of goods MexGrocer.com sells.

Figure 3-4. MexGrocer.com main page.

Let's assume your immediate interest is salsa, either because you're from Mexico and are now living in a part of the world where authentic Mexican ingredients are hard to find or because you once traveled to Mexico, liked what you ate there, and want to duplicate it at home. You probably don't have a specific brand of salsa in mind; perhaps your only experience with Mexican food was eating in restaurants, and you are not familiar with different brands or you have heard only of a few highly-advertised ones that may not necessarily be the best ones out there. Your next step on MexGrocer.com is to click on the "Salsas" link on the left side of the main page.

In Figure 3-5, you see some featured salsas and links to more, broken down by categories and brands. We don't know much about brands, but we know that we are going to use our salsa in our cooking, so we click on the "Cooking Sauces" link and go to a page that displays nothing but "Cooking Sauces."

Figure 3-5. MexGrocer.com "Salsa" product page.

We want to make enchiladas, and we like things mild instead of hot, so we click on "La Victoria Enchilada Sauce Mild" (see Figure 3-6).

Figure 3-6. MexGrocer.com "Cooking Sauces" category page.

In Figure 3-7, the description looks good, and the price, $2.99 for a 28-ounce can, seems decent. Shall we buy it now? (We can almost taste those enchiladas!) But what about our diet? Shouldn't we find out a little bit more about what we're talking about putting in our bodies? No problem. There's a "Nutrition Facts" link, and we click on it (see Figure 3-8).

Figure 3-7. MexGrocer.com "La Victoria Enchilada Sauce" product page.

Figure 3-8. MexGrocer.com "Nutrition Facts" detail page.

Wow! No preservatives! That's good. Less than one gram of sugar per serving, which is within our acceptable range. Okay. We'll get some of this stuff. So we click the "go back" link (or use our browser's "back" button, and "add to basket," then look for some other items we might need to help us make a perfect, authentic Mexican dinner. But first, let's look at how MexGrocer.com used information layering to help us make our buying decision.