Vertical vs. Horizontal: Which Assortment is More Persuasive?
Quick. You need to choose a cupcake.
Which assortment is more appealing?
A horizontal assortment:
A vertical assortment:
We face those decisions everyday. From supermarkets to online stores, we’re bombarded with different displays:
But which one is better: vertical or horizontal? Does it matter?
In this post, I’ll explain why horizontal assortments are usually better.
1. Horizontal Displays Are Easier to Process
A) Our vision is inherently horizontal
We have binocular vision. Our eyes are positioned horizontally, so we have a wider horizontal view — roughly 190 degrees (Deng et al. 2016).
That’s why computers and monitors are wider (rather than taller).
B) Horizontal scanning is physically easier
Thanks to our muscular structure, horizontal eye movements are easier. Our head has a natural forward tilt, which makes vertical movements more effortful (Griegel-Morris 1992).
2. Horizontal Scanning is More Efficient
Deng et al. (2016) presented people with assortments of lollipops.
They used an eye-tracking device to study eye movements among the assortments. Turns out, eye movements matched the type of assortment. People used horizontal movements in horizontal assortments (and vertical movements in vertical assortments).
More importantly, since horizontal movements were easier, people fixated on more items per second (3.26 items in the horizontal assortment vs. 2.77 items in the vertical assortment).
3. Horizontal Assortments Seem More Varied
Because people look at more items in horizontal assortments, they (falsely) perceive higher variety among items (Deng et al. 2016).
4. Horizontal Displays Increase the Likelihood of Choice
In turn, the enhanced variety is persuasive. Customers have a natural tendency to seek variety (see Kahn, 1995), so they prefer assortments that seem varied.
Plus, with higher variety, people look at items for longer durations. And they look at MORE items in total. Consequently, people develop larger “consideration sets” (i.e., they consider buying more options). And they’re more likely to choose an option.
Not surprisingly, Deng et al. (2016) found that people were more likely to buy from horizontal assortments (and they were more likely to buy multiple products).
Caveat #1: Use Vertical Assortments With Vertical Screens
Obviously use common sense. If you’re displaying options in a smartphone, don’t stuff the options horizontally because Nick said so.
Caveat #2: Use Vertical Assortments When You Need to Reduce Variety
Horizontal assortments are effective because of a domino effect that stems from increased variety:
However, variety can be counterproductive. If customers know exactly what they want, they don’t want to look through many products.
Let’s look at Amazon.
If you view a product category —an area where people are browsing — you’ll see many horizontal assortments.
That’s good. When people are browsing, variety is useful.
However, if you view search results — an area where people usually want a specific item — you’ll see a vertical assortment.
If users are searching for a specific item, you should decrease variety. Help them find the item. That’s why vertical assortments are better for search results.
Oh, but wait!
Once you click on a result, you’ll see various recommendations on the product page. Well, with recommended products, variety is a good thing. So how are those products arranged? You guessed it.
Horizontal assortments are effective because they enhance variety. However, you should use vertical assortments when you want to decrease variety (e.g., search results).
It looks like Walmart is up to snuff. When I search for a general term — “humidifier” — the results are horizontal.
And that’s good. Based on that general term, Walmart assumes that I’m in the early stages of a sales funnel (where variety is a positive cue). So they should use a horizontal assortment.
However, when I search for a specific product — “Vicks Warm Moisture Humidifier” — the results change to a vertical assortment.
And that’s great. That vertical assortment reduces perceived variety, which funnels my attention toward the desired product. Plus, the assortment positions the product at the top — in the exact location of my first glance.
Well played, Walmart.
In this guide, you'll learn 125+ changes to optimize the UX/UI of any website or mobile app.