Why your webstore's hero image may be turning away traffic and destroying sales and what to do instead

Whether your store is hosted on Squarespace, Woocommerce, Wordpress, Wix or Shopify – virtually all successful ecommerce sites can boast “good design” as the primary reason they rack up sales. 

GOOD DESIGN – OBVS, RIGHT?  BUT WHAT PRECISELY *IS* “GOOD” DESIGN? 

If we think about great brick and mortar store merchandising, it pretty much always starts with compelling shop windows.  Those tantalizing front of the house displays help engage the surrounding community and draw shoppers inside. They also serve as a first point of branding for a shop hoping to stand out from a sea of similar stores.

But of course, the storefront mission goes beyond just windows – the general state of a building can either draw people in or repel them in an instant.  Paint an eye-catching mural, or interesting color on the outside of your shop and you’ve gone far beyond mere window design. Likewise, putting a little merchandise outside always draws in passersby as well.

For a Shopify* store, the mission is the same.  Your store window is your above-the-fold imagery.  It should be intriguing enough to make visitors want to explore what you have to offer. 

While traditionally the first item to focus on for a web designer would be a big splashy hero slider, billboard, or video – this approach is starting to become passe for several reasons:

1) Mobility: Depending on who you ask, about 50% of consumers in the USA shop on mobile devices – primarily phones rather than tablets. Mobile versions of Shopify sites tend to take your big, beautiful hero shot and crunch it down into a less than stunning stripe of an image. Many brands have compensated by increasing the size of their hero images substantially so that they read better on mobile. The tradeoff is a cumbersome image on desktop that is slow to load and takes up the entire screen. Many current Shopify themes don’t translate into mobile versions smoothly and end up dropping your splashy image from mobile browsers all-together.

2) Load time: As mentioned above hero images and video sizes are increasing in the hopes that everyone has fantastic browsing connectivity. However, if your customer happens to be sitting in a parking lot somewhere and their mobile service provider has cut their browsing speed to nil for the month, they may never make it into your store at all as they sit and wait for your site to load.

3) Trends: Not only does a large static image slow down your store’s load speed, but unless it’s changed and updated routinely it can make your brand feel stale. Let’s be frank, it’s hard to come up with one solitary image or video that truly characterizes what your brand has to offer. A product shot, stock photo, or a video of people ecstatically dancing around can be great when your customers first see it but can seem bland a couple weeks (or months) later when it hasn’t been updated to reflect the changing seasons, trends, or new rollouts.

SO, WHAT’S A BRAND TO DO?

WE’VE BEEN SEEING A TREND TOWARDS COLLECTIONS OF MASONRY STYLE LANDING IMAGES – OR GRIDS THAT SIT SIDE BY SIDE ON DESKTOP, AND STACK NEATLY WHEN THE PAGE IS REDUCED TO MOBILE. THIS SOLVES MANY PROBLEMS:

1)      Images and videos are sized smaller and load faster in both mobile and desktop versions of Shopify sites. 

2)      The mix of product and concept make for a much more compelling and artful presentation that truly does reflect the appeal of a store window or front door merchandising display.  Meld color, texture, and concept.

3)      By featuring a timely blend of product and promotions on the top of your site visitors are much more easily engaged.  A gigantic landing image or video can read like yelling in a customer’s face on desktop, while a blend of compelling smaller images feels more like a friendly salesperson offering smart suggestions.

4)      For you, the Shopify owner, a blend of smaller images are more easily managed and updated routinely than one large statement shot that must be conceptualized, shot, edited and posted routinely.  

5)      Having a number of shoppable images at the ready encourages sales rather than forcing

customers to click, search and scroll your site before (hopefully) finding an item they’d like to purchase.

Fortunately, setting up a grid or masonry landing style section is easy in Shopify regardless of which theme you’ve installed.  Simply choose Multimedia Collage from the Add Section on the lower left of the Customize Store page, add a collection you’ve put together before hand, move the section to the top, and you’re ready to go.   You can add a Multicolumn section underneath to keep the look and feel going.

Need help updating your Shopify store?  We can help you manage, redesign, update, or just give a little zhuzh to what you’ve started.

 

*For this article we’ll use the term “Shopify site” as a generic designation for ecommerce since more than 35% of all online commerce in the USA runs through Shopify.

LIKE THIS ARTICLE? PIN IT!

MORE TO EXPLORE

Previous
Previous

The Case for Cleaning Up Your (Decaying) Instagram and Facebook Story Highlights.