Most product pages on eCommerce sites have much the same style and elements:
- gallery of photos
- “add to basket” area
- some additional information below.
This makes sense. Visitors are used to a certain way of navigating these pages.
However, I think there’s a better way of approaching product galleries – specifically on mobile devices.
You know the deal.
You land on a product page. There’s a large picture of the product you’re viewing. Underneath are a few thumbnails showing different images. You can click on these to enlarge them. Most likely you’ll swipe left and right to navigate through them.
Here’s how it looks on Storefront, the default WooCommerce demo theme:
But is this the best way?
On mobile phones horizontal space is at a premium. Vertical scrolling is the order of the day. Whether it’s eCommerce websites, social media, or any other app, scrolling is ingrained in our daily lives. Terms like “doomscrolling” have become part of our culture.
I think it’s time to revisit how we approach product image galleries. It’s time to do away with square thumbnails and horizontal swiping. And move towards something that’s more natural – vertical scrolling.
Usability wise, this makes sense. The product images are one of, if not the single most important pieces of information on a product page. Making these instinctive and easy to use is a no-brainer.
The Adidas app uses this technique to fantastic effect:
This produces a clean and natural user experience without sacrificing key product information or calls to action.
Revisiting and reconsidering aspects of web design that have become the “norm” is a great exercise. It allows you to discover new ways of thinking that can drastically improve the experience of your users.
Crucially, it can help drive more sales.
Want to make the most of your e-commerce website?
Call Darren on 01284 830888, or email firstname.lastname@example.org