Color choice is an important part of your website and marketing materials. I believe that design and usability go hand-in-hand. It is so frustrating to me when when something is so poorly designed that’s it’s hard to use. It’s also very frustrating to see something that’s designed to be pretty but not very functional. This is true when it comes to marketing, especially with websites.
There are many aspects to design, but I want to talk to you about color today, because color choice can make or break a website or marketing piece for one reason: contrast.
Contrast Isn’t Sexy
I realize that talking about contrast isn’t very exciting. When most people think about applying color to their marketing, they think more about what matches their brand. Some even delve into color theory – what color evokes the way I want my audience to feel? Red is sexy or angry. Blue is calming. Green relates to nature or money. You could spend days – weeks – trying to determine just the right hue and shade to make that marketing piece really pop – only to end up with something illegible, because without good contrast, your marketing materials can’t be read. And if they can’t be read, they can’t be understood. Then you’ve just wasted everyone’s time.
Print vs. Screen Reading
People read differently using print than they do on screens, and this is important when it comes to choosing colors. Some things that work well in one media don’t work well in the other. As we read print, we comprehend it better. Physically holding something adds a tactile layer to how we process information in a way that a computer or mobile device screen cannot mimic. That’s why I advise to keep content shorter on screens (with a few exceptions).
High Contrast, High Comprehension
The easier we as marketers make it for our audience, the more likely they are to actually read what we’ve written, and hopefully actually retain some of it. Using a high contrast between a background and text makes the brain work less, leaving more room for actual reading. That’s why black text on a white background is the most common way we read, even on devices. But that doesn’t mean we should shun color altogether. Color can be very effective when used properly.
Bringing in Some Color
When you are working with colored text on a colored background, there simply has to be enough contrast between them. It might be a nice design to have a monotone color palette, and it certainly has its place in design, just not with text. When you’re adding text, whether it’s a headline, menu, button or copy, it has to be easy to read. I realize that seems very DUH, but I see it all the time. We get so caught up in how pretty it is, we compromise on the readability – which is a huge mistake.
Considering Text and Background Colors
The MOST readable colors are black on white, but that’s pretty boring in marketing materials. When considering text and background colors, the length and size of your text matters. A headline is larger, so it’s automatically easier to read. You can be more creative here with text and background color. The more text you have, and the smaller it is, the higher the contrast needs to be. When it comes to blog posts or text-heavy brochures, black text on a white background, or something similar like a navy blue on a light off-white background, are best. Avoid patterned backgrounds in these areas too. Light text on a dark background is harder to read with smaller the text, so reserve that style for larger text like headings, or shorter pieces like menu items that are only a few words.
My Embarrassing True Story
We’re friends, right? I’m going to share with you something that is really embarrassing, but I’m telling you this because I want you to realize that we all make mistakes, and to help to prevent you from making a similar one.
When I was creating the branding for Little Birdie Marketing (back when it was Little Birdie Communications), I used yellow as my main color – well, as my only color, along with black and white (which don’t usually count in your color palette). The way my website is set up, the accent color is automatically applied throughout the website. I set it to my Little Birdie yellow and when on my merry way. It took a few months for me to realize why this was a bad idea. Every link on my website was in yellow, and on a white background, it was hard to read. It wasn’t just links within texts, it was ALL links on my website, including a list of recent blog posts on my home page. Imagine, here I am telling other people the importance of usability and readability, and my own website wasn’t utilizing this principle! SO embarrassing!
I had to make a change, and I wanted to keep yellow as my main brand color, but I clearly needed to add a new accent color that would fix my contrast problem. I decided to add a blue to my brand’s color palette. This difference is remarkable!
What’s Your True Story?
Now that I’ve shared with you my embarrassing true story, what’s yours? What do you need to change to make your website or other marketing materials easier to read? Not sure where to start? I created a free handy guide Pick the Perfect Color Palette For Your Website and Marketing to help you.