How to Use Colors for More Effective Landing Pages

by 20 01/08/2014

We all know that colors play a large role in our marketing efforts, but have you ever taken a closer look at how color may be affecting your bottom line?

Believe it or not, color has a powerful influence on our emotions and decision making abilities, not to mention our first impressions of everything from a logo to a landing page.

Using Colors for Landing Pages

Psychologists have suggested that color impression can account for 60% of the acceptance or rejection of a project or service.

Is this statement backed by data? You bet, it is.

According to recent research, 92.6% of people say that visual dimension is the top influencing factor affecting a purchase decision. By harnessing the power of color, your business has the potential to be even more successful, particularly in regards to conversion optimization.

Let’s examine how colors can play into building more effective landing pages:

Designing for Gender

Depending on your industry, gender preferences may play heavily into purchase decisions so it pays to do your research on which colors can persuade someone to stay on a page and take action.

For women, according to this research, colors that appeal to them most include blue, purple and green while orange, brown, and gray are least appealing.

Marie Forleo’s B-School was all about women, and when it was launched, it became a huge hit instantly. But a lot more goes into a successful launch than knowing who you’re targeting. From landing pages to email templates everything was branded perfectly—that attracted the right buyer for her.

Marie Forleo Women focused Landing page

For men, blue, green, and black are often well-loved and brown, orange, and purple are least-loved. Keeping this in mind, consider your color choices when crafting your call to actions, buttons, or landing page design in general.

Let’s take a look at the landing page of a male-focused startup that really got our attention in last two years, thanks to their viral video.

Other than having a strong call to action, the landing page  gives a real masculine feel with the brown wood background and orange elements.

 Dollar Shave Club Men Focused Landing Page

Designing for Age

When choosing colors for your landing page, don’t forget to take into account your demographic spread in terms of age. In an online research project conducted by Joe Hallock, color preferences based on age were documented and explored.

In general, children or younger audiences tend to prefer warm and bright colors that are associated with positivity and high energy such as:

  • Red
  • Orange
  • Pink
  • Yellow

However there are few colors that are often associated with sadness and negativity by children, these are:

  • Brown
  • Purple
  • Blue

As people age into adulthood, there’s shift in color preference towards cool shades, as evidenced by blue being widely regarded as the most popular favorite color by adults.

Adults have also been found to associate more symbolism or emotion with certain colors, such as black being associated with mourning and red being associated with alarm, intensity, or passion.

Which leads us into our next point: Perhaps one of the most powerful factors that plays into color choice in landing pages is that of color psychology and symbolism.

Designing for Emotion

Depending on your goal for your landing page, you may want to encourage a user to feel a specific emotion. This can be accomplished through a combination of smart design, well-written copy, well-chosen graphic elements, and of course, color.

Research tells us that these colors tend to be associated with these emotions:

  • Red: This is a polarizing color that triggers opposing emotions of love and passion, as well as anger and danger. It’s known to increase heart rate and generate excitement. Plus, in some cases, it can boost appetite.
  • Orange: Often associated with vitality and happiness, orange draws attention and expresses energy. It’s more inviting than red but is still attention grabbing. Many agree that it’s a great choice for a call to action.
  • Yellow: Associated with laughter, hope, and sunshine, yellow is about giving a gentle energy to a page, with a goal of making it feel cheerful and optimistic. However, yellow should be used in moderation, as it tends to irritate the eyes if over used.
  • Green: Rebirth, life, health, wealth, and growth are connected to the color green. Naturally, green is a color found in many financial organization logos since it suggests growth, financial health, and possibility.
  • Blue: Known for being a very calming color, it’s also associated with trust and security (and can be found in many company logos as a result!). Blue actually encourages the body to create chemicals that soothe and calm, allowing the viewer to be more relaxed. Additionally, it’s regarded as a favorite color by most, so it’s often seen as very professional.
  • Purple: This color is associated with creativity, nostalgia, royalty, and wealth. It can be soothing or intriguing, depending on which shade you choose. It’s often associated with luxury and romance.

Gregory Ciotti has created one of the most comprehensive pieces you could read about the psychology of color on the Help Scout blog.

In his article he says:

“Additional research in studies on color perception and color preferences show that when it comes to shades, tints and hues men seem to prefer bold colors while women prefer softer colors. Also, men were more likely to select shades of colors as their favorites (colors with black added), whereas women were more receptive to tints of colors (colors with white added):

 

Bright vs Soft Color Preference in Gender

 

Landing page Men Vs Women

Source: KISSmetrics

The above infographic from KISSmetrics showcases the disparity in men and women’s color preferences.”

Now that we have all this information and data you can start making landing pages with color that will resonate with your target audience to see which one converts best. The work does not end by simply creating a landing page, more in-depth research can be conducted on your particular audience segment by doing A/B testing.

There are dozens of examples where a simple change in the color of a call-to-action button increased conversions, since other than copy, design and color play a huge role in the success or failure of any landing page.

Some real-life case studies are referenced here, but feel free to conduct one of your own. You may be surprised at changing the color of a call to action or a click to purchase button making all the difference in your conversion rate.

Image Credits: Magician extracting colored paint

Print Friendly

About 

Muhammad is the CEO of Omnicore - Digital Marketing Agency where he helps startups and small to medium sized businesses achieve higher ROI through actionable marketing strategies and conversion optimization. To get in touch, Follow him on Google+ and Twitter @muhali786

Get our Daily Newsletter

Get conversion optimization, design and copywriting articles delivered to your inbox FREE

20 COMMENTS

Jay

Yes, color is important in design. Cave men used color to indicate threats as well as honeypots. Now we’re doing it with pixels on LEDs instead of plant dyes on rock walls.

Anyway, great summary. It would also be great to mention how extremely subjective the theories are on which colors are suitable to which genders and ages, as well as which colors evoke certain emotions. To that point, we’re attempting to perform our own usability testing on some of the sites we’ve designed with strong color palletes; green within morethemerrier.com, yellow within grubsly.com and 225am.com (still in private alpha) and purple within our own – newhaircut.com.

January 8, 2014 Reply

Lasse Kjær

Great article, but something is a bit “off”.

You write: “For men, blue, green, and black are often well-loved and brown, orange, and purple are least-loved.”

Okay, so brown and orange are two of the LEAST-loved colors.

After that you mention the “Dollar Shave Club” for using colors wisely and writes:
“the landing page gives a real masculine feel with the brown wood background and orange elements.”

You see what I mean? Or am I misinterpreting something?

January 9, 2014 Reply

    Muhammad Ali

    Hi Lasse,

    Thanks for dropping by. The research showed that brown, purple, and orange are least loved but that doesn’t mean they don’t convert when it comes to landing pages design too.

    You’d see that both Dollar Shave Club and The Art of Manliness have opted for the grunge brown design. Eventually it comes down to what your product is and what is your target audience.

    I hope it answers your question.

    Best,
    Muhammad

    January 10, 2014 Reply

Ashley

Hi Muhammad,
I love the whole color thing and how it can really affect websites and the way that people interact with them. I have also wriitten some interesting posts on the meaning of color before such as
madlemmings.com/2013/07/25/meaning-of-color/ which people really enjoyed too.

People often do not understand the use and impact of color, so such great posts as yours are super helpful!
thanks for sharing
ashley

January 13, 2014 Reply

    Muhammad Ali

    Hi Ashley,

    I’m glad you liked it. If you need anything else, feel free to ask :)

    January 15, 2014 Reply

James

Hi Muhammad

Great article and some great examples. I find the concepts of colour and typography really interesting in how they can drasticallly alter a visitors perception of the site and therefore their experience yet colour and typpgraphy are still, sometimes, discussed at the end of a designs process and sometimes not at all.

I found the points around the impact of gender and then age interetsing. It creates some food for thought if you have a marketplace that has to deal with both genders across a multitude of age ranges in which colours you should consider to gain the reactions you are looking to achieve.

January 14, 2014 Reply

    Muhammad Ali

    Hi James,

    I’m glad you liked the post, if you have any questions feel free to ask :)

    January 15, 2014 Reply

Reshu

Nice read Ali! You’re right! Colors can make or break a landing page. It’s extremely essential to design your landing pages taking your color associations into account. Colors cannot only make your page more readable and attractive, but when used correctly are also good in evoking emotions in people.

As you said, when picking a color you have to take gender, age and emotion into account. Other than these, it’s also extremely important to take culture into consideration while designing your landing pages. As, different colors have different significance in different cultures.

TIP: A/B test your landing page design elements to find out what works for you. Keep experimenting until you find the right mix.

Other than color there are few more things that are essential for your landing page conversion. Have earlier shared my views on landing page optimization here:
http://www.betaout.com/blog/how-to-design-a-landing-page-to-maximize-conversions/#_amrzeat0

January 15, 2014 Reply

WIlliam V.

Interesting read, Muhammad.

it is often easy to overlook the smaller things that can boost conversion. We are all concerned about usability, personalization, site speed, CTAs etc… but I guess it all matters. Based on my experience with visual optimization, the best approach is to hire an agency and have them deal with it. It can be challenging to find the right balance between accommodating the target demographic profiles, being consistent with brand colors and bringing everything together for an overall composition that works.

Cheers,

January 15, 2014 Reply

Monalisa

Brilliantly compiled article about the utilization of colors in Landing Page. A lot of attention must be given to the Landing Page Optimization to help convert visitors. I have outlined a few more aspects that count in maximizing conversion, which can be found here : pixelsmedia.net/turn-website-lead-generating-tool. Once again….thanks for sharing your great thoughts.
Cheers.

January 17, 2014 Reply

Muhammad Ali

@Reshu I agree with you some extend on taking culture into consideration, as I think it would be more appropriate taking culture into consideration when you are targeting locally e.g just any specific city, country OR ethnic group. If you are a service provider like us providing Digital Marketing Services you have to take things globally.
Glad you liked it:).

@William Much Happy you found it interesting. Yes, it is always a best approach to hire an agency to maximize your ROI.
Best, :)

@Monalisa Pleasure I was able to provide worthy information.

Happy Testing.

January 18, 2014 Reply

Ketul

It seems every little change can create a great result. Can’t wait to bring it into play. Thank you for your great post!

January 23, 2014 Reply

Muhammad Ali

@ Indeed. Minor changes do create huge impacts on ROI. Don’t forget to Share your experience when you play.
Regards

January 23, 2014 Reply

D Thomas

Wow very interesting read, by pure chance my own website happens to be a combination of blue and black but as a designer, I would always put more emphasise on the branding etc, never really thought about how much the colours could influence people’s decisions!

Thanks for a great post! I’ll shoot off now and add more of these colours to my call to actions :-)

March 3, 2014 Reply

    Muhammad Ali

    Hi Thomas,

    Elated to know I could add value to your time. Please share your experience after testing.

    Regards,

    April 11, 2014 Reply

chris cornish

Great article; thank you. Wish I read it before having my logo designed; looks like I dipped out on the females by using grey. I appreciated your use of examples as they gave stark differences between what females and males find appealing.

April 9, 2014 Reply

    Muhammad Ali

    Hi Chris,

    Thanks for sharing your thoughts.
    It’s always my Pleasure, I will try to write something more useful to give back to my community.

    Thanks
    Regards,

    April 11, 2014 Reply


Leave comment

Some HTML allowed

Get conversion optimization & A/B testing articles FREE >>>