2. Principle of Contrast
If two items are not exactly the same,
then make them different. Really
different.
3. Key Points
• Contrast draws your attention
• Make elements very different
For contrast to be effective, it must be
strong. Don’t be a wimp.
4. How is Contrast Created?
• It’s created when two elements are
different
• NOTE:
– If two elements are sort of different, but
not really, you don’t have contrast, you
have conflict!
5. Creating Contrast
• Contrast large type with small type
• Thin line with a thick line
• A cool color with a warm color
• Smooth texture with a rough texture
• Horizontal element with a vertical element
• Widely spaced lines with closely packed
lines
• Small graphic with a large graphic
6. Main Purpose
• Create an interest on the page
• Aid in the organization of information
7.
8.
9.
10.
11.
12.
13.
14.
15. What to avoid:
• Avoid making slight differences
– Sort-of-heavy line with a sort-of-heavier line
• Brown text with black text
• Two or more typefaces that are similar
REMEMBER: IF THEY’RE
NOT EXACTLY THE SAME,
MAKE THEM DIFFERENT!
Notes de l'éditeur
Do not contrast 12 pt font with 14 pt font, dark brown with black, or ½ pt rule with 1 pt rule
Contrast is crucial to the organization of information. I should be able to glance at the document and pick out the key points and understand what it’s about.
This is a fairly typical resume. I’ve seen several professionals use this format and I’m sure for some companies it’s fine. It’s functional. But it doesn’t grab my attention. I have to look for key information. Can you pick out the job titles on this resume? Do they stand out from the body text? Let’s look at an improved version.
Things we’ve corrected:
Alignment is predominantly flush left.
Headlines are stronger and stand out.
Job titles stand out now
Lines add to the visual appearance
Phone book advertisement. Everything is basically the same weight from the border to the graphics to the title to the details.
Nothing entirely stands out.
Decide what should be the focus and then make it stand out. Use caps, bold. Larger font, etc. to make that piece of information stand out the most.
Don’t be afraid to make some things smaller. Once the reader is drawn in to the focal point, they’ll read the rest. One may suggest that this doesn’t as accurately reflect the personality of the owner. That may be. But consider what the purpose of this ad is. It’s to draw potential customers who want to spend money. This design provides a more professional, secure feeling. Since this is a phone book advertisement, it makes sense to have the phone number so large.
It’s the simple things that can make a difference. Some of you have been working on this ad, and others a similar one. Now consider a few minor changes.
Which of these two is more likely to get your attention? We haven’t really changed all that much! The headline is now in initial caps which makes room to put it on one line. The same font is used for “Be a cowboy!” to create repetition. The leadins are larger to draw more attention (and they’re consistent in size)
Also we’ve made the graphic much larger and turned it into a watermark so he doesn’t conflict with the text.
Ok, here we’ve got a web home page. It’s got nice lines and a clean appearance. BUT, we can improve this.
All we did was add a black text box and increased the size of our image. Remember, it doesn’t have to be white on black, it could be navy blue on pale blue, so long as they are on complete opposite ends of the spectrum…no similar.
