Over this past month I’ve been made hyper-aware of the lack of good old-fashioned common sense in the web design world. Perhaps it’s because I’ve been speaking at conferences, reviewing and critiquing websites and emails at a much greater than average rate. The upshot is, I feel visually assaulted by the result of thoughtless web design.
While this topic—that is, brainless web design—is something one could write an entire book on, I’d like to focus on one of the simplest and most easily remedied problems in the web world: lack of understanding of color and typography.
I’m amazed at the number of sites I go to where the type on the site is light gray, orange, pale green and even yellow. So I’ve put a small diagram together here to give you a quick lesson on what makes something easy to read.
Since you’re reading this in a digital format you’ll have a chance to see this demonstration in the environment in which the biggest transgressors are practicing their trade—online. The digital nature of a monitor, and the resolution thereof, takes what we know to be already bad practice with regard to reading and understanding website content—and makes it even more dramatically detrimental to the cause.
Before I go further, I should quickly revisit some of my earlier articles on legibility and response. The human eye is enormously sensitive to contrast—it seeks it out. On the other hand, it is over 2000x less sensitive to color changes—and this is where the problem lies. When your prospect or customer can’t easily read what you’ve written, their comprehension goes way, way down. And this is when we lose them. We fail to make our case for why they should buy this from US. And the other site—the one that’s easier to read—is the one they’ll most likely buy from, because that is the message they remember.
So…now check out my diagram with color and type.
Looking at the diagram, I don’t need to ask anyone which of these is the easiest to read—and where the eye goes first. The black type on the white background is always the winner. The black type on the warm orange background is the next most successful at getting my attention and comprehension, because the color is warm and there is still quite a lot of contrast between the background color and the black type.
You get into darker colors like red or blue, and put black type on them, and the contrast is much lower. You can read it, but not without some work.
The white type on the black background (we call this “reversed out”) gets high points for contrast, but for more than a violator like a dot whack it’s an annoyance that chases customers away quickly, according to all studies done on this topic. The more type you set in white on black or another color, the worse it gets.
The red block with the green type is the one that makes your eyes seem to ‘wiggle’—that’s because the green and the red are both the same value of dark to light. This is intriguing in a painting if done with some limits, but amazingly annoying to people trying to read.
I know it’s too late for most of you who did your catalog covers using green type on a red background, but, knowing this, at least you can fix your website before the bulk of your holiday customers come to visit. Just seeing that and staring at it for a few seconds gives you the idea of how bad it feels to read it.
Those who use cool and subtle treatments like pink on light blue, or white on a pastel…well, you can see how successful that is. And I can’t tell you how many white on pastel headlines I’ve seen this year. In a world where others are making their sites and their emails easy to read, this is a complete loser. Your designer may be in sheer bliss over how tender and lovely it is, but your customer is not moved, because it’s too hard to read.
And then, consider your older market, who may have lost some degree of their color vision. It’s even harder for them to read what you’re looking at now. And let’s not forget, this is an audience with time to shop and money to spend. Do you really want to alienate them?
We humans are smart enough to pare away the things in our lives that are too difficult, unless we really want to do those things. And reading copy and headlines on a website is very, very low on that list for all but a few of our most loyal customers.
So if you’re trying to figure out how to improve your bottom line, it’s time to take a good, hard look at your emails and websites, find what’s hard to read and fix it now. Making your site and emails easier to read truly is one of the least costly and most effective ways of increasing your sales.