19 Oct How to Choose the Best Color Scheme for Your Website
Last week, we talked about the importance of text, color and layout for your website’s call-to-action (CTA) buttons. This week, we expand our scope to the importance of your website’s color scheme. As pointed out by the insightful David Zheng, Editor in Chief at CrazyEgg, your business website is more than part of your branding. It’s essentially your company’s home online. As such, you need to immediately set the mood to convey what your brand is all about, and why visitors should do business with you instead of a competitor.
Choosing the right color scheme is essential to this process. Specialists in color psychology have written reams about colors and the emotions they evoke. Because such studies are readily found online (including the upcoming link to Neil Patel’s article), we won’t repeat them. In addition, their accuracy is being questioned by industry experts such as Gregory Ciotti, marketing specialist for Help Scout. Writing for Entrepreneur, he observes: “Certain colors do broadly align with specific traits (e.g., brown with ruggedness, purple with sophistication, and red with excitement). But nearly every academic study on colors and branding will tell you that it’s far more important for your brand’s colors to support the personality you want to portray instead of trying to align with stereotypical color associations.”
Following this same line, Patel observes that brand color has a correlation with brand value. “People make a subconscious judgment about an environment or product within 90 seconds of initial viewing,” he writes. “Between 62 and 90 percent of that assessment is based on color alone.”
Assuming your company has a logo (and if not, we can also help you in that department), the logical question may be, “Why not just use my logo’s colors?” This is actually a topic of debate in some quarters. We have visited online web designer forums in which designers have balked at using logo colors they consider ugly. Colors that may look striking in a logo can create a harsh, unappealing visual effect when used together on a website. The logo may have been created by someone outside the graphic design or marketing industry, who didn’t take brand identity into consideration. While this topic is another blog post unto itself, you can see how every element of branding interrelates.
However, beware of using colors that you do find appealing, if that’s your only criterion for selecting them. Writing for Design Shack, web designer Roshan Perera offers solid advice, such as avoiding color trends. Reason: your website will look dated as soon as the trend passes. If you’re following best branding practices, rather than your personal taste or desire to appear leading-edge, this shouldn’t be a pitfall.
Seldom discussed yet very important is the need for colors that can be seen by color-blind visitors. According to the National Eye Institute, as many as eight percent of men and 0.5 percent of women with Northern European ancestry have the common form of red-green color blindness. It’s a little-known fact that Mark Zuckerberg is color-blind, and used blue as the primary color for Facebook’s user interface because it’s the richest color he can see. If you don’t think that seems like a high percentage, losing even one potential customer because your website wasn’t accessible or otherwise user-friendly is one too many.
To become familiar with the array of visual possibilities out there, numerous free online tools are available for generating website color schemes. Design Shack lists its top 10 tools, along with the experience level for which each is best suited. Top of the list is Adobe Color CC, the go-to tool for professional graphic designers. It incorporates high-quality options and features to generate an advanced color scheme. It also involves advanced customizations and color rules – such as monochrome, compound and triads – which makes it more suitable for advanced designers.
Other tools on Design Shack’s top 10 list – like Coolors – create self-generating palettes, and are recommended for beginners. The caveat is that although Coolors’ palettes consist of compatible colors, they’re not necessarily great colors for your website, so proceed with caution if you choose this – or any other – DIY option.
One quirky source of inspiration is Cinema Palettes. This is a Twitter account featuring color palettes based upon scenes in noteworthy movies, with a still photo of the scene from which the colors have been pulled. Again, probably not practical as the basis for your website’s color scheme, but an interesting way to make creatives and non-creatives alike look at and think about color.
WordPress users can get tips for color selection from Themeisle. Although not officially affiliated with WordPress, the service offers both free and paid resources for WordPress users – including the basics of how to use the WordPress Customizer. There’s also help for navigating Adobe Color CC, for those who want to develop their design skills.
Keep in mind that as important as your website’s color scheme is, it’s one component of many that are necessary to build a top-performing website optimized for conversions and sales. For example, without proper optimization for SEO, your website’s color palette could be spot-on for your company’s brand identity, while your site still falls short in generating leads/sales. Hiring a professional web developer can ensure that your website is built according to industry best practices, with an aesthetic appeal that visually speaks to your target audience. Contact us to learn more and get started.