Ecommerce sites make their money when people hit the checkout button. Your job has an ecommerce manager or marketer is to get as many people to click that button as possible. All of your marketing efforts online point back your calls to action on your website.
With so much weight being placed on a single button, it’s important to spend a lot of time to make sure that your checkout buttons are doing their job and encouraging visitors to proceed through the checkout process.
So how do you do that?
The most effective way to optimize your checkout buttons is by choosing buttons with proper size, placement and color. While size and placement are vital in the conversion process, changing the color of your checkout buttons can be a quick adjustment that drastically impacts conversion rates for your website.
Many best practices when it comes to color selection for ecommerce sites are rooted in science. Color psychology reveals that certain colors propagate different feelings in consumers. Are your checkout buttons pushing the right psychological buttons to cause visitors to click?
Red is a passionate color and creates a sense of urgency. A great example of this is the super store Target. Unsurprisingly, red is the prominent color of their website, as evidenced by the navigation. When viewing your cart, you also see a red checkout button. Urgency is spread throughout the site, right up until the checkout button.
Another approach for using red is the fact that it invokes hunger in the consumer. Think about some of the largest food chains in America: McDonald’s, Burger King, Wendy’s, KFC, Pizza Hut, In-N-Out, Applebees. All of these feature branding that is prominently red. This is also the approach that Edible Arrangements takes. They have red sprinkled as the main call to action color on their site, hoping to make the customer crave their product.
Like red, yellow is eye catching. Unlike red, yellow offers the customers a sense of cheerfulness and warmth instead of urgency. Yellow is used by sites mainly for two reasons:
1. To Ease Burden
Yellow is seen as a pleasing color. Web designers use yellow for the checkout button to make the consumer feel better about their purchase. This is portrayed on children’s clothes site Crazy8. Moms who are shopping for their young children are a great market to target with yellow, offering them a calm, pleasing feeling as they browse your site.
2. To Contrast
Yellow is a standout color. It is easily contrasted with just about any other color. The most popular site to use yellow in their checkout button is Amazon. The website, which is mostly white, adds a splash of color here and there, but it’s the yellow button that sticks out the most! This allows the user to easily find the next step in their purchase.
Yellow can be a powerful color if used in moderation. When used excessively throughout the site, it can repel the customers. This is why it is most common for just the checkout button.
Red, yellow, and green. The three colors that are associated with a stoplight. For those designers who don’t want to use red for their call to action button, they will most likely decide on green. This is because they believe if a user sees red they will “stop.” Green is the colloquial color for go! For that reason green is used as the checkout button of many sites. American Eagle is one of those examples.
Contrast Colors and Size
While some sites lean toward red and yellow for the checkout button because of the psychological aspects the color brings, other web designers believe in the art of contrast to the catch the attention of the consumer.
The Journal of Product Innovation Management did a study that revealed that consumers tend to be more quickly drawn to products that stand out from other nearby colors…the same can be said for checkout buttons. Work with your existing color scheme to come up with checkout buttons that stand out from other elements of your site.
Many popular sites use this approach. Amazon and Walmart both handle their websites by this route. American Eagle and eBay are in the same boat. Walmart uses large orange calls to action on their website. This drastically contrasts agains the blue and white color scheme their brand is known for.
When “Big Box” retailers like Walmart are making contrast a huge focus of their website, it’s something that is definitely working well.
“Testing Testing 1-2-3”
So you’ve made the changes to your checkout button, but you aren’t sure if the return is going to be what you’re planning for. How do you check to see which button the consumer favors? Thanks to Google and their infinite numbers of tools, I have an answer. Google’s Content Experiments allow you to compare how different web pages perform using a random group of your visitors. Another site that offers a similar service is Optimizely.
Unless you test a handful of different button colors on your website, you have no way to know which color will actually perform best. Just because your brand colors are blue and orange, for instance, doesn’t mean one of those will bring in the highest number of conversions.
One other way to maximize the impact of color on your site is by using several different colors of checkout buttons and calls to action. For example, you can create several different landing pages for each segment of your email list. Pushing a hard sell for existing customers? Try blue or red. Going after a younger demographic? Maybe green or yellow will work best. Don’t be afraid to experiment with different color choices on each area of your site.
So Which Is Best?
I realize that in this article I haven’t exactly told you which color is the best for your ecommerce site. What have done in turn, though, is given you the tools to find out which one is the best for your site. It’s going to take some work, but I’m confident you are a driven individual who wants to make a sale.
As a generalization, ecommerce sites that sell food should go with a red checkout button. Kids clothes or cutesy items would be safest with a yellow checkout button. Those sites that sell most everything else should be able to stand out with a green or even a blue button.
There is no perfect answer for your website, however. Depending on the pscyhographics of your target market, layout of your website and brand colors, you’ll have to try a number of color combinations to find the one that will convert highest for you.
Throughout the whole process of designing your checkout button, remember that this one button is the most important call to action you’ll have on your ecommerce site! Your entire site is funneling people in to click that button. Follow the guidelines in this article and the suggestions from your company to make it as captivating as possible.