Best Practices for Ecommerce Category Pages

Often for ecommerce sites a lot of attention is paid to building the perfect product page. It all needs to come together perfectly – the product imagery, description and features, strong call to action, incentives, cross-selling and up-selling opportunities, and many more facets that make a great ecommerce product page.

But there’s another type of page, very common on ecommerce sites, which gets about as many views as product pages but often receives a lot less love and attention. That type of page is, of course, the category page.

Essentially a category page is a transit point, a fleeting stop between arrival and destination. Its purpose is to send the visitor to the right product pages as quickly and effortlessly as possible. That fleetingness of user engagement is often an excuse to not pay too much attention to the layout and functionality of a category page.

But that would be a mistake. A good category page is essentially invisible; it’s a quick clickthrough- moment for visitors, but a lot of work goes in to making category pages that good. Below I will outline some best practices for ecommerce category pages, both for maximum SEO potential as well as usability and conversion value.

Screen Real-Estate

The most common problem with category pages is how to make optimal use of the limited amount of screen real-estate, while still showing as many relevant products as possible. Product categories can contain thousands of products, and yet you don’t want to bombard visitors with endless lists of products.

That makes it very important to pay a great deal of attention to how your category page is laid out. You want to make sure that all the necessary elements –

• top navigation,
• sub navigation,
• hero banner,
• editorial text,

and of course the products and/or subcategories – are present where users expect to see them, and are clearly visible above the fold.

You may want to experiment with multiple layouts for category pages, and perhaps test a few for different product categories to see which works best. And, of course, never hesitate to be inspired by what others are doing.

Navigation

Next to listing relevant products, arguably the most important function of a category page is to enable visitors to dig down further in to the ecommerce site’s offerings and find what they’re looking for quickly and effortlessly. A solid navigation helps with this.

There’s only so many links you can stuff in to a site’s top navigation, so you will need to rely on additional navigation links on category pages to make your visitors’ purchase journey as smooth as possible. A tactic I tend to favour is so-called faceted navigation, also known as additive filters.

I’ve written about faceted navigation before, so I’ll keep it brief here. Basically these types of navigation links allow a user to quickly filter the listed products based on certain aspects of the products, such as specific features, colours, sizes, price ranges, and so on.

The advantage of well-executed faceted navigation is that these navigation links can be very semantically relevancy – i.e. these links can add relevance value to the product listings contained within.

Whether you use faceted navigation or another method of navigation, always make sure you give your users what they want. A site’s navigation, both the main navigation and the additional navigation on category pages, exists to serve your website’s users – never to hinder them.

Editorial Content

On many ecommerce sites you will find a lack of text on category pages. You’ll see all the other elements – product listings, navigation, hero banners, and all that – but often there’s little to no text. I think that’s a mistake.

A category page is a perfect opportunity to show relevant, valuable text. It doesn’t have to be much – in fact it should be fairly limited so as not to take up too much of the limited available screen real- estate – but you should definitely have some text on there.

Editorial content on a category page is a great opportunity to talk passionately and enthusiastically about the product range that is being shown. Give your text a bit of personality and flair, and your users will read and appreciate it.

And, of course, there is a great deal of SEO value to be extracted from editorial content. Include the right keywords in the text and make sure to embed some links to subcategories as well as specific product pages. Just don’t go overboard. Don’t turn the text in to a lame listing of keyword- rich anchor texts and keyword synonyms. The text should add value, not make your site look like a< spammer's pet project.

Pagination

A question often asked is how many products should a category page contain? I don’t think there’s one right answer for that, though I personally tend to prefer showing more products rather than less. But the question itself is flawed – it’s not really the amount of products that’s the problem, but how easily users can navigate through the listed products.

One solution I am a fan of (as are others) is to load the page with a great deal of products and then use AJAX/JS or some other agile solution to show a limited set to users, complete with links that quickly and easily allow the visitor to browse through the list.

When you do have to go to a second page to show more products, make sure your pagination links contain the relevant rel=prev and rel=next attributes, so that search engines know you’re paginating your products list.

Product Listings

Lastly I want to discuss some best practices for optimal product listings. That is, after all, the category page’s primary function: to show a list of relevant products. There are many ways to show products on a category page, but I feel the best way to show them is to stick to convention and show a grid of products – three or four in a row, and about 10-15 rows on a page.

Each product listing should contain a good product image, the product name, a brief description, its price (making sure to note any discounts or special offers), and an Add to Cart button. If your ecommerce site has a comparison function where the features of multiple products can be compared, you should include a comparison checkbox on the product category page so that a user can quickly check multiple products for comparison.

Make sure the product image and title are linked to the product page, so that users don’t have to figure out where to click to see the actual product page. (You’d be surprised how many sites still get that wrong.)

With all those aspects in place, your category pages should function as intended and only keep your visitors’ attention briefly before they more on to the money pages: your actual products.