Basic design principle – Contrast

Today’s post will be the first in a series on four basic principals of good design. I call these the “Basic Principles” because they are the foundation of how all good designs should look. These four foundational principles are: Contrast, Repetition, Alignment, and Proximity. Although I will be talking about each principle separately, keep in mind that each are interconnected, and no single one holds more weight than the others.

First, I must caution you… You are about learn something.

For today, I will only tackle the principle of Contrast. Contrast is one of the most powerful ways to add visual appeal to your design. If your page is striking, a reader will want to look at it longer.



Creating contrast is simple, all you have to do is make two elements look different. The rule to contrast states that if two items on a page are not exactly the same, then make them different. Really different! We are all accustomed to using Bold, Italics, and Underlining to make elements of our page stand out. I’m going to show you how to kick it up a notch!

First, have a look at the two résumés below. The one on the left is fairly typical of all the résumés I’ve seen. The information is there, and if someone really wants to read it, then they will. But nothing is grabbing my attention. The one on the right, however, is more attractive. You don’t have to read the text to know how its organized and where all the visual cues are. This is the power of having striking contrast with the elements on a page.


Next, Look at the example below. Perhaps you have seen some ads like the one? When I see this, the first question I ask is, “what is my eye drawn to?” This design has poor contrast because all the elements have similar size, weight, and importance. Visually, your eyes have nothing to focus on because everything is competing for your attention, and nothing is winning.


Now, look at this example. I decided to focus my attention on what is most important – the name and phone number. I made these elements the largest and boldest; everything else is drastically smaller. This gives good contrast and draws your eyes into the design. Once the reader is pulled into a focal point, they will read the smaller print.


A final way to add interest through contrast is to use the technique of Reverse Type. Instead of the usual Black-on-White lettering, reverse type means putting light letters on a dark background. In keeping with my previous design. I will add some punch to the heading of my ad by reversing out the type. *Note: Do NOT use this on every element you want to stand out. Use reverse type for the most important areas ONLY.


Contrast is the most fun of the deign principles because it is so dramatic. Remember, the idea is to avoid making elements on the page appear merely similar. Be DRAMATIC with your contrast. A few simple changes can yield eye-catching results.

In my next post, I will teach you about alignment and how placement can connect all the elements on your page.
That’s all for today. You be good!
--Ben
qwf5yns3tz