Best Practices for Search & Category Page Filters in your Magento and Shopify Online Store
Posted on August 13, 2018 by
The sooner your visitor lands on a product page, the faster they are likely to become your customer. Almost 90% of your visitors (who have not bounced) are likely to visit a search or product listing page at your online store. Almost 60% of online visitors are engaging mobile-first which limits the number of products displayed per page. Search & Listing page filters are the fastest way for online visitors to drill down and find that product to start their engagement journey at your online store. And while you might already have filters today, this post is to make sure you have considered some the best practices that allow you to maximize conversion
Identify the right filters
Recently we had a quarterly business review with a leading fashion retailer who is also a customer of Tagalys. While the retailer had 7 filters displayed on their search and listing pages, these filters were not the most relevant filters to the end visitor. Irrelevant filters will increase the bounce rate of your search or listing pages. If yours was a physical store, what are the questions a visitor will ask your store associate about a product before purchase? E.g., Do you have a dress on sale for less than $199 without sleeves and a V-Neck preferably in black or white? So if this was an online store, you need to have the product type, price, discount, sleeve type, neck type and color as must have filters on search or listing pages for the product type of dresses.
Prioritize the filters
Now that you have identified the top X filters that your visitors deem important, make sure you display them in the right order. For example, if your selling dresses, almost every visitor will only want to see products that match their size. So you want to ensure your visitors choose a size before they continue. What would be the most common order of filters that visitors would drill down to find products? Do not overwhelm your visitors with everything, but display what is most important and dynamically open up other filters as your visitors drill down.
Ensure dynamic user experience
One of the worst experiences is clicking on a filter to find no products. Make sure the search results & the tags within each filter are updated as soon as you make a selection. Only display tags that have more than a product tied to it and hide or deactivate other tags from being clickable if they have no products upon the previous selection.
User Interface for your filters
We have seen our customers populating the filters on the left or on top of the listing pages. While we are not opposed to either, we are probably a bit biased to displaying the filters left of the results, because it gives you more surface area to play around with how you can show the tags within the filters. If you display the filters on top of the results, you are limited by the screen width to display the filters and it will run to more than 1 row making the experience a bit cluttered if you have many tags within the filter.
Track Filter interaction
All of the above is subjective to your vertical and the audience you are serving. It is imperative to track how your visitors interact with the filters to keep fine-tuning the filters. This can be done using tools like Mix Panel or requesting the same from Tagalys, where we will display reports showing how visitors have interacted with each of the filters displayed in the Tagalys search or Listing pages.