How to Build Ecommerce Category Pages That Convert
- Written by Rodney Laws
Individual product pages are a given necessity to ecommerce success. But category pages can be just as powerful - when used in the right context. Designed well, an ecommerce category page is more than just a stilted list of items falling under the same umbrella. It’s a gateway that takes broad consumer interest and channels it with optimal efficiency towards conversion. You just need to put some work into structure, layout, and design. So in this post, we run through how to build ecommerce category pages capable of impressing visitors and pushing them towards high-value purchases.
Ecommerce category pages vs product pages
Before we look deeper into this, we should cover what is meant by a category page - how it differs from a product page, and why it’s worth using. A category page lists all the products that fit into a particular category, allowing shoppers to review a lot of relevant options very quickly. If you were selling kitchen appliances, for instance, you could have a category page for each of the following item types:
A specific product page makes a great destination when shoppers know exactly what they want, or you want to push everyone towards that particular product. But when someone just knows they want a general toaster, though, sending them to one in particular might backfire: it might not be right for them. Drive them to a well-crafted toaster category page and they can find one that meets their unique needs, making them far more likely to ultimately convert. Like this on Walmart: Note that tracking landing pages and customer journeys is essential when using category pages. Final conversions will always happen on individual product pages, but you need to know which pages buyers come from. If you find that visitors to your product pages are more likely to convert when they previously visited your category pages, you’ll know they’re helping. But what's the best ways to get your ecommerce category pages working? Let's run through seven key points.
- Enable complex and intuitive filtering
The process of going from a wide selection to a specific item can take time. A shopper might not know exactly what they want, or how to locate it. Is it bad for them to linger on your category page? It depends on the scenario. If they’re really interested in what’s on offer, then it’s a good thing. But if they’re simply confused (as is more likely), then you probably won’t make a sale. Enabling smartly-devised product filtering will help with this. Meaning you help people easily select and sort by things like:
- Average customer review.
- Stock level.
- Product compatibility.
- Particular features.
The shopper should be able to choose multiple options simultaneously. The more they filter, the more confident they’ll feel that the identified products are suitable for them. Presentation is key to this. In addition to being positioned prominently (and supported as an overlay for mobile use), your filter must have a clean design with zero ambiguity about when options have been selected or deselected. See how eBay makes it completely obvious which filters have been ticked: And put thought into the copy, just as you would for menu elements: having a filter option that shoppers don’t understand will only waste time.
- Make support readily available
As noted in the previous point, shoppers don’t always know what they want - and digging through filters won’t always solve that. During regular hours, have real support assistants ready to field shopper queries through live chat. They can recommend particular items, answer broad category questions, and generally help out. To cut down on the expense, you can hire virtual assistants from areas in the world with lower costs of living and lower rates of pay. Operating through a unifying live chat system, they can meet the same standard regardless of their circumstances. Outside working hours, consider implementing a chatbot to work alongside your real assistants: you need only devise the scripts and identify the required functions. The Argomall bot with its Site Search feature is a great example of this. Customers can ask the bot for a specific product (like “Samsung Galaxy Tab S6”) or a product category (“black laptop”), and it will return relevant results in Messenger: With a chatbot in place to handle queries when people are busy resolving tough issues, you can ensure that there’s always some support at hand.
SEE ALSO: How to Drive More Repeat Purchases with Omnichannel Customer Service
- Offer meaningful content (such as FAQs)
Some sellers think that quickly sprucing up a category page's aesthetic will make it worth visiting. It doesn’t. A category page should be a substantial and purposeful page in its own right. Each page should feature a reasonable introduction that 'sells the concept' of that category as a whole. A few lines should suffice, like FatFace do here: Don't stop there, though. Either beneath the product grid or on separate pages (internal linking is fine provided you link back), you should offer content created to be valuable for relevant searchers. The FAQ section is the perfect example of this type of content. FatFace again has a page full of FAQ answers. Through your sitewide analytics and information from social media and search engines (e.g. auto-completed keywords), you can glean which questions people are asking about a category. Formulate succinct answers and offer them in digestible chunks. This will show your expertise and help the page rank well.
- Prominently feature breadcrumb links
While navigating a large ecommerce site, a shopper can get somewhat lost. It’s less likely to happen when there’s consistent product tagging, but it’s still possible. Going back and forth between product types and selected filters has the potential to be disorienting. Yes, there’s always the option of simply going back to the initial page, but that’s a loss of progress. What of simply clicking the ‘Back’ button? It depends on the design of the filter, and it’s intensely frustrating to click ‘Back’ after digging through eight filters and discover too late that none of the filters counted as a new page. Due to this, it’s better to feature clear breadcrumb links allowing shoppers to easily revisit previous pages (and figure out where they might want to go next). See the Adidas site for a solid example — though that trail could be bigger: Breadcrumb links — particularly if tagged accordingly through structured data — are also useful for SEO, because they make site structure clearer to search crawlers. And since SEO leads to more visits, this will ultimately produce more opportunities to convert.
- Ensure image and text consistency
When you’re displaying a huge range of products through a category page, it’s vital that you achieve a respectable level of consistency in your presentation. The visuals you provide are most pressing. An unsorted grid of items might be the first thing a visitor notices, and if the images are different sizes, styles or aspect ratios then your company will look sloppy. Because of this, you need to invest in product photography. You don’t need the backgrounds of all your products photos to be identical, but they need to be stylistically similar: clean backdrops with bold overlays, for instance. See how Target does it - the same background, the same visual elements: And FatFace have a really cool rollover effect on the flip flops category page: Every image should feature the same dimensions and the same level of polish. You can use overlaid icons to communicate product types if you wish. Text is generally trickier. If you have too little, visitors will find it hard to choose relevant options. If you have too much, it’ll damage the aesthetic and lower the overall level of clarity. Stick to the basics: things like price, weight, size, brand, current stock level, and anticipated stock level (the more accurately you can predict this, the better). You can also include brief notes like “Makes a great gift” or “Perfect for parties” (then expand on them on the full product pages).
- Optimize display-based grid scaling
Responsiveness is a core concern for every type of page on an ecommerce site. But it’s even more significant for a category page. This is due to the size and scope of an unfiltered range of products. You might have 100 items on a given page. Even if they display neatly on a desktop screen, they might not look so comprehensive on a mobile device. Grid systems can (and often do) scale very neatly. It’s largely a matter of fine-tuning the mobile breakpoints and the corresponding adjustments. You can even find grid templates and frameworks that can handle most of the work for you, leading to smooth product layouts that seamlessly reshape to suit their surroundings. Remember that your filtering mechanism needs to be comparably responsive, so match the scaling accordingly. The Home Depot uses a pretty standard grid system for its desktop site: But then switches to full-width boxes for its mobile view, allowing all the pertinent details to be clearly displayed: Whatever type of device someone uses to access your category pages, they need to feel as though your site was designed exactly for them. Easier said than done? Absolutely: but far from impossible.
- Allow user layout customization
Customer retention is a primary goal for every ambitious ecommerce seller because it pays off in a huge way. They’ll trust your marketing more. Be much less likely to reconsider before ordering from you. And be far more enthusiastic about referring potential customers. Various other things factor into earning customer loyalty, such as:
- Escalating discounts.
- Early product releases.
- Excellent support.
- Personalized communication.
Something that often gets underrated, though, is the provision of customization options on ecommerce category pages. If you allow logged-in users to have customized layouts, you can secure a key motivation for them to keep coming back. For example: One customer might want to save a particular set of filters so they can use it again on future visits. There’s nothing technically-challenging about this, furthermore: simply have a shortcut bar that can be toggled and adjusted in user settings. Alternatively, you can implement the customization on the customer’s behalf. This will be easier, though more time-consuming for you (if you’re working with, say, a high-value B2B ecommerce customer, it’s sure to be worth it).
While you certainly need to put a lot of time into the development of your main product pages, you mustn’t overlook ecommerce category pages. They serve as vital routers: receiving traffic from search engines and ads and moving it steadily towards conversion. A bad category page can undermine entire sales funnels for numerous products. Usefully, there are various efforts you can make to improve your ecommerce category pages, and we’ve listed the most potent here. Follow as many of these suggestions as you can, lead into high-quality product pages that maintain continuity, and you’ll see strong results.