[display-name-category]

[post_author]

You don’t need to be a classically trained or highly qualified designer to pick great colors for your website. You just need a sense of adventure and a basic understanding of what works and what doesn’t.

Pair it up with some reference material to bring you up to speed on current research findings with regards to employing color psychology in your marketing communication and you will be set.

So, grab a coffee and read on to learn how to leverage the power of color to create more engaging and effective websites and more engaging communications in general.

Important Considerations When Choosing Website Colors

Does Your Website Need to Sync With an Existing Color Scheme?

If you’re lucky enough to have employed a professional designer to develop your company logo or stationery such as business cards etc. you probably already have a style card containing color references. These specific references should be passed onto your web designers to eliminate guesswork when building your website color palette and match them up with your existing brand colors.

This also has the added benefit of creating great flow between your offline and online marketing materials. At the same time, it improves the consistency of your communications with new prospects, existing customers, and business partners.

What’s the Purpose of the Website?

If you’re trying to portray a certain image or create a certain emotional connection with your website visitors, it’s worth taking some time to plan around these objectives by brushing up on the psychology of color before you begin your design.

In general, each color evokes a specific mood. A brighter, warmer color such as red, orange, or yellow have a tendency to energize a user and make them more alert. While darker, cooler shades such as green, blue, and purple tend to have a more relaxing and tranquil effect on the user.

So, how does this apply to your website design? If you’re a funky, edgy, and active brand, such as www.glowvibegolf.com employ brighter, more vibrant colors to create an energetic mood. But if you’re a spa or wellness clinic like www.officialmedispa.com, you’re better off using a more muted color palette made up of cooler, more calming colors.

What Kind of Photos and Graphics Will do You Incorporate Into Your Site?

If you plan on building your website around a certain set of images, then it’s probably best to build up a color palette based on the content of your images. Or, if your images are regular photos and don’t quite mesh with your existing palette, consider using a color photo filter to tweak your images for better cohesion and integration with your color choices. This image photo filter technique is something that is often overlooked and exactly the kind of attention that can take your web design from good to great.

The type of graphics, photos, and images you use on your website make a large impact, so make sure that they convey the right message and set the right mood for your audience. Set the right tone, create the right mood, and deliver the right message and you’ll be well on your way to a great website design that leaves a favorable lasting impression on your users.

Is It Time to Update Your Colors to Leverage Modern Design Trends?

Sometimes, it will be necessary to rethink your color palette. Design trends come and go, and if your business created an identity that was subject to one of these, then it may be time to consider an update.

What worked for your company before may no longer be applicable. Design styles, user preferences, and consumer opinions change and if you’ve fallen out of touch, color is a great way to reinvigorate and reconnect with your marketplace.

Don’t make the mistake of being overly attached to a logo or wordmark which is out of date, echoing this through your new website design is a recipe for poor messaging which holds very little emotional impact and hence, poor engagement and conversions. If it’s time to update your logo colors, review the infographic Color Psychology in Logo Design before you do, it’s invaluable guidance.

How Many Colors Should you Use?

As a general guide you should pick three different colors and use them in ratios of 60%, 30% and 10% respectively.

• The 60% will be the primary color of your site and set the overall tone of your design.

• The 30% should contrast with 60% to create a visually striking effect.

• The 10% is an ‘accent color’, which should complement either your primary or secondary color.

Leverage Shades and Tones for Greater Variety

In many cases, you will need to diversify your palette beyond your three basic elements. Rather than add a fourth and fifth color to your site and risk spoiling the harmony of the design, try leveraging different shades and tones of your existing colors to create additional color options.

For example, the image below, courtesy of www.flatuicolorpicker.com, portraits different shades of blue. 

Use Free Color Picker Tools to Help You Choose an Effective Color Scheme

Coolors.co –  A great looking and simple color palette generator with some cool features, including the ability to lock-in color choices while generating new ones and the ability to save them for future reference.

ColorLovers.com – AA community-based platform for sharing color ideas and inspiration. A never-ending assortment of amazing color palettes grouped by theme makes it easy to find some inspiration.

Design-Seeds.com – If you’re planning on using one main hero image as a source of inspiration for your color palette, then you need to check out their site.

Adobe Color CC – Formerly Adobe Kuler. This is a great tool if you’re selecting your color palette from scratch and want to experiment with different color rule combinations to find your ideal color scheme.

3 Strategies for Generating Colour Palettes

1) Start with a Blank Canvas

If you’re building a new brand, or rebranding, starting with a blank canvas can be a good way to start fresh. In cases like these use color tools such as Adobe Color CC or Coolors.co  to experiment with various color combinations and color harmonies until you find your ideal color palette. The built-in design rules ensure a harmonious result built up with colors that work well together.

2) Start with an Image

If you’re building your website around the main hero image or central image concept, then it’s often a good idea to generate the website color palette from that image. Sites like Design-Seeds.com are a great place to explore image-based color palettes or generate new ones based on images you already have.

3) Start with Business Goals

If you have pre-existing intellectual property documents or assets such as a logo, use it as a starting point for the development of your website color palette. Then, it’s probably best to base your color selection on business goals and values you’re trying to communicate with your audience. In instances such as these, having a color psychology chart or well-designed infographic on hand can guide you through the process.

In the infographic below you will find the psychology of colors pertaining to Call-To-Actions. And For More Information on Colors in Web Design check out The Art of Colour Coordination Infographic.

Give Colors the Attention They Deserve

Well, there you have it, time to refill your coffee cup, roll-up your sleeves and crack open a fresh perspective on just how important colors can be when used intelligently in web design projects. Color is a subtle, but very powerful aspect of your web design, give it the attention it deserves. By setting the right mood, creating the right emotional tone with your users, you’ll be well on your way to a website that is both attractive and highly functional. Back this up with quality copy and conversion-centered design for a website that converts like gangbusters.