The Jaw Dropping Effect that Images Can Have on your Conversion Rates

in
22 Flares 22 Flares ×

Sometimes, it’s the simplest things that boost conversion rates the most. I love those head-smacking moments where I make a simple change on a site, and suddenly conversion rates hit the roof. In moments like that, I’m thinking “why didn’t I do that months ago?!”

I’m going to give you a moment like that.

This article explains the raw power of images, and the jaw-dropping effect that they can have on your conversion rates.

If you have an inkling of desire to see your conversion rates improve, you have to read the information below.

Rather than give you some mind-numbing list of 2,109 awesome techniques for pictures, I’m going to give it to you straight and simple.

There are three features of high-converting images that you need to be aware of.

I can virtually guarantee (and if you know me, I rarely guarantee anything because of testing) that these three straightforward and simple image tips will improve your conversion rates.

My goal in creating this post was to go beyond obvious platitudes, and distill the actual conversion-causing features of images.

My research led me into the physiology and psychology of images, the effect of images on brain structure and response, and the interplay of memory and image viewing.

What I came up with are the following three ways you can make your website more compelling by using images in the right way.

1.  Images should be big. 

According to studies, bigger images result in higher conversion rates. It’s just that simple, as you’ll see in the studies below. When you increase the size of an image, it becomes more noticeable, less bounce-worthy, and more likely that the visitor will convert.

Listen to the data on this one. Econsultancy cited examples in which larger images produced better conversion rates.

The first example they featured was Skinner Auctions. The site tested images that were 28% larger than previous images. The conversion action was filling out a form and bidding on the featured product.

Here’s what the change looked like:

Version 1

skinneracutions

Version 2

skinneracutions2

Even though the product description moved below the fold — chancing that only 20% of visitors would scroll down — the bigger image scored 63% more visitors, and improved online form completion by 329%! A big image meant bigger conversions.

When an image is large, it’s more likely that people will spend time looking at the image, thereby reducing bounce rates and improving the odds of a conversion action.

Over in the B2B world, big images are equally awesome.

Dell tested two versions of their expert consultation page. Here are the two versions

The little image:

delllandingpage1

And the big image:

dellpicture2

As you probably guessed, the huge graphic won. It reduced bounce rates by 27% and improved conversions by 36%.

Notice that in the Dell.com example, the image is nearly unrelated to the product. It’s hard to have an image that depicts “discuss solutions and services with an expert.” Nonetheless, despite the tangential relationship of the image to the service being sold, the larger image produced improved conversions.

Bigger is better, regardless of what you’re selling.

Pottery Barn Kids gets this. Their homepage images are expansive. Even when I stretched by browser to the limits of my 13.1” screen, the image kept on expanding.

potterybarnkids

Humans are wired to gaze at images over against text. Images require less mental effort to process and absorb. The phrase “visual person,” “good looking,” and “picture is worth a thousand words” are verbal expressions of the intuitive reality that we like looking at pictures.

It follows that the bigger the picture, the better.

 

2.  Images should have a good background or no background.

Everything in a photo is important, even the stuff in the background. The Digital Picture blog explains that “taking control of the background can help turn a snapshot into a beautiful photo.”

Backgrounds are critical for any photo, but especially those that are intended to feature products for sale.

Obvious background issues.

First, let me just get the obvious stuff out of the way. We all know that what you see in the background of a photo influences what you think of a photo.

A photo of a Ferrari in a dump is still a picture of a dump. The picture will look dumpy, even if the car costs a hundred grand. A picture of a beater car in a beautiful park, however, will subtly influence positive feelings toward that car.

Using no background.

On the other hand, no background can be just as compelling as a beautiful background, depending on your product. Let’s take a look at the mother of all marketing savvy, Apple.com.

When I cite Apple.com, I’m fairly certain that any visual images that come to your mind are images of sleek, powerful, simple, intuitive, and expensive machines. This style of image reflects exactly what Apple is selling and what they are featuring in their product images.

They have achieved this goal by strategic use of images with no backgrounds, especially on their retail site.

The header image from Apple.com/mac is simple and stark, yet strikingly beautiful, especially to cult members.

macpicture1

Every product has virtually no background, sometimes just a simple reflection.

macpicture2

The use of whitespace — the absence of overt design features — constitutes their design style. It achieves results.

macpicture3

The important principle of backgrounds is that it should not conflict with the product or service being sold.

Simplehuman, however, is selling a single product, so their background is minimized to a subtle monochromatic gradient.

simplehuman

Not-so-obvious background features.

There are several features on the topic of background that aren’t so obvious. First of all, the images themselves can be the background.

Tally Accounting uses a parallax site with brilliantly-photographed backgrounds.

tallyaccounting

 Cenwood Kitchens does the same thing.

justkitchens

And here’s Bently Reserve:

bentlyreserve

In each of these examples, imagery is the king of the page. The background is the feature image. It drives the viewer to engage, to stay, and to convert.

Background imagery, one step further.

I’m going to take this a step further. You can use images as the background for forms, not just headers and above-the-fold parallax sites. Let me explain, then illustrate. You can use images to improve the aesthetics, and thus the conversion rate on text pages or forms. The image serves as the background to the form.

Here is one brilliant example of background imagery from Second Wave Recycling. They recycle old cell phones. Their conversion action is the user filling out a form. They tested two versions of the form — a bland boring gray background, and an image background with texture and depth.

Here is the old one:

cellphonesupport1

And here is the new and improved one:

cellphonesupport2

(Both images from wordstream.com)

What’s the change? By using an image-rich background in their form, Second Wave saw donations increase 53%.

Backgrounds are far more influential than we often think. Pay close attention to your background. Improve your background. You’ll likely see conversion rates improve.

 

3.  Use pictures of people.

On my homepage, I have a picture of myself.

jeremysaidimages

 

Why? I’m not the hottest guy on the planet (shhh, don’t tell my wife), but I do know that my real honest-to-goodness mug will help to earn your trust more than if I had no picture to show you. I have my picture up there, not so you can gawk but so you will get to know me even before you know me. This is what brand building and reputation creation is all about.

Jakob Nielsen explains that when you don’t have a photo, it subtly suggests that you’re trying to hide something. Much of my consulting work is done in person. I want my site visitors to see a person. Thus, according to Nielsen, people will “relate more easily to somebody they’ve seen….People who’ve met you before will recognize your photo, and people who’ve read your site will recognize you when you meet in person.”

Use the face.

The key feature of using people pictures is the face. Eye-tracking studies demonstrate that facial features are the first thing that people look at when they see a picture of a person. As Alex Horstmann wrote, “people are naturally drawn to look at faces.”

The heatmap of these pages demonstrates a visual focus on faces and eyes:

usableworld1

Facial focus doesn’t change, even if we’re looking at the picture of a baby. Here is the scan path:

usableworld2

And here is the heat map overlay:

usableworld3

(Images from Usableworld.com.au)

A variety of studies have confirmed that headshots of customer service reps on a web page can boost conversion rates by 20%. Scott Albro writes, “Marketers should use pictures of people and headshots in particular to humanize their calls to action and conversions.”

Keep in mind, that we’re talking about real headshots of real people that really work in your real workplace. If you ever use this shockingly cliche stock photo, you deserve to have declining conversion rates.

stockimage

Image source:  every freaking site on the Internets.

One of the most popular studies was conducted by Jason Thompson. Here’s his A/B test.

jason1

This image had a 3.7% conversion rate:

jason2

And this image had a 5.5% conversion rate.

Jason summed up the lesson he learned with this comment “People want to connect with other people emotionally, the photo makes that emotional connection so much easier.”

Faces go with anything.

It really doesn’t matter whether your product is a durable good, an inanimate object, or even a service. You should still use pictures of people. CreativePeople is a digital design firm, but they use the image of a person, specifically a face. Plus, they throw a few animals in for good measure.

The picture of a person, especially someone holding a squirrel, and whose beard is serving as hummingbird nest material, is pretty attention-grabbing:

creativepeople1

 

This website of musician Gavin Castleton, is literally in-your-face, and a big ghastly, if you ask me. However, it drives the conversion action by reducing bounce rates and engaging the viewer’s curiosity:

gavincastleton

 

The University of Phoenix sells education, but displays faces:

universityofphoenix

(Image from Topohq.com)

 

Highrise is a CRM, and they have a smiling face to feature:

highrise

 

Cal Filings sells incorporation services, and their site features a slider of people’s faces:

calfilings

 

Pictures of faces create an instant human connection with your viewer, which produces better conversion rates.

A study from Kissmetrics demonstrated this principle. The website of Medalia Art initially used painting images instead of facial images to feature artist profiles.

medaliaart1

They replaced these painting images with pictures of the artists themselves:

medaliaart2

The result was surprising. Conversion rates shot up by 95%.

It doesn’t really matter whether the faces are ugly or beautiful. The point is, they’re faces. And faces are human. And humans connect with humans.

People look where people look.

There’s another reason why you should put pictures of people on your website. Pictures of people looking at something will cause you, the viewer, to look in the same direction.

By strategically placing photos of people looking at something, you will compel your site visitors to look the same way. Check out these examples:

chemistrycom

(Image from socialtriggers.com)

In this image, viewers are most likely to look at the red callout, which contains the conversion action form.

Usable World conducted a test, using the line of sight principle. Here is the scan path overlay results for a picture of a baby looking at something.

babypicture

Because this woman is looking at the form, the viewer will look at the form, too. Notice again, that form contains the conversion action:

wordstreamwoman

(Image from wordstream.com)

Here’s one from Apple.com.

The child looking at the screen made me, too, gaze at the huge Thunderbolt display, and the not-so-subtle Apple logo just a short distance beyond that.

maceducation

 

Even a gecko can make us look. But he’s sort of a human gecko, so it’s okay.

geico

(Image from wordstream.com)

Your experience probably corroborates this principle. If you’re in a group of people, and suddenly someone looks up, everyone else will look up. Or, if you see a huddle of people on a sidewalk and they are all looking up, passersby will look up, too.

We are wired to look at what our fellow human beings are looking at, even if it’s just  photos of those people looking at something. A picture of a person looking at something — ideally your conversion trigger — is critical for increasing the importance of that conversion action.

Conclusion

Conversion coach Peep Laja writes, “If I’d have to pick one single thing that would sell a product online, it’s images.”

If you haven’t yet learned how to use that “one single thing” it’s time to get it going. It’s not hard. It’s not expensive.

Images used right will improve your conversion rates. Wanna kick up your conversion rate a few percentage points? Now you can.

Do you have any other reasons images are so important in the conversion process?

Jeremy writes about conversion optimization, web psychology, and what makes users click in the digital world. He is also a Google Certified trainer and avid online marketer. In his free time Jeremy loves to travel with his beautiful wife Tanya, spoils his adorable Peekapoo Chewy, and occasionally indulges in Cuban Rum.

  • Val

    Great article, thank you very much!