Why Good Contrast Really Matters

 

You know how when you buy a new a car, you start seeing that same car model everywhere? Where did they all come from? Before you had the car, you rarely ever saw it, and now it seems like there's one on every street corner! 

The primary reason this happens is personal connectedness. When we are personally invested in a particular car model, a type of job, a favorite hobby, or even a favorite cereal brand, we start to notice those things more often, and our ears perk up when we overhear someone talking about them. 

As a team of professional graphic designers, we always notice design layouts, both good and bad. When mail comes through our office, we sometimes sit and talk about how clever a promotional piece might be or (more often than not) how tacky a particular mailer is. 

Though we've seen countless examples of bad design, one of the most common design mistakes that we see is poor use of contrast. This blog post will discuss some of the common misuses of contrast and how to avoid them. 

The words that you're reading right now are colored black, resting on the white canvas of this page. Easy to read, right? But how easy would it be to read the same black words if they were resting on a navy blue canvas?

The graphic below features a couple poor examples of contrast as well as one example of acceptable contrast. 

 
 
  • The first example in the graphic above features two colors that don't belong together. The lime green and red combination creates strain on the eyes, not to mention the fact that its simply not tasteful. 
  • The second example illustrates how choosing too similar of a color for both text and canvas can result in lack of visibility. It's nearly impossible to read this example!
  • The final example also features similar colors. However, even though the colors are similar, there is enough difference between the two for there to be clear contrast and visibility.

Choosing the right colors isn't the only thing to consider when dealing with contrast. Another element of design that we've seen executed inappropriately is the use of watermarks.

When a designer uses a watermark behind a section of text it can add depth and style. However, if the watermark is too dark or has too high of an opacity percentage, the text can be hard to read, defeating the purpose entirely. 

Below are some examples. Remember, sometimes less is more!

 
 
 
 

If you're designing a layout, odds are you want it to stand out, right? You want someone to be able to look at it, admire it, and be able to successfully glean information from it. However, if you use contrast inappropriately, that's not what will happen. Instead, your viewer will look at your layout, strain his or her eyes, wonder what your text is trying to say, and could eventually just give up. It's unfortunate, but its true. 

Below is an example of a magazine cover layout that illustrates a very poor use of contrast:

 
 
 
 

Scary, right? What if this was a flyer layout for your business or organization? The use of contrast in this layout is awful. Try to read all of the text and notice the harshness and strain on your eyes. Also, the text in the bottom left portion of the layout is so small that its hard to read, especially over such a bright yellow and red background. 

Our team wants to see your business and organization succeed, whether that's through design, print or web work. However, we also want to be able to offer advice and input on how to effectively communicate your brand's message. Whether you're a designer or a business owner, we hope that this blog post was able to shed some light on some of the big no-no's of contrast. 

What examples of poor contrast have you seen? Did we miss anything? Let us know in the comments below!