In today’s retail climate, if you can’t keep up with the pace of the consumer, you’ll mostly likely finish last. Immediate access to services through smartphones has created an on-demand economy where fast and flawless consumer experiences are the order of the day – whether it’s hailing a cab or ordering dinner.
It’s no wonder that online retail has become consumers’ dominant mode of shopping, with 195.6 million consumers spending almost $36 billion annually. Yet competition has never been more intense and as a retailer, it’s vital that your website serves as an enabler of, and not a barrier to, sales growth. This means not only getting prospective customers to your website – no mean feat for any growing retailer – but also keeping these shoppers engaged once they get there.
What does engagement look like?
Consumers today want visually-rich online retail experiences that bridges the gap between the physical and virtual store environments. This means multimedia content is a must. Research shows that including high quality product photos on a retail site typically leads to sales uplift. For example, Skinner Auctions of Antique Roadshow fame tested images on their site that were 28% larger than previous images. The bigger image led 63% more visitors to start the bidding process, and 329% more completing the bid forms.
Without compelling, dynamic imagery, e-commerce firms can find their products overlooked in favor of those of their rivals, even if they’re winning on other metrics such as price or delivery times. This is not just a web issue either; in UPS’ 2017 UPS Pulse of the Online Shopper study, 50% of respondents said that high-quality product images are now an important feature for retailer apps as well.
Timing is everything
Of course, this creates a problem for many retailers given that consumers also want shopping experiences that load immediately. The solution to the first consumer wish (lots of images and multimedia) hurts the second, as image files are large compared to text or code. If you analyze “page weight” by adding up the download size of every element on a page, you’ll find that images usually make up 60 to 70% of the data that is transmitted when it loads. This means they’re one of the biggest contributors to sluggish performance, especially on wimpier connections.
Yet the reality is that images register to the human mind faster than text, so they’re often the first make-or-break test that your website will face. Put simply, images need to be fast-loading, or bounce rates will spike. The smallest hiccup can derail a sale, and recent research shows that even a two-second delay in load time can hurt conversion rates by 103%, while just a 100-millisecond delay in load time can bring down conversion rates by as much as 7%.
Unreliable mobile
Achieving high-quality, fast-loading site imagery is especially hard for omnichannel retailers, who have to deliver images to a glut of channels and devices, each with their own set of requirements. Mobile networks, which can be unreliable and bandwidth-poor, complicate things further. The stakes for slow performance are considerably higher with mobile, where consumers bounce more quickly and where there’s much lower tolerance for long loading times.
Are you being served?
Delivering a great visual experience in online retail is about more than just art direction and having powerful imagery. Retailers need to start giving as much thought to how visuals are actually served – after all, the key to successful online retail is ultimately about being able to create the optimum experience for shoppers.
To give just one example, there is no reason a retailer should be serving a photo file large enough to print on a billboard to a mobile device, where it will be displayed at the size of a postage stamp. It will not look better, and it will slow the page to a crawl, creating a sub-optimal experience and leading to a higher bounce rate.
Smart resizing and cropping are essential for the mobile web and it’s necessary to have several versions of images ready to serve to different devices to create the best experience.
Looking down the line
Unfortunately, simply resizing an image so that it can work on a particular device can be detrimental to the look and feel of your site. Resizing images down tends to make the visuals greyer because the computer is making compromises and blending colors together. This is a problem for brands selling highly visual products like clothes or accessories — they need colors to pop. For this reason, it makes sense to revisit images once they’re resized to tweak color and contrast so that it matches the originals.
A format-first approach
“What kind of image file should I use?” has become a much harder question to answer recently, because different formats are best on different devices. JPEG is the standard, and is almost always a good choice. Yet on Android devices and in the Chrome browser, the newer WebP format delivers significant size savings with no loss of quality. The best approach is to detect a customer’s device type and then serve each image in the appropriate format. Most visitors won’t notice the subtle differences between file types, but their connection certainly will. It can even save you money. Choosing the right format for your site across devices can cut bandwidth by as much as 30 to 40%, according to the Soasta State of Digital Performance report.
Taking advantage at the busiest times in the retail calendar
We’re currently entering a busy time in the retail calendar, as frantic parents equip their children with everything they need for the school year ahead. The industry saw a big shift last year with parents reporting mobile as their preferred method for back-to-school shopping. Mobile is fast and easy for parents on tight deadlines and budgets, and eMarketer is estimating that digital sales in core categories will increase by 16% in 2017.
There is a huge opportunity for e-commerce providers throughout the country to step up their game and make parents’ lives easier at this pivotal time of year, but this means getting image optimization today, not tomorrow. Fortunately, it’s not necessary for this to be manual work. Technology exists that can automate much of the drudge work of image optimization, or even perform the necessary edits on the fly as images load. By carefully considering how you use and edit your images, you can greatly improve the user experience when navigating your site and set yourselves up to succeed at the most lucrative times in the retail calendar.
Chris Zacharias is founder and CEO of imgix. Prior to that, he was one of YouTube’s earliest web developers. He created YouTube’s HTML5 video player and Feather, an ultra-lightweight version of YouTube that loads quickly in parts of the world with slow Internet connections. These experiences drove Chris to recognize a need for tools that let developers build great visual experiences without adding bulk to their apps. In 2010, he founded imgix, a real-time image processing service that enables businesses of all sizes to deliver rich visual content with high performance and easy setup.