#43) Have relevant dynamic sorting filters in the product category pages

Advice for your filters: Avoid or offer explanations for industry-specific or ambiguous filters Have visual filters if the values are visually driven Allow users to combine multiple filtering values of the same type   Examples of sorting options: Price Popularity Relevance New Ratings   IKEA’s approach to sub-categories and filters in a category p...

#44) Display these product attributes in category pages: image, title, price, ratings, and product variations

I found this article by NN/g about product pages, derived from their research across 49 ecom sites, in wihch the list must have, nice to have and fancy feature attributes that your product pages should contain:    

#45) Add urgency elements to category pages

There are several ways to build urgency: Show how much they save on sale items Have limited quantity or limited time offers Offer free shipping or same-day (or next day) delivery if they purchase before a certain time Inform users about limited stock   TBDress is the perfect example of the implementation of urgency with their flash sales and limited quantities:...

#46) Feature products, bundles or deals at the top of category pages

Amazon helps their shoppers reduce the number of options to choose from. They have multiple sections at the top of the category page with featured products:   best sellers top rated recommended for you most wished for most gifted hot new releases   Do you feature some of your products on your store in your category pages?   You can either add a sectio...

#47) Avoid pagination in category pages

Avoid infinity scrolling. On desktop, use a combination of lazy loading and a “Load More” button. Show about 10-30 products on page load, and then lazy-load another 10-30 products as they scroll down, until they reach 50-100 products. Then, display a “Load more” button and repeat. On mobile, show 15-30 on page load, then show a “Load More” button. When the...

#91) Highlight items that are in the shopper’s cart

Add a label or replace the “Add to Cart” button with “View Cart”. You can also update those added items to allow shoppers to change the quantity, and/or include links to additional products or matching accessories.

#94) Feature important product filters at the top of the product list

Have the featured filtering values in the filter sidebar and at the top of the product list. Don’t use banner-like graphics for featured filters Adjust the visual style of the featured filters to match their relative importance by using text links, buttons or visual thumbnails.

#96) Truncate filter values

Truncate filters after about 10 values (truncate if minimum 5 values) Use the site-wide link styling for the truncation link Position the truncation link close to the filter values Add a visual indicator next to the truncation link (an arrow or a +) Fade the last filter value

#101) Display breadcrumbs

Display hierarchical breadcrumbs on desktop. On mobile, have a link to the parent category only. You can also add a “Back to Results” link on desktop if they come from a search.

#102) Have intermediary category pages for the first 1-2 levels of categories which introduce sub-categories

Some of your shoppers need inspiration and guidance to help them make up their mind about which sub-category they’re interested in. Provide thumbnail previews, longer titles, and descriptions for those sub-categories. These components will also clarify categories with ambiguous industry jargon. Feature the sub-categories prominently, at the top of the intermediary c...

#161) Interactive Color Swatches

On IKEA, instead of showing variants there, they add More options available under the product. Interesting approach, it makes visitors wonder what the other options are. I think that is both a good and a bad thing. Curiosity is good, but it creates some confusion. Macy’s, alternatively, actually shows the variants under the product image. And you can get a prev...

#164) Avoid Quick Views

According to Baymard (source), Quick Views are a bad idea: they’re a symptom treatment for poor product list design (not enough information/attributes, thumbnails too small, etc.) users confuse them for the product page and struggle to understand the site’s hierarchy they introduce friction to the user’s browsing process They recommend: Avoid Quic...

#165) Provide additional list item information on mouse hover

In Baymard’s user testing (source), showing too little information in the list made test subjects do extensive “pogo-sticking” (jumping back & forth between the list and product pages). Showing too much information leads to overwhelm.   If your niche is visually-driven (apparel, home decor,…), combine: A “cut-out” image by default...

#166) Show product attributes consistently inside of a product list

Put the same attributes in the same order. E.g. how many cups of tea a container of tea can make?   According to Baymard: (source) 64% of e-commerce sites impede users ability to compare the product in their list due to inconsistencies in the listed product attributes.   Shoppers tend to skip products without certain attributes listed, or conclude that ...

#168) Educate your shoppers in your category pages

While this is commonly done in product descriptions and the homepage, you can also educate your visitors on the category page.   Examples: Here’s a good example of a product page which educates well Follain has a category page with a Clean Fact section.   You can copy some of the sections you have on your homepage and/or product page and include them...

#172) Make it easy to trigger the product comparison

On most stores that I reviewed recently which had a Compare feature, it was very difficult to figure out how to access the Comparison page once you select a couple of products to compare. I honestly couldn’t figure it out in a few cases.   Here’s a good example of how it should be implemented to make it easy for the shopper to actually access the comp...