For eCommerce websites, there are only two calls-to-action that actually generate sales and drive profits: Add to Cart and Complete Checkout. While we at Goodbye Crutches routinely A/B tested other aspects of our website that move visitors through the process, we tended to regard these two most important buttons as set in stone.
Then we realized how little sense that made if we wanted to generate sales and drive profits.
1. Define your goals
So we set out to test the impact of different variations of our Add to Cart button and to develop our own set of eCommerce best practices. The control we used was the standard button offered by our shopping cart provider (CoreCommerce), and the test version was a button designed using the Call-to-Action module in Hubspot. No other changes were made to the page or to the source of visitors.
2. Run your tests
The first test we ran of these two options yielded a two-fold improvement in the click-through rate on the second button (6.73% vs. 3.23%). While we continue to test in areas to further improve this most vital customer action, we do have some hypotheses as to why this increase occurred, and look forward to testing them all when time allows.
3. Analyze your results
So what did we find? Well, a few discoveries really stand out:
Bigger Buttons Get Noticed
Having a larger call-to-action button directs the customer’s eyes to the desired action. Our test increased the area of the button by 640% (0.3 sq inches to 2 square inches). We will continue to test how much open page space is optimal and when "big" becomes "too big."
People Notice Contrasting Colors
The original colors - black and orange - were intentionally chosen to flow with the overall colors of the site (yellow and orange). However this similarity made it blend in with the page. While the blue button clearly clashed with the other page colors, the results speak for themselves. We will continue to test see just how contrasting we can make it.
Bigger (text) is Better
Our best performing button had text that was almost twice as large as our control button. Since the average age of our target demographics is older than the average internet user, this test result has caused us to test the text size of all of our pages to see if this has an impact on readability and subsequent purchasing behavior.
Delayed Page Loading Can Work To Your Benefit
The button that performed the best benefitted from a time delay, as it was the last piece of code to render on the page. While the length of the delay varied with internet connection speed, this delay provided the added benefit of it “popping” into open space on the page and drawing the viewers' eye.
With more than double the percentage of potential customers “Adding to Cart,” this newer button should help us achieve our goal of increasing sales.
Using the CTA buttons created through the Hubspot software has given us the added benefit of being able to change our prices quickly in response to rapidly fluctuating conditions. Whereas it used to take us four hours to change a price on all of the pages of all of our various sites, now it can be done in a matter of minutes, as these buttons can be edited like any other text. This has made it much easier to run short-term sales like 14-hour sales, weekend promotions, and the like.
We're always joking that once we understand our customers our business will be easy. Oddly enough, A/B testing has helped us discover what our customers actually prefer, rather than simply guessing.
Originally published Feb 16, 2012 8:00:00 AM, updated January 16 2014