Shopify Collection Page CRO Checklist: 24 Checks

Quick answer: To improve a Shopify collection page’s conversion, work on the step shoppers take there: from the product grid to a product page. Measure that step by device, then check the five things that shape it: filters, the default sort, what each product card shows, quick add or quick view, and how more products load (pagination, a load-more button or infinite scroll). Baymard Institute and Nielsen Norman Group testing flags specific problems in each, and session recordings show whether your own shoppers hit them. This checklist has 24 checks and does not tell you which sort order to use, because that depends on your catalogue.

A collection page does one job. It helps a shopper decide which product page to open. When it does not, they scroll, apply a filter that returns almost nothing, tap Back and land at the top of the list again, and leave. A standard analytics report shows very little of that.

This guide is about that behaviour. For each area it says what the research found, what to look for in a session recording, and a rule for deciding what to do. It is a UX and conversion guide and does not cover how collection pages rank in Google. That is in our guide to Shopify collection page SEO and, for the URLs that filters create, filter URLs and index bloat.

What the research is, and how far to trust it

Most of the evidence comes from Baymard Institute and Nielsen Norman Group (NN/g), who run usability tests where real people try to find and buy products. Baymard’s research page (undated) says it tested 19 leading ecommerce sites across 8 verticals, found more than 700 usability issues and distilled them into 83 guidelines, then benchmarked 344 top-grossing US and European sites. Its “Product List UX Best Practices 2025” article (published 22 August 2024, updated 9 September 2025) says 58% of desktop sites and 78% of mobile sites have a “poor” to “mediocre” product list experience.

Treat all of it as hypotheses to check on your store. The sample is big retailers, and a store with 40 products and one brand is a different case (Baymard itself notes that small direct-to-consumer sites have less need for site-provided reviews on list items, 30 May 2023). Many pieces are dated, so I give the date next to each figure. And lab tests are not your conversion rate: Baymard’s page says sites with mediocre product list usability saw abandonment rates of 67 to 90% against 17 to 33% for sites with a slightly optimised toolset, for users trying to find the same types of product in its studies. That is a testing figure, not a store’s conversion rate. No source I read says adding a feature raises a store’s conversion rate.

Your own recordings are the test that matters.

How to use this checklist

Start with measuring, so you know whether a change helped. The rest follows the page from the top down. If you only have an afternoon, do checks 2, 3, 5, 8, 10, 11, 14 and 24.

Measure first (checks 1 to 4)

1. Pick the collections to review first. Start with the collections that receive the most entry sessions (check your landing page report for addresses containing /collections/), then the ones that carry the most revenue. 2. Measure the grid-to-product step. Google’s GA4 ecommerce documentation describes view_item_list (sent with the items displayed), select_item (sent when a user selects an item from the list) and add_to_cart. If your store sends them, sessions with select_item divided by sessions with view_item_list, for one collection, gives a grid-to-product click rate. That ratio is my own measure, not a Google metric. Do not assume your store sends these events: check in GA4, and ask whoever manages your tracking to add them if they are missing. If your GA4 and Shopify numbers disagree, read GA4 vs Shopify Analytics first.

3. Split everything by device. Look at mobile and desktop separately, every time. Baymard’s 2025 article puts mobile worse than desktop (78% against 58% “poor” to “mediocre”). Our guide to mobile conversion on Shopify covers the wider mobile issues.

4. Write down a baseline for each collection. Take 28 days that were not a sale (my choice of window) and record, per collection and per device: sessions, grid-to-product click rate, add-to-cart rate and orders. Compare each collection with itself. I do not quote a “good” collection page conversion rate, because I have not found a primary source that publishes one. If traffic is low, read A/B testing with low traffic before you decide a change worked.

The first screen (checks 5 to 7)

5. See how far a shopper scrolls before the first product. On a phone, count the swipes to the first row of products. A long introduction, a large banner and a row of promotional tiles can push the grid below the first screen. Clarity’s scroll maps show the “average fold” (the point visible before the user starts scrolling, based on your real visitors) and the percentage of visitors who dropped off at each 5% of page height (Microsoft Clarity documentation, scroll maps, updated 6 October 2026). My rule: keep any text above the grid short, and put longer buying guidance below it.

6. Put subcategories where shoppers can see them. NN/g’s review of listing pages (Aurora Harley, 12 August 2018, covering 49 ecommerce sites) found the most successful pages that merge category and listing show subcategories separately from the other filters, usually above the listings. If recordings show shoppers opening the filter panel first and applying the same filter every time, that filter may be a subcategory that should be a visible link (my inference, not NN/g’s).

7. Show how many products there are and where the shopper is. NN/g (Kate Moran, 6 March 2022) says it is important to display the total number of products and, with a show-more button, how many remain to be loaded. It credits Lululemon’s mobile pages with a “Viewing 40 of 333” label. In recordings, look for shoppers who reach the end of the loaded list and scroll back up.

Filters (checks 8 to 13)

8. Offer the filters shoppers try. Baymard (18 August 2020) names five essential filter types: price, average user rating, colour, size and brand. It found 57% of benchmark sites did not offer all five and reports that, in its large-scale mobile testing, 80% of users applied price filters. On Shopify, standard filters cover availability, category, price, product type, tags and vendor, and custom filters can be based on product options, metafields or metaobjects (Shopify Help Center, as at 30 October 2026). If you sell one brand, a brand filter is moot. Use the attribute your buyers choose by, such as product type, concern or ingredient.

In recordings: use Clarity’s “Clicked text” filter for sessions where shoppers clicked “Filter” or “Price” and watch what they try next. If shoppers keep tapping something that is not there, you are missing a filter.

9. Let shoppers choose more than one value in a filter. Baymard (23 January 2024) reports that about 15% of sites in its benchmark do not allow this, that testers sometimes applied 5 or 6 filters and some up to 10, and that when values could not be combined some users abandoned suitable products. Its recommended logic is “and” between filter types and “or” within one. Shopify’s help describes the same behaviour by default, though certain filter types can use “and” within a filter instead. A theme or app may change it, so pick two colours on your own store and see whether you get both.

10. Show what is applied, and make it easy to clear. Baymard’s applied-filters article (published 6 October 2020, updated 13 May 2026) says 28% of benchmarked sites show no overview of applied filters. Testers on mobile opened the filter interface just to check what they had chosen, and users who forgot their filters could wrongly conclude the site lacked suitable products. Baymard’s 17 April 2026 filter article also recommends a “Clear All” option.

In recordings: a shopper filters, gets a short or empty list, reopens the filter panel several times and leaves. Count how many sessions do that.

11. Test the mobile filter on a real phone. Baymard (17 April 2026) recommends a prominent “Show X Results” apply button on mobile, notes that a separate filter screen with a sticky apply button can work well, and says tap targets should be at least 44 by 44 points (a size it attributes to Apple’s guidelines). NN/g’s tray pattern (Kathryn Whitenton, 26 July 2015) keeps part of the results visible behind the filter panel, with the result count fixed at the top. Use your own phone.

In recordings: filter to mobile sessions and the dead click insight. Clarity marks a click as a dead click when the user gets no feedback in a reasonable time, which it says can signal broken elements, slow requests or misleading design. Rage clicks on a filter chip or apply button tell the same story.

12. Clean up labels and values. Baymard (17 April 2026) reports unclear filter labels on 25% of desktop and 40% of mobile sites and calls a result count next to each option one of the single highest-impact improvements you can make to a filter. NN/g (Kate Moran, 15 July 2018) says labels should be as concrete and precise as possible, general filters should sit above specialised ones, and price ranges should run from lowest to highest. On a Shopify storefront, a filter displays at most 100 values (Shopify Help Center). Open every filter on a busy collection: are sizes in a sensible order, is there one “Black” or several versions of it, would a first-time buyer know what each label means?

13. Know Shopify’s limits and gaps. As at 30 October 2026, Shopify’s help says a store can have up to 25 filters, collections with more than 5,000 products do not display filters, and the price filter is not shown when customers shop in a currency other than your shop’s default. If you sell in more than one currency, switch to the other one on a phone and check the price filter is there. You can also choose how empty filter values are shown: hidden, at the bottom or in the default order.

The default sort (checks 14 to 16)

I am not going to tell you which sort order to set. It depends on your catalogue, margins, stock and shoppers, and I have not seen your store. These checks are about knowing what your default is and whether it is a decision.

14. Know your default sort, and what it shows at the top. Shopify’s help says new collections default to “Most relevant”, which ranks products by sales performance. “Best selling” ranks by the all-time number of orders that include the product, and the other options are manual, alphabetical, price and date. Check what each main collection is set to. Then run the test Baymard describes (5 May 2021): look at the first 20 products on desktop and the first 10 on a phone, and ask whether they show every major type of product in the collection. Baymard found 24% of desktop sites in its benchmark failed to show the breadth of the catalogue in the default order, and that testers were often misled into thinking a selection was narrower than it was.

In recordings: note shoppers who change the sort within seconds of arriving. It does not prove the default is wrong.

15. Offer the sorts shoppers use, and name them plainly. Baymard (20 April 2021) found four sort types matter most: price, user rating, best selling and newest, and that 64% of desktop sites in its benchmark did not offer all four. Price was the most commonly applied sort in testing; sorting alphabetically was extremely rare. You may not need all four (a rating sort only helps if your products carry ratings), and the current sort should be visible. Baymard also found testers read “Popular” as “best selling” and suggests “Relevance” or “Featured” as clearer labels (5 May 2021).

16. Test price sort in every market you sell in. Shopify’s help says sorting a collection by price on the online store uses products’ base prices, not Market or B2B catalogue prices, so products might not appear in the order of the prices customers see. If you sell in Australia and the US at different prices, sort low to high in each market and read down the list.

Product cards (checks 17 to 20)

17. Put the information shoppers need on the card. Baymard (30 May 2023) found 50% of benchmark sites did not show an adequate balance of list item attributes, and names five shoppers rely on: price, product title or type, thumbnail, user ratings (average and count) and product variations. NN/g’s 2018 review lists much the same minimum, plus an indication of other colours or options. NN/g (Kim Flaherty, 10 April 2016) says too little detail causes pogo-sticking, shoppers going back and forth between list and product pages. If your card hides any of these, a shopper must open the product page to find out.

In recordings: a “quick back” is Clarity’s name for a shopper who goes to a new page and quickly returns, which it says can point to confusing navigation or content. Many quick backs from the grid to product pages may mean the card did not tell shoppers enough to decide. That is a hypothesis to check against the products involved.

18. Check the images match the choice. NN/g’s six tips for listing page photos (Kate Moran, 27 February 2022): large, consistent, specific (photos should match any filters the shopper has selected), dynamic, contextual and inclusive. Filter by a colour and look at the cards: do they show that colour? Whether a card can show the matching variant image depends on your theme, so ask your developer rather than assuming.

19. Decide on purpose how variants appear. Baymard (30 May 2023) reports participants rejected items that matched their needs because they judged only the default variation shown. Its 2025 article says 42% of sites do not combine variations of a product into one list item, and its 2021 research says separate variation items clutter the list and push suitable products further down. On Shopify the equivalent decision is whether a colour is an option on one product or a separate product. Scan a collection for the same item appearing several times in different colours and decide whether that is a choice or an accident. 20. See what an unavailable product looks like. NN/g’s 2018 review lists availability (in stock, and sizes where relevant) among the extra details that can help on a listing. Look at an out-of-stock item on a phone: is it clear before the tap? If your store outputs Product JSON-LD, Clarity has an availability filter (in stock, out of stock) that pulls recordings of shoppers who viewed an out-of-stock product (Clarity documentation, filters overview, updated 21 May 2026).

Quick add and quick view (checks 21 and 22)

A quick view opens a product overlay on the collection page. Quick add is a button on the card that puts a product straight into the cart. The free Baymard and NN/g articles I read test quick views, not quick add by name (NN/g’s listing-page article mentions only a quick-view tool), so the closest evidence is on quick views.

21. Decide whether it suits your products. For visually driven products, Baymard (9 August 2022) found testers could check price, size availability and 2 to 3 images without leaving the list, and that quick views also helped in low-attribute categories such as vitamins and supplements, where a fuller ingredient list can appear. It says quick views should complement good list items, not replace them. For spec-driven products (Baymard, 1 August 2023), most testers learned to ignore them. My rule for quick add: it suits products with no required choice. If a shopper must pick a size or shade first, the button should say so and open that choice.

22. Test the edges. Baymard’s 2022 guidance for quick views is that Back should close the quick view and return to the list, the quick view should carry a very prominent link to the full product page, and the list can be dimmed behind the overlay. In its mobile testing, some testers mistook the quick view for the product page. Also test the silent add: tap quick add and see what tells the shopper it worked. NN/g (Page Laubheimer, 17 June 2018) says changing the cart icon alone is not enough and recommends a more noticeable confirmation, such as an overlay that does not disappear on its own.

In recordings: rage clicks on the add button, or a shopper who taps it and then opens the cart to check.

Loading more products (checks 23 and 24)

23. Know your pattern, and whether it suits your catalogue size. Shopify themes load more products in different ways, so open a long collection and see which yours uses.

Baymard’s study of 50+ sites, published by Smashing Magazine (Christian Holst, 1 March 2016), found testers browsed far more products with infinite scrolling but scanned quickly, that a “Load more” button sat in between and let them read items more closely, and that on long lists infinite scrolling made the footer effectively unreachable. Baymard (7 January 2020) calls “Load More” generally the best-performing method, and gives batch sizes of 15 to 30 products on mobile, 100 to 150 on desktop for visually driven products and 50 to 100 for spec-driven ones, with 52% of desktop sites outside those ranges. NN/g (Kate Moran, 6 March 2022) says infinite loading suits relatively small sets, typically fewer than 40 per page, with good filters and a clear item count. NN/g (Tim Neusesser, 4 September 2022) adds that it is a poor fit when shoppers need to find a specific item or compare products down a long list.

Those figures come from different tests, so use them as a prompt to count, not as a target. Count how many products load at once on your collections, on a phone and on desktop. For your developer: Shopify’s Liquid documentation says the paginate tag takes a page size between 1 and 250.

In recordings: open the scroll map for a collection. If the drop-off at each 5% of page height is steep before shoppers reach the load-more button or the end of the list, they are leaving before they see the later products.

24. Make Back work, and keep the footer reachable. Baymard (17 November 2020) found that on 13% of benchmark sites, tapping Back from a product page returned testers to the top of the list, which it observed directly causing abandonments. For load-more lists it says to update the URL with history.pushState on each load, so Back restores the position. NN/g (Tim Neusesser, 4 September 2022) says shoppers who return from a detail page without the place saved find themselves at the top of the list, and that infinite scrolling can make the footer impossible to reach.

Test it yourself: scroll deep into a long collection on a phone, open a product, press Back. Do you land where you were?

In recordings: a quick back followed by a long scroll to find the same spot again is the signature. Clarity’s “excessive scrolling” insight flags sessions with more vertical scrolling than expected, which it says can point to frustrating UX or poor content discovery.

How to see all of this in recordings

I name Microsoft Clarity because it is free and its documentation is public. Any tool with recordings and heatmaps works the same way. Everything below is as at 30 October 2026, from Clarity’s own documentation.

1. Narrow to collection pages. The visited URL path filter supports regular expressions, so you can select every address containing /collections/. Add a device filter and look at mobile first.
2. Use the insight filters. Clarity can filter recordings to sessions flagged with rage clicks, dead clicks, excessive scrolling or quick backs. Start there instead of watching at random.
3. Compare buyers and non-buyers. For Shopify projects, Clarity has a purchases filter (yes or no), so you can compare collection page behaviour in sessions that bought and sessions that did not.
4. Use the click map, then the recording. The “All clicks” map ranks elements by clicks, and you can jump from an element to recordings where it was clicked. The dead clicks and rage clicks maps show where taps did nothing.
5. Use the scroll map for the first screen and the end of the list.

A recording shows one shopper, so count patterns, not stories. My rule of thumb: log 20 to 30 mobile collection recordings, one row each, and act only on what appears more than once. Our guide to reading a Shopify session recording covers the method.

A worked example (illustrative numbers)

These numbers are made up to show the arithmetic. They are not from a real store. Say a collection had 10,000 mobile sessions in your baseline window, and 4,200 of them had a select_item event: a grid-to-product click rate of 42%.

Now split by filter use. 1,500 sessions used a filter, and 900 of those clicked a product (60%). The other 8,500 did not use a filter, and 3,300 of those clicked a product (about 39%).

That does not show that filters raise clicks. Shoppers who choose to filter are probably more motivated to begin with, so the comparison is biased. It does show where to look: only 15% of sessions touched the filter. Watch a sample of the other 8,500. Did they not need a filter, not see the button, or did the first products already look right?

Turning findings into a test list

Rank problems before you build anything. We score fixes by potential, importance and ease (PIE), and a broken filter button on mobile outranks a nicer swatch. If your traffic supports a proper test, run one. If not, change one thing, note the date and compare against your baseline, accepting that this is weaker than a test. Do not change filters, sort and card layout in the same week. The product page CRO checklist picks up where this one stops.

Key takeaways

• A collection page’s job is to move the right shopper to the right product page. Measure that step (grid-to-product click rate) by device before you change anything.
• Baymard and NN/g give you hypotheses, not guarantees. Check each one in your own recordings.
• Filters: offer the ones shoppers try, allow multiple values within a filter, show what is applied, and test the mobile panel on a real phone. Know Shopify’s limits, including the price filter gap for non-default currencies.
• Sort: know your default and check that the first 20 products on desktop and first 10 on mobile represent the range. This guide does not tell you which order to choose.
• Cards: price, title, image, ratings if you have them and variants should be visible without opening the product.
• Quick add and quick view suit some products and not others. Test Back, the overlay and the cart confirmation.
• Loading: count how many products load at once, make Back return shoppers to the same place, and keep the footer reachable.

FAQs

What is a good conversion rate for a Shopify collection page?

There is no single figure. I have not found a primary source that publishes a collection page benchmark, so I do not quote one. Measure your own grid-to-product click rate and add-to-cart rate for each collection, by device, and compare each collection with its own baseline over time.

Should I use pagination, a load-more button or infinite scroll?

Baymard’s research leans towards a load-more button. Its 2016 study found it let testers browse more than pagination and read items more closely than infinite scrolling, and its 2020 article calls it generally the best-performing method. NN/g (6 March 2022) says infinite loading suits sets of typically fewer than 40 products per page, and NN/g (4 September 2022) says no option is superior for every site. Whichever you use, make sure Back returns shoppers to the same place and the footer stays reachable.

Do filters increase conversion?

I have not found a source that says adding filters raises a store’s conversion rate. Baymard’s testing shows shoppers rely on filters, struggle when they are limited or unclear, and sometimes give up. That makes filter quality worth checking. Whether fixing it moves your numbers is something to measure on your own store.

Is quick add worth having on Shopify?

It depends on the product. Baymard found quick views helped with visually driven products and were mostly ignored for spec-driven ones. The free articles I read test quick views, not quick add by name, so my rule is that it suits products with no required choice. If shoppers must pick a size or shade, test that the button handles it clearly.

How do I know if my default sort is working?

Check whether the first products shown represent the range you sell (Baymard suggests the first 20 on desktop and the first 10 on mobile), and watch recordings for shoppers who change the sort within seconds. This guide does not recommend an order, because that depends on your catalogue and goals.

How is this different from collection page SEO?

This guide is about what shoppers do once they are on the page. SEO is about whether the page can be found. They can pull in different directions, for example over how much text sits above the grid, so read both. Our Shopify CRO audit guide shows where this fits in a wider review.

Want a second pair of eyes on your collection pages?

Our Shopify CRO service starts with a 6-phase audit. It includes qualitative analysis (session recordings, heatmaps and dead-click maps) and ends with a recommendations report scored with PIE. If you would like a quick look first, book a free 30-minute diagnostic or tell us about your store. We share your Shopify store on screen and name two or three conversion leaks live, and tell you whether they are worth fixing. No pitch.