Are your landing page or product page images big enough to get the best conversion rate that you can get? We’ve seen a wide variety of marketers testing image size these days, including B2B, ecommerce and media sites.
I’m not talking about allowing your visitors to click to enlarge images. I’m talking about blowing up the size of your hero shot (the most important image on your page) so it’s much, much bigger.
Here are three examples from very different marketers to inspire you.
Be sure to share them with your design and testing team.
Case study example #1. Bigger product image
Skinner Auctions, of Antiques Roadshow fame, ran an A/B test blowing up the images in their online catalogue by 28%, from 250 pixels across to 350 pixels across.
Unfortunately, as you can see here, the bigger image meant much of the page content was pushed below the fold for typical visitors (fold mark ours) forcing visitors to scroll.
Responsive web designers know that on many sites, as few as 20% of visitors will bother to scroll down.
Was it worth the risk?
Images from WhichTestWon, copyright protected.
Absolutely! The larger image enticed 63% more visitors to click to start the bidding process. Even better, a whopping 329% more visitors who started bidding actually filled out all the online forms required to place a bid.
So, the larger image helped fickle bidders maintain their initial excitement as they worked their way through the bidding process.
Case study example #2: The attack of the 50 foot button
We think of this multivariate test as ‘the button that wandered near the nuclear power plant.’ The testing team for Profile Pimp, an online service targeting young adults, tried 45 different variations of its ad campaign landing page.
All the versions used the same offer and much of the same copy.
You can see the control version the team started with here. As you may notice, the button on the control was pretty big already. In fact, it’s larger than most marketer’s response buttons!
Images from WhichTestWon, copyright protected.
But, the winning creative seen below, had a MASSIVE button. In fact, we’ve never seen a bigger button before or since.
Images from WhichTestWon, copyright protected.
Measured test results were equally massive. The winning version had 135% higher immediate clickthroughs. Plus, the service gained 51% higher earnings per click as visitors made their way down the conversion path to purchase.
Could you make your buttons bigger? It’s an easy change and worth testing.
Case study #3. Testing a mega-sized background image
This test shows that bigger images can work as well for B2B as they do for consumer marketers.
Dell’s testing team wanted to increase lead generation. Their original landing page wasn’t bad at all. It was designed using best practices including no distracting navigation, useful bullet points, and easy-to-use form and no scrolling required.
Images from WhichTestWon, copyright protected.
Dell’s testing team tried a radical revamp for their test, using what we call the ‘mega-sized background image’. Basically, instead of using an image as one of many page elements, they used the image as the background that the rest of the elements sat on.
So, the background becomes your ‘white space’.
This is a responsive design test we’ve seen many other marketers using recently, including ecommerce sites in Europe. Did it work?
Images from WhichTestWon, copyright protected.
The mega-sized image lowered visitor bounce rates by 27%, plus it increased leads generated by 36%.
Dell was so impressed by these results that the testing team ran out similar redesign tests for other B2B product lines… and so far they’ve all raised lead generation and contact form conversions as well, sometimes into the triple digits.
Warning: we can’t guarantee larger images will always increase conversion rates. No one can tell you that. Your brand, web pages and site visitors are all unique, so what will work can’t be predicted with a simple best practices guideline.
Also, as we’ve seen across many, many tests, the wrong image (and sometimes any image at all) can reduce conversion rates, often dramatically. If your image isn’t compelling for your audience, making it bigger probably won’t help.
Our advice is to reduce your risk by testing. Always run an A/B or multivariate test until you have conclusive results or until 21 days have passed (whichever comes later) before you roll out a design change.
Just use this article to inspire your design team (or the HIPPO) to let you get started testing.
Justin Rondeau is the producer of WhichTestWon’s The Live Event, an intensive two-day conference held each May featuring Case Studies and Workshops on how to optimize for better conversions. Econsultancy readers can get $50 off their tickets by using the coupon code Econsultancy at http://whichtestwon.com/TLE.
Reader comments (20)
6:45PM on 21st March 2013
Great post, James.
The increase in conversion rate in the third case study may also have been impacted by line of sight?
In the first smaller picture the most prominent people look away from the headline.
In the second picture the lady looks towards the form.
6:47PM on 21st March 2013
Sorry, Justin. I didn't mean to change your name :(
Producer at WhichTestWon's The Live Event
7:10PM on 21st March 2013
No worries...actually where did you change my name? I didn't notice it, no harm no foul.
9:01PM on 21st March 2013
I'd left you a comment to say it was a great post and called you James by accident. Maybe that's why it got trapped in the spam filter? ;-)
I wondered whether the increase in conversion rate for the third case study had something to do with the line of sight.
In the first picture two people look away from the headline. In the second picture the lady looks at the form.
Business Development Manager at Gibe Digital
9:43AM on 22nd March 2013
it's also interesting to note that in the Dell 2nd version all the marketing bumpf is reduced to a minimum and the call to action is particularly clear. Got to agree with large images, possibly something to do with T.V. viewing habits or just that it increases trust with the viewer?
10:01AM on 22nd March 2013
I'm curious to know where the figure on scrolling comes from - 'as few as 10% of visitors will bother to scroll down'?
The 'fold' article that you link to acknowledges that usability studies have demonstrated that the need to scroll is not a barrier for people.
Editor at Econsultancy
10:54AM on 22nd March 2013
@Henneke - Sorry, your first comment was picked up by our spam filter.
Head of Digital at UBER
12:23PM on 22nd March 2013
I too am interested to know where the substance behind the line 'as few as 10% of visitors will bother to scroll down' comes from.
Maybe 15 years ago people didn't know to scroll down pages yes, but in 2013 I think you will find most people not only know to, but want to scroll to find the information they were looking for.
Otherwise we would go back to the dreadful letterbox style websites of the early 2000's where people wouldn't put anything past the fictional fold.
Finally, if only 10% of people scroll down the page why is your comments box at the bottom?
Marketing Intelligence Director at 5ENSE
12:59PM on 22nd March 2013
Very interesting results. If you're going to use a photo, it also makes the case for using a professional photographer that can give you something compelling and unique. It's no secret that magazines spend a lot of time and thought in choosing their cover photo, so it makes sense to do the same for your key web pages.
Editor at Econsultancy
1:08PM on 22nd March 2013
@NIc This is a guest post.
I'll ask Justin to explain that 10% stat in more detail but I agree that many web users are quite prepared to scroll.
Some useful stats on that here: http://uxmyths.com/post/654047943/myth-people-dont-scroll
Producer at WhichTestWon's The Live Event
1:59PM on 22nd March 2013
I'll try to answer every comment here:
@Henneke It is likely that the visual cues caused by the photos, in this example the woman looking at the form vs. a group with their back towards it, increased the natural eye flow potential on the site. Just like arrows or other pointers, the direction in which eyes are pointing have an incredible impact on where a visitor looks next. If Dell ran an eye tracking study on these pages, they could get further insights into the causal relationship between the images and eye flow.
@Pete I'm curious as to why the shift to larger background images is growing in popularity. We just published a member newsletter a while back about other trending test case studies we have seen. Check out KinderCare, they had an interesting redesign. We also have the case study in our archives:
http://whichtestwon.com/archives/20769
@Andy Though the need to scroll is not a barrier it is certainly a hurdle. Obviously people know that they need to scroll on a site, but that doesn't take away from the need to get your most compelling call to action above the fold in a manner that is easy to digest. Check your analytics, how much action happens below the fold for you?
As for the 10% stat you are right, that is too small of a percentage, as of 2010 it is ~20%. I will edit this in the article. When it comes to scrolling, it simply boils down to understanding the current needs of a visitor on the particular page. For instance, I absolutely hate a news site that splits long articles into sections...I'd much rather scroll. If this is a similar sentiment to a site I frequent, they may notice a large bounce rate on the first page of their story. If they notice this, it may be time to test out the long page story that requires scrolling.
Here is a great read about when to use short form vs. long form, scroll oriented pages.
http://www.nngroup.com/articles/scrolling-and-attention/
As a side note, I think with the adoption of endless scrolling on social media sites the percentage of people who scroll will continue to increase.
@Nic This stat is not saying that people don't know they need to scroll down, it is suggesting that they don't.
Please flesh out your concept of the 'fictional fold'. Are you suggesting that the fold in and of itself is a fiction or are you stating that it is a moving fold based on the popular browser resolution per site and is thus relative?
To answer your question, comments sections are down below because 1) the people likely to comment would have had to consume a all (or a majority of the content) 2) it is inappropriate to ask for comments above, prior to content consumptions.
Also I'd be interested to see the stats of visitors to unique comments on sites, it's likely far less than 10%. To be clear I am not saying that the only people who comment are the people who scrolled down, because that would be just silly.
@Kaveh Totally agree, professional & unique [none of those gross stock photos] photography is critical.
VP, Paid Search at PPC Professionals
11:09PM on 22nd March 2013
Great! Test Test Test, or you'll never know what converts best.
Love whichtestwon.com it's a fun site.
The reality is do your best then test it, tweek the winner and test again.
I have had conversion rates move from 1.5% to 7% within 5 or 6 tests on landing page as well as cart variations Just always be sure to test one thing at a time to keep your sanity.
12:56AM on 24th March 2013
"Responsive web designers know that on many sites, as few as 20% of visitors will bother to scroll down." -- #1, I don't believe this statistic; #2, the article you link as your reference has no such data contained within it. Please support your statistics with research we can rely upon and challenge. The real stats are probably something like 80% of visitors scroll.
Otherwise, your article presents some interesting things to consider when publishing an online article -- information I have wondered about frequently. I usually go with larger images because I think it generally looks better with the text.
Producer at WhichTestWon's The Live Event
10:52AM on 24th March 2013
@Carisa
Please check the comment I posted above. Here is a link that says 80% of people actually don't scroll and spend most of their time above the fold.
http://www.nngroup.com/articles/scrolling-and-attention/
Head of Digital at UBER
11:28AM on 24th March 2013
@Justin Wow, just wow. You took the line 'Web users spend 80% of their time looking at information above the page fold. Although users do scroll, they allocate only 20% of their attention below the fold.' to mean that only 20% of people scroll!
I may be being a little pedantic here to make a point, but if you are going to include contentious figures in an article at least be able to back them up otherwise you are going to get comments like these.
The article doesn't suggest that 80% of people do not scroll, just that people spend 80% of their time at the top of of the page.
I call the fold fictional because it doesn't exist as a static number, it can't as there are too many variables such as browser type, screen resolution, installed menu bars, viewing preferences (full screen etc), I could go on.
For me what is a good article with some great insight about image size has been spoilt by a throw away comment about scrolling, which I see you have updated from the 10% you started with to 20%.
Producer at WhichTestWon's The Live Event
4:26PM on 25th March 2013
@Nic
You are right, my interpretation of the data is off. However, doesn't it really come down to user attention and turning that attention into action? If people aren't consuming the data below the fold, i.e., only allocating 20% of their attention there, doesn't it still make sense to get your main CTAs and most compelling information above the fold?
I [currently] disagree with your concept of the 'fictitious fold'. Yes, the fold varies between different companies based on their audience. However, each individual company should have an understanding of the most used resolution, browser, etc... and plan accordingly.
I think as responsive design gets widely adopted the current understanding of the fold will become a thing of the past, I just don't think we've gotten there just yet.
8:59PM on 1st April 2013
If you look at the dell a b test, the first page had very grey text, and not so much visibility. The second one with the high contrast tells the user where to focus.
11:27PM on 1st April 2013
Ok. Im off to do some a/b testing. Looking to reduce bounce rate and increase enquiries. Thanks for the useful links Justin.
Mark
7:51PM on 2nd April 2013
Holy moly! We've been doing some tests on supersized buttons (or even duplicate buttons: top/bottom) with great success but that extreme button size takes it to a whole new level!
Producer at WhichTestWon's The Live Event
7:57PM on 2nd April 2013
@Ibrahim I was actually surprised that the white text worked so well, generally white text performs poorly (despite it being used so much because it looks nice). I think the other thing that I really like about this test is because the original page was already fairly well optimized.
@Mark Glad I could help, when you finish your A/B tests drop me a line, I'd love to see them!
@Edwin - I have seen some very successful tests using duplicate buttons, it's always a great idea to keep the CTA top-of-mind. Extremely large buttons are really hard to ignore, and in the case of the above test really helped with conversions.
Log in to post a comment