Product findability is key to any e-commerce business — after all, if customers can’t find a product, they can’t buy it. Therefore, at Baymard Institute, we invested eight months conducting a large-scale usability research study on the product-finding experience. We set out to explore how users navigate, find and select products on e-commerce websites, using the home page and category navigation.
The one-on-one usability testing was conducted following the “think aloud” protocol, and we tested the following websites: Amazon, Best Buy, Blue Nile, Chemist Direct, Drugstore.com, eBags, GILT, GoOutdoors, H&M, IKEA, Macy’s, Newegg, Pixmania, Pottery Barn, REI, Tesco, Toys’R’Us, The Entertainer, and Zappos. The pages and design elements that we tested include the home page, category navigation, subcategories, and product lists.
Further Reading on SmashingMag:
- How To Plan Your Next Mobile E-Commerce Website
- The Current State Of E-Commerce Search
- The Current State Of E-Commerce Filtering
- Efficiently Simplifying Navigation, Part 1: Information Architecture
Throughout the test sessions, the subjects would repeatedly abandon websites because they were unable to find the products they were looking for. Indeed, the subjects encountered over 900 usability-related problems, despite the websites having been built for multi-million dollars. All of these usability issues have been distilled into 79 concise guidelines in a report titled “Homepage & Category Usability.” In this article, we’ll go over seven of the guidelines.
1. Don’t Make Parent Categories Shallow. (Also, Have Parent Categories.)
Issue observed: When the hierarchy of categories is just labels and headers, it breaks the expectations of users and forces them into narrower sections than they desire, preventing explorative product browsing.
Grouping subcategory options in drop-down menus and other areas is a vital part of making them both manageable and scannable; and most websites have done so. Surprisingly, though, on many of the websites tested, the top level of the drop-down categories was only text labels, not actual clickable elements. This conflicted with the expectations of the majority of the test subjects, who anticipated that the headers would be clickable.
The Pottery Barn website (larger view).
“I’d think that you can click all of it,” said a subject of Pottery Barn’s website (above left) when looking at the drop-down menu, “and that the black items will take me to a general page with all ‘Living room’ items.” Alas, upon hovering over the black heading, the mouse cursor changed to a text-selector rather than a pointing hand, and the subject concluded that it wasn’t clickable after all. The same type of shallow parent headings was found on REI’s website (above right).
Most subjects expected that these headings would be clickable and often tried clicking them, despite the cursor indicating unclickability. The subjects wanted to keep a fairly broad scope of products, in the hope of landing on a page that displays a curated set of subcategories that would assist them in selecting a more defined scope (as opposed to a page listing products). Making parent categories a part of the product hierarchy (and not just be shallow text labels) is critical in supporting explorative product browsing, so that users who haven’t fully decided what they want or who are looking for inspiration on what to purchase can dip their toes in broader categories before diving into narrowly defined ones.
Pixmania.com (left) and Amazon.com (right). (larger view)
On Pixmania’s website (above left), a subject tried to select the generic “Digital Cameras” category, instead of specific camera types. He didn’t want to specify a camera type subcategory yet because he was still unsure about the exact differences and hadn’t decided on his particular needs. On Amazon (above right), another subject hovered over “Shop by Department” and tried to click ”Movies, Music & Games,” which is orange when hovered over (Amazon’s hover style for links in the drop-down menu is orange and underlined), but nothing happened. She tried again before realizing that she had to choose one of the subcategories on the left.
On websites in which headings are actually selectable parent categories (i.e. part of the website’s taxonomy), the subjects often ended up relying on them for an initial overview of an entire category, and from there made informed decisions about which subcategories to select.
This critical guideline isn’t limited to drop-down menus, but applies to any representation of a hierarchy of categories. Examples would be the categories displayed in the sidebar or in the site map of a product catalog, as well as permanently visible main navigation bar options (i.e. very top-level categories). In all of these cases, a parent category should exist and be selectable, as opposed to being a shallow text label.
2. Put The Same Subcategory Within Multiple Main Categories When Necessary.
Issue observed: When a subcategory could logically appear in multiple parent categories but appears only in one, users are often led astray.
Depending on your product catalog, you might end up with subcategories that users would expect to find in multiple parent categories. For example, users might look for a coffee table in both the “Living Room” and “Tables” sections, as well as in the “Accessories” subcategory of “Sofas.”
While the ideal solution is to craft a completely unambiguous set of top-level categories, this is not always realistic, and sometimes popular demand requires a fuzzy category to be introduced in the top-level categories. Therefore, to avoid the severe usability problem of users not being able find a subcategory where they expect (which often lead subjects to conclude that the store simply doesn’t carry the item), consider putting the subcategory in multiple parent categories.
BestBuy.com (larger view)
One subject was unsure whether she would find computer adapters in “Office” or “Computers & Tablets,” because the former describes a usage context, while the latter describes the type of product. Based on the subcategory options, she found the latter to be the correct one. However, in “Computers & Tablets” (above right), she was in doubt about whether to look in “Batteries & Power” or in the generic “Accessories.” Luckily, both led her to adapters. Also, notice how Best Buy has an “Ink & Toner” category within “Computers & Tablets,” as well as a “Printer Ink & Toner” category within “Office,” allowing users to find the category in any of the potentially matching parent categories.
Consider the “Office” category in the Best Buy example above. All of its subcategories could be in other top-level categories, yet the “Office” section is presumably still needed to support the large portion of Best Buy’s customers who shop with a “home versus work” mindset. In these instances, featuring very important subcategories within multiple parent sections would be relevant (assuming that they semantically fit them equally well) because users will look in the one that best fits their context.
In terms of implementation, there are two main approaches to featuring the same subcategory in multiple parent categories. Our tests showed no conclusive evidence for one method over another. Each has its advantages and disadvantages:
- You could put the subcategory in one place in the website’s taxonomy, and then simply link to that destination in the other parent categories (for example, in the drop-down menu). The user would then jump scope to the “real” category, regardless of where they access it from. This could cause confusion if the user knows they have clicked a link in a menu named “Office” but then landed in the “Electronics” section (as indicated by the breadcrumbs).
- Alternatively, you could duplicate the categories so that each is a unique entry in the website’s hierarchy, with proper breadcrumb paths, etc. The downside here is technical complexity. Products must be tagged consistently across multiple duplicated subcategories; the search engine’s auto-suggestions must not suggest any one category more than once in a single search; and so on. Furthermore, implementing this requires canonical pages to be set up in order to avoid SEO penalties for the duplicate pages.
3. Consider Having A “What’s New” Category Or Filter.
Issue observed: Some users want to see what’s new in your store — say, to be inspired or when buying for a friend — without having to plow through previously browsed products.
“H&M is one of the websites that I check from time to time,” a test subject explained, “so I might pick ‘New Arrivals,’ like this, and see what new stuff they have.” Many subjects who had experience with a website or brand that we tested would look for a “What’s New” category. This was especially true if they cared deeply about the products and brand and already had a good idea of the product catalog and, thus, wanted to check out what had arrived since their previous visit.
Clearly, a “What’s New” filter-based category is a great way to support return visitors, so that they can easily identify what new products have arrived since their last visit. But there are other use cases for “What’s New.”
“New Arrivals” is particularly meaningful in seasonal industries, where the newness factor could be a major part of the purchasing decision. (larger view)
In seasonal industries, such as clothing and groceries, “What’s New” helps users to see what’s currently fresh and in season. “What’s New” shouldn’t be taken too literally. For example, fresh figs aren’t exactly new because they are in stores every year, but they are new to stores around summertime, and most users would expect to find them in a “What’s New” type of section, regardless of whether they are technically new (for example, the SKU might be the same). Indeed, the category or filter shouldn’t necessarily be called “What’s New”; depending on the product type, a label such as “New Arrivals” or “In Season” might be more appropriate.
Unsure of what to buy for an eight-year-old nephew, a subject decided to open the “New” category because “kids often want the latest thing.” (larger view)
Some gift-buyers want to see new releases to buy something interesting and novel. The recentness of a product also lowers the chance that the gift recipient already owns the product, which is particularly important when the buyer doesn’t know the recipient well.
Making “What’s New” a filter, rather than a separate site-wide category, is often a good idea, so that users can see new items within sections. This works well in several cases: for repeat visitors who want to check only the new items in a particular category; in seasonal industries where a user is interested only in what’s in season in a particular section, such as “Fruits”; and, last but not least, for gift-buyers who need to pick a section that’s relevant to the recipient before considering how to find the best item in that section.
“What’s New” can be integrated as an option in the filtering tools or as part of the category navigation (even if it’s actually a filter that’s presented as a subcategory). During testing, the subjects responded well to seeing it in both the filtering tools and in the category navigation of websites in seasonal industries. But they can clutter up category navigation quickly if not implemented carefully (i.e. if the options are not progressively disclosed as categories are selected). In industries in which newness isn’t as important, a filtering option would probably suffice.
4. Suggest Both Alternative And Supplementary Products On Product Pages.
Issue observed: Alternatives, substitutes, add-ons and accessories to the product that the user is currently viewing are unreasonably difficult to find without good upselling and cross-selling on the product page.
Upselling and cross-selling is great for business. And, when implemented appropriately, they can be great for usability, too. Suggesting supplementary products is great for users who are looking for add-ons or accessories to the product they are viewing, while suggesting similar products is great for users who are searching for alternatives or substitutes.
“It’s like when you look for movies online. If I liked this one, then I might also like these. That’s pretty smart,” a subject explained when stumbling upon the “Similar Diamonds to Consider” on the product page for Blue Nile shown above. Suggesting substitute products is an effective way to keep the user on product pages that don’t match their criteria.
If the user arrives on a product page that turns out not to match their criteria, they will either give up and abandon or look for alternatives or substitutes. Luckily, most users are patient in the beginning and opt for the latter, but they will quickly grow tired if the only way to browse alternatives is to go back to the overview list of products.
This is where suggesting similar products helps. By listing alternatives and substitutes directly on the product page, the user can go directly from one product to the next. This much richer display of information about the product keeps the user engaged on the page and close to the “Add to Cart” button and checkout process. Good suggestions of similar products also help the user find alternatives or substitutes across the website’s entire product catalog, not only easing the browsing experience but also enhancing product findability (and enabling cross-sectional navigation via breadcrumbs).
“Sometimes they have some looks or some ideas, or something,” a subject explained after scrolling to the end of the product page on Gilt shown above. While the “May We Suggest” suggestions are great, the subject had already found a dress (on the product page she was currently on) and wanted to complete her outfit with a pair of shoes to go with the dress. Unfortunately, Gilt offered only alternative products (i.e. other dresses) and not add-ons or accessories (shoes, jewelry, makeup, etc.).
While suggestions for similar products are great, they often aren’t enough. Users will often want suggestions of add-ons and accessories, too. After deciding to purchase a product, some users will want to buy additional — supplementary — products along with it, to “complete the look” or “finish the package.” A user buying a camera is likely to want a case for it. Yet finding such supplementary products is often a hassle. Even if the website has a subcategory for accessories, the user would have to go back to the product list, select the subcategory and apply the right compatibility filters (which works only for category browsing, not search).
With a list of add-ons and accessories directly on the product page, the user would easily be able to find products to supplement their purchase. Much like suggestions for similar products, suggestions for supplementary products ease the user’s browsing experience, enhance product findability, and — to a great extent — enable cross-sectional navigation. Not to mention its obvious business appeal.
“When they say ‘Recommended for you,’ I assume they will fit,” a subject explained, referring to the camera cases displayed after adding a Nikon Coolpix pocket camera to his cart on Tesco (above). It turned out that one of the two recommended cases didn’t fit the camera.
When suggesting supplementary products, label them appropriately if compatibility is an issue in your industry. Many of the subjects assumed that any accessories suggested would be compatible with the product they were viewing or had just added to their cart. Only when the suggested products were explicitly labeled as being based on the behavior of other users (for example, “Other customers also bought”) did the subjects not assume them to be compatible. Be careful in labelling behavior-based suggestions for supplementary products as “recommended” if you can’t guarantee their compatibility with the product they are being suggested to complement.
“Something which is similar that other customers visited or bought,” a subject mumbled to himself when glancing over the sidebar shown above. Tesco helps its users find both alternative and supplementary products by including lists of both “Others bought these alternatives” and “Customers who bought this also bought” in the sidebar of its product pages. (And unlike on its shopping-cart page, Tesco gets the labeling right here by clearly indicating that the lists are based on the behavior of other customers.)
Given that users want suggestions for both similar and supplementary products, implementing both on product pages is recommended. The lists don’t have to be located near each other, although they could be, as long as they aren’t mixed. The subjects responded poorly when the criteria or theme of the product suggestions was not clear. Therefore, keep suggestions for similar products and supplementary products in distinct groups, but be sure to have both.
While basing these suggestions on the behavior of other users can be effective, exercise care. Tesco’s suggestions for supplementary products consisted entirely of memory cards, even though many other relevant add-ons and accessories are obvious, such as cases, lenses and batteries. So, either manually curate the suggestions or have the system generate them based on a broad range of factors, so that a diverse set of complementary product types is shown.
5. List “Recently Viewed Items.”
Issue observed: Refinding a previously visited product becomes needlessly complex when the user has to rely on the browser’s native “Back” button or has to renavigate the categories or reuse search.
During testing, subjects often wanted to return to a previously visited item — sometimes to check whether certain features of the previous item were compatible with the new one, other times to compare two products before deciding on one to purchase, and still other times to return to a certain product scope from where they could use the breadcrumbs to climb back up the category hierarchy.
Whatever the reason, the subjects simply wanted to refind a previously viewed product. Yet, on websites without a “Recently viewed items” feature, the only ways to do this were through repeated clicking of the browser’s “Back” button (an option that occurred only to some subjects) or by searching for it or plowing through the product categories once again.
When looking for a camera case on Pixmania (above), this subject realized that he needed the name of the camera he chose. He went back to the product page using the browser’s “Back” button, then reopened the drop-down menu, then opened the “Camera Cases” subcategory in a new tab. A list of “Recently viewed items” would have greatly simplified this process.
A list of “Recently viewed items” typically consists of a row of products that the user has previously visited. It is a kind of history-based breadcrumb trail (except that it typically includes only products, not categories or other pages). The list tends to be located towards the bottom of the product page — sometimes even in the footer — but is sometimes given more prominence in a sidebar.
However, the list should be available on all pages of the website (not just the product page), because returning to a previously visited item would be just as welcomed by users who find themselves lost on a category page. The footer has the benefit of being out of the way most of the time; and then when subjects wanted to change scope or refind an item, most scrolled to the bottom of the page, likely looking for cross-sectional navigational such as “Related Items,” and thus discovering the “Recently viewed items” list.
On Tesco (above), refinding a previously visited product is made easy by the “Items you have recently viewed” list, which is integrated in the footer on all category and product pages. Compare how easy it was for this subject to check the camera’s dimensions with the previous Pixmania example.
Another location for the “Recently viewed items” list is the sidebar, as seen here on Crate & Barrel. (larger view)
With this list readily available throughout the website, users are assured that refinding products will be easy, and they are more likely to explore other items because they know that returning to a favorite won’t be a hassle. Combined with breadcrumbs, users enjoy a powerful combination that facilitates both history-based cross-sectional navigation and section jumping. Show “Recently viewed items” to everyone, then, without requiring users to sign in; the list should be session-based, functioning much like a shopping cart.
Because the list is automatically generated for users, a couple of privacy features are worth considering. While the vast majority of users will enjoy seeing “Recently viewed items,” a few will want to hide the items because they don’t want others to know or because they’re on a public computer. In such cases, consider two features: “Clear all” and “Disable list.”
6. Create Dedicated Pages That List Compatible Products.
Issue observed: Users have a difficult time finding compatible products and verifying their compatibility when the website doesn’t explicitly state their compatibility or link to the corresponding products.
Finding a spare adapter for your laptop or buying a camera and matching case might sound like trivial tasks, but during testing, it turned out to be extremely difficult for subjects, who had a completion rate of only 35%. This means that 65% had to give up or, worse, ended up purchasing a product that they believed was compatible but was, in fact, not.
The subject above opened the camera page in a new tab, but even with the camera’s dimensions close at hand, finding a matching case proved to be tiresome, as he still had to open the page for the camera case, go to the specifications, locate the dimensions, compare it to the camera’s, and repeat this for every single case. After a few attempts he gave up, like 65% of the subjects.
Finding compatibility-dependent accessories can be difficult, which is why you should always suggest both alternative and supplementary products on a product page (see guideline 5), as well as list “Recently viewed items” (guideline 6). However, if the majority of accessories in your industry are strictly compatible with certain other products (regardless of whether you sell those other products), then consider also offering whole pages listing compatible products. Technology industries are ideal for this (due to the technical dependency between products), whereas it would be overkill for a clothing store (all clothes “function” together — the only “compatibility” factor is taste).
“I’ll pick Nikon now — originally, I didn’t necessarily want one from Nikon — but I’ll do it now hoping to find an original camera bag so I know it will fit, because I’m not really keen on going back to find my camera dimensions and then compare to the bags,” a test subject explained. “So, unless it’s insanely expensive, I’ll probably take an original.” Subjects often gave up finding a compatible case that they liked and simply tried to find anything that would fit their camera. Using brand filters was often a part of that strategy, although it led some novice photographers to purchase incompatible cases, because they assumed that most Nikon cases would fit most Nikon cameras.
When dedicating whole pages to compatible products, then the page for, say, the “Nikon D7000 camera” would list all compatible accessories, such as batteries, cases and lenses. Going a step further, the page could even filter by product type, so that users can view “compatible ‘camera cases’ for ‘Nikon D7000’.” This enables users to navigate the product catalog vertically and to find (typically high-profit) accessories, instilling confidence in the accessories’ compatibility.
Determining compatibility across a catalog is a major undertaking, but with intelligent queries for each compatibility-dependent category, a lot of the work can be automated. The benefits of determining such compatibility are many. Besides the already mentioned ability to browse vertically across categories, it enables you to create powerful filters. Imagine one filter in the “Laptop Adapters & Chargers” category that allows the user to enter their computer’s model and see compatible chargers. Furthermore, it is also great for search engine optimization, because these compatibility lists can be presented as permanent pages, giving you several highly targeted and unique landing pages for each product, such as “Lenses for Nikon D7000,” “Laptop Chargers & Adapters for MacBook Pro” and “Covers for Kindle Paperwhite.”
When seeing these camera bags being cross-sold in their shopping cart, the subject above was disappointed by their looks (all black nylon). (larger view)
Had Pixmania established compatibility across its catalog, it could have linked to a list of compatible accessories — “See all 8 compatible cases for Canon PowerShot A2300” — at the end of this cross-selling section, providing a direct path to a complete overview of relevant cases.
Establishing compatibility across a catalog helps you to avoid plainly wrong matches. (larger view)
In Tesco’s shopping cart above, the subject tried to find a matching case for the camera she had just chosen, but she completely lost faith in the website upon seeing few related accessories and a lot of irrelevant recommendations, including a saxophone!
Compatibility-based pages should be cross-linked with the original product page, as well as with any “Compatible With” lists on the product pages of compatible items. Such pages could also appear in a user’s shopping cart and be included in the filters of all relevant accessory categories across the website.
Besides being great for cross-selling and SEO, dedicated pages of compatible products can be mined for data to create filters and to improve cross-selling recommendations. They would enable you to avoid suggesting incompatible products, which is critical because most users will assume that any product being suggested fits.
“It fits ‘X60,’ but that’s not mine. I have an X61,” a subject said, referring to the top result above. He continued, “It fits all in the X60 series. Does that mean my X61 as well? I would go to Lenovo’s website and find out.” Confusion about which models are in a “series” was common, because a series’ name can be confused with a particular model’s name.
Just showing a list of compatible products for each model doesn’t always cut it because some models are organized into series as well. In the Newegg example just above, the “Lenovo ThinkPad X61s” model is part of the “Lenovo X60 series.” This hierarchy should be reflected in the dedicated pages of compatible products as well, because some test subjects mixed up a series’ name with a model’s name. Pages for compatible products in a series should link to all models in that series to clear up any doubts the user might have.
Lastly, dedicated pages of compatible products can still be meaningful even if the website doesn’t carry all of the products. For example, an electronics store that doesn’t sell Sony digital cameras could still have pages of compatible products for Sony cameras to help customers find accessories that it does sell. The same goes for websites that don’t even sell products from a given industry; for example, a website that sells apparels or bags but not laptops or electronics might still want to list compatible products so that users can browse only the bags that fit their particular laptop.
7. Always Link Contextual Images Directly To The Products Shown.
Issue observed: Users quickly grow frustrated when they spot a product in a contextual image but can’t navigate to it.
“I want this. What do I do?… I want this one,” one subject said, laughing out of despair while pointing and clicking at a coffee table shown in a contextual image on IKEA. While inspirational images can raise the aesthetic appeal of an e-commerce website and serve as an important vertical style-based navigation path, not directly linking to the products depicted in contextual images will frustrate users to no end.
During testing, the subjects were dumbfounded that a website didn’t simply link directly to all products depicted and that they had to hunt them down to learn more or to purchase them. This lowered their perception of the website, and some took it as a sign that the owners clearly hadn’t used their own website.
“I don’t know how I found this cushions category. I wonder why there wasn’t a cushions category along with all the sofa options up there. But then I saw this image of a cushion down the page and thought that maybe I’m on the right track.” One subject said this while looking for cushions in the sofa category on IKEA’s website. As he scrolled down the “Sofas” subcategory page, he spotted an image containing a cushion, and while the image was actually cross-selling sofa covers, the “Cushions” category was linked to it as well.
Images tend to draw a lot of attention, and when users get stuck in first attempting to find a product, they tend to scan the page very narrowly for anything that looks like a path to the product they want. Therefore, contextual images should always link to the products depicted, even if the image is meant merely as inspiration for one of the products being shown. Users will still notice the other products in the image, especially if they are actively scanning for one of those product types. Even if the purpose of the image isn’t to promote that particular product, users will become frustrated if they can see the product but not access its page.
Above, a subject saw a table that he wanted in the thematic “Seating Solutions” image, so he clicked it, but nothing happened. He then tried the “Save to list” button, assuming it would save all of the products shown and that he could then simply remove the other products. But that didn’t happen either. “Nooo… Arrgghhh, it only added the sofa. I would like to get the sofa table,” he said, hovering over and right-clicking the table in the image. He laughed in despair as he continued, “I want this. What do I do? I want this one [pointing at the table]. I expected it would save all of them when I used the button, but it only saved the sofa.” After searching for the table, the subject ended up abandoning the website.
If an item is not being sold, ideally it shouldn’t be depicted at all. In practice, this is easier said than done because contextual images sometimes contain products that were available when the photograph was taken but that now are not (or are not in all distribution channels — for example, a store might sell some products offline only, or an international website might ship certain products to certain regions). Discarding or reshooting an entire scene of multiple products is likely unfeasible if just one or two of the products are no longer available.
In such cases, replace the product link with a description, rather than just remove it entirely (as seen in the IKEA example above). The description could be as simple as “Discontinued,” “Available only in store” or “Not available in US store” — the vital part is to indicate that the user may not purchase the item. If the item has not been discontinued but is simply unavailable for purchase in a particular channel or region (as with IKEA above), then the description can point very persistent customers in the right direction. Better yet, if similar products are available, consider linking to them or to their categories.
In the image above on the left, one subject found the sofa in the header image interesting and clicked it to investigate further, only to be confused when presented with a list of products but not that particular sofa. In the image on the right, another subject was on the product page for a sofa. Upon inspecting the sofa images, she found that she very much liked the coffee table as well and wanted to know more about it. She looked around for links, but there weren’t any, not even in the cross-selling section further down the page.
Another way to solve this challenge is to mark up contextual images with direct links to the products being depicted, as seen above on Crate & Barrel, where clicking the “+” icon will open a quick preview of the pinned product. (larger view)
Direct links are needed not only for contextual images. Header images and even some images on product pages would benefit from having direct links to the items being shown. For images on product pages, any products that are clearly depicted could be linked to either right below the image, by having a dedicated “get the look” cross-selling list, or at the very least in a generic cross-selling section on the product page. One could even experiment with tagging the image so that users can actually click right on the products they are interested in.
If They Can’t Find It, They Can’t Buy It.
In a time when more and more customers are accessing e-commerce websites through search engines and social media links that send them deep into a website’s hierarchy, enabling users to infer their current position in the hierarchy, to go to the generic parent category and to find related products is critical. Even customers who use on-site search will depend on the website’s taxonomy of categories to infer the available range of products.
No matter how much time you spend on the aesthetics, the product images and the optimization of landing pages, the customer’s overall experience will falter if the foundational e-commerce elements, such as the taxonomy of categories, aren’t solid.
Designing user-friendly category-based navigation is no easy task. It requires a solid information architecture, systematic labelling, a logical hierarchy, curated subcategory pages and a balanced home page design. Obviously, all of this can’t be covered in an article like this, but the seven guidelines we’ve looked at are low-hanging fruit; by following them, you can quickly improve the category navigation on a typical e-commerce website:
- Don’t make parent categories shallow.
- Put the same subcategory within multiple main categories when necessary.
- Consider having a “What’s New” category or filter.
- Suggest both alternative and supplementary products on product pages.
- List “Recently Viewed Items.”
- Create dedicated pages that list compatible products.
- Always link contextual images directly to the products shown.
One last note. During testing, it became clear that loosely executed categories can have more devastating consequences than “just” immediate abandonment of the website — it could permanently damage the brand. When the subjects couldn’t find a particular product type, they would often conclude that the website didn’t carry such items. Such fundamental misunderstanding leads not only to an immediate loss of a sale, but to future losses because customers won’t visit a store that they assume does not carry the type of product they are looking for.
(al, il)
Learn more guidelines about category and navigation usability in the (paid) report “Homepage & Category Usability,” by the author of this article.