Call To Action Buttons - Does Size Matter?
I came across a website (that will remain nameless) while searching for a good tasting Swiss-water decaf coffee. (Does one exist? Please advise in the comments!) I noticed on the product page that it had perhaps the world's tiniest Buy button.
They Say Bigger Is Better
Many conversion optimization cheerleaders who suggest larger buttons convert better, and some tests show even different colors can perform better. Marketing Sherpa credits cart button design as one of 7 tweaks that helped Newegg.com boost online sales by 30%.
#7. Bigger, flashier cart button
"It used to be just a cart with a little arrow. It wasn't big enough. People's eyes weren't going there, so we made it big, bold and very exciting to look at," said Stuart (Wallock, Marketing Director of NewEgg.com). The team a/b tested several different cart icons before picking the winner, so go check it out.
This is the evolution of NewEgg's cart icon design:
Wallock mentions several different cart buttons were A/B tested in the last redesign - we're not sure if they were different colors and different sizes, but the "winning" icon is not a relatively large button compared to other retailers':
(From our collection of shopping cart buttons)
Testing Different Designs
Back to our decaf coffee product page. I mocked up some alternative pages which hypothetically could be used in split testing.
Here the buttons are bigger - easier to read. But the Continue Shopping button is larger than the Add to Cart. Probably not the best design.
Here's an alternate version with the button text "Buy." This would make a good split test to determine which button text converts higher (with the same button design).
Personally I prefer a design like this - a large, easy to read and well-positioned Buy or Add to Cart button, with a less prominent text link back to shopping.
But maybe the white button doesn't stand out enough? We'll throw in a sweet jelly bean red button, because some swear that red "stands out more." Check out a couple lively discussions from people who have actually tested this at Grokdotcom here and here.
Google Website Optimizer makes it easy for anyone with an AdWords account to run simple split tests. GrokDotCom has compiled Google Website Optimizer - 7 Free Resources To Get Started including a downloadable guide and white paper, podcast and webinar archive on the subject of A/B split testing with Google Website Optimizer. They even developed a WordPress Plug-In for it.
Google also has its own training video here.
A Few More Suggestions
Just a side note: This is perhaps the blankest product page I have ever seen.
This post is about cart buttons but I can't help but offer a few web design suggestions to make this page more effective:
1. Use a product image. Fair enough, coffee is coffee - it's not a wedding dress. It's not absolutely crucial I see an image of what I'm getting. However, if this were a gift, I would be very concerned about how the packaging looks - I wouldn't want it to look like a generic supermarket brand.
2. Show some cross-sells. Often times coffee is sold in whole-bean form. If the customer doesn't have a grinder, he may reconsider the purchase. What an opportunity for this retailer to save the sale and up the order value by showing its grinders available for sale. Or better yet - recommending one grinder to make it quick and easy for the customer to make a decision. A "top rated" or "best value" label would be very effective.
3. Show product ratings and reviews. For a smaller retailer, it can be difficult to populate a site with enough review content. If this is a mom-and-pop shop selling organic coffee, it could locally give away free samples to family, friends and neighbors in exchange for an honest customer review on the site - or do on-site taste tests at a local PTA meeting or something.
Customer reviews are extremely important, especially for something like organic decaf swiss water coffee which is very healthy but tends to taste awful. When evaluating this item at under $6 for 5 lbs vs. Seattle's Best's version available at Cooking.com at $30 for half the weight, I honestly would prefer to try the more expensive product first because it has six actual customer reviews.
4. Show Shipping Info / Calculation. There's more than enough room to mention where you ship to, or at least include a text link to this information, because that's usually a top customer concern.
5. Include a Phone Number. The less product information you provide, the more potential questions your customers may have. This site has a toll-free number but it's buried in the footer menu.
Like what you’re reading?
Check out some of our other great content here
Get actionable insights on ecommerce trends and best practices
You'll receive a welcome email shortly.