Category & Listing
2 vs 3 Column Product Grid on Mobile A/B Test
A three-column grid shows more products at once but makes images smaller. A two-column grid gives each product more visual space but shows fewer options at a time. The better layout may depend on how much visual evaluation the category requires.
A/B test scenario. This page is a test plan, not the result of a real experiment.
- Category listing
- Mobile category-page purchase conversion rate
Option A vs Option B
How many are shown is the variable, not what they look like.
- Changed
- Quantity
- Page
- Category listing
- Difference
- changed
Hypothesis
A two-column grid may make products easier to judge with larger images, while three columns let shoppers scan more options on one screen. In categories where the image drives the decision, two columns could deliver the higher mobile category-page purchase conversion rate; where quick comparison matters more, three columns could.
Test plan
When to run this test
If session recordings show mobile shoppers trying to zoom into images, bouncing quickly from product pages back to the list, or scrolling a long way with few product taps, they may not be able to judge products well or may see too few options. If column count is the lever, the grid that suits the category helps shoppers tap the right product more easily, add it to the cart and buy. If the problem is slow-loading images, look at that first, because the number of columns will not fix it.
How to measure success
Mobile category-page purchase conversion rate
Compare purchases among mobile visitors assigned to each grid layout.
Also track
- Listing-to-product click-through rateCheck whether click behavior changes.
- Products seenCount actual product impressions; the same scroll depth may expose different numbers of products in each grid.
- Add-to-cart rateTrack whether add-to-cart changes.
- Quick returnsReview rapid back navigation and usability findings; a quick return alone does not prove a misclick.
How to set it up
- ColumnsCompare a two-column and a three-column mobile grid.
- Keep constantKeep card content, image ratio, product order and prices unchanged.
- Downstream behaviorRead product-page visits and add-to-cart alongside purchases.
- CategoryReview category differences without assuming a winner in advance.
- Separate testTest simplifying card content separately.
What to watch when reading the result
- 1Seeing more products in three columns is not a gain by itself, since the same scroll depth shows a different number of products in each grid. The mobile category-page purchase conversion rate decides the test; if the add-to-cart rate drops, a higher listing-to-product click-through rate does not earn a rollout, and quick returns should be read alongside usability findings.
- 2Nothing here speaks beyond the mobile listing page; review category differences separately without assuming a winner in advance. Touch targets in the three-column grid must stay usable and prices and discount labels must stay readable; if either breaks, the difference cannot be pinned on the column count.
- 3Breaking results down by category makes each slice smaller. Before you rely on a small or unclear category-level gap, check with the sample size calculator whether each slice has enough traffic.
Frequently Asked Questions
Is showing more products in a three-column grid a gain?
Not automatically. Use mobile category conversion as the primary outcome. Count actual product impressions because identical scroll depth exposes different numbers of items.
How large should mobile product-card touch targets be?
WCAG 2.2 AA specifies 24 by 24 CSS pixels with spacing provisions and exceptions. The enhanced AAA target is 44 by 44. Maintain usable controls and readable prices in both layouts.
Do quick returns indicate accidental taps?
Not necessarily. Combine return patterns with interaction evidence or usability observations. Product categories can differ in how much visual inspection buyers need.
More tests in Category & Listing
All testsSecond Product Image on Listing Cards A/B Test
Category listingCategory-page purchase conversion rate
Shoppers can swipe or hover to a second image on the card in this experiment. Read both arms, the note on detail page traffic and the conversion metric.
Should Listing Pages Offer Quick Add to Cart?
Category listingOrder completion rate
An experiment idea adding a quick add button to product cards on the listing page. Review both arms, the shortened purchase path and the tracked metric.
Story Copy vs Product Specs on Listing Pages
Category listingProduct-listing purchase conversion rate
An experiment idea swapping technical specification text for a short emotional message on cards. See both arms, the perceived value case and the metric.
