Designing for the Non-Designer: Part III Designing with Type

Designing for the Non-Designer: Part III Designing with Type
http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/digg_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/reddit_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/dzone_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/stumbleupon_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/delicious_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/blogmarks_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/newsvine_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/google_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/myspace_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/facebook_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/yahoobuzz_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/sphinn_16.png http://www.nurelm.com/themanual/wp-content/plugins/sociofluid/images/twitter_16.png

This post  is for those who get thrown into graphic design without any formal knowledge of what makes a good design, or,  what causes unforgettable disasters.  Once able to recognize the basics of designing principles you will be more in control of your work and marketing materials.  This can range from printed articles to website design. This three-part series will help you understand basic design principles, tips and tricks,  typography,  and how each can help you.

Type

Type is the basic building block of any piece, and often one of the most compelling features of design on a page. The major question is how do you know which typefaces work effectively together? There are typically three types of relationships between typefaces: concordant, conflicting, or contrasting.

Concordant – is the relationship between typefaces where you use only one type family without much variety in size, style, weight, etc. This gives the piece a subtle, more formal feel.

Conflicting – this relationship occurs when you have two similar typefaces in weight, size, etc. The similarities are there but the visual attraction is quite different, therefore they conflict with one another.

Contrasting – in this relationship you combine two unlikely and separate looking typefaces and elements that are distinct from one another.  By choosing visually appealing typefaces, you already have a lot of contrast built in. When paired with another typeface that contrast is emphasized.

Even though most designers typically wing type combinations, you can recognize the problem quicker and fix the problem faster when you are able to name the problem.

Categories of Type

While there are thousands of types available in this day and age, most typefaces can be dropped into one of six categories. Knowing each of the categories will help you in deciding what typefaces works well with another, and so on.typecat

Oldstyle – Based upon the hand letter of scribes, Oldstyle always has serifs,including on lowercase letters. Imagine writing with a wedge-tipped pen, therefore giving the letters a slanted angle ending. There is also a thick/thin transition where the stroke of letter has a slight variation. Oldstyle has a diagonal stress (which means you a draw a line through the thinnest parts of the curved strokes). Typically if you are going to have a lot of text that needs read you’ll want to choose an Oldstyle because of it’s easy of readability.

Modern – These typefaces have serifs but are a horizontal lines instead of the penmanship slant of Oldstyle. The serifs are very thin, causing a radical contrast between the thick/thin strokes and giving a perfectly vertical stress. Giving a cold and elegant look, modern fonts give a striking appearance but are not good for large amounts of body copy.

Slab serif - Slab serif has very slight thick/thin transitions if any at all. Slab serif fonts are usually very heavy in visual weight but can be used in an extensive amount of text because of their easy readability. These fonts are often used for children’s books because of their clean, easy and  straightforward look.

Sans serif- “Sans”  means “without” in French, and “sans serif” means “typefaces without the serif endings on the letters.” These typefaces are typically “monoweight,” meaning they are the same thickness all the way around. Alternatively, there are a few sans serif fonts that do have a slight thick/thin transition. Use caution with these fonts because of their similarities between classic Oldstyle fonts. Sans serif fonts have a lot of versatility and can be very helpful with all their font weight options (ex. thin, extra thin, bold, extra bold, heavy, black, etc.)

Script – This typeface is any that tends to look like it’s been handwritten whether via calligraphy pen, brush, or pencil. Scripts are fonts that should be used sparingly, and never in all caps or large blocks of text.  However, Scripts are a font that can look striking when placed in large text.

Decorative – One of the easiest types of font to recognize. Because each of these fonts are so distinctive, their use is rather limited, although anytime you want to make a bold statement or have something stand out, a decorative font is a good choice. When using a decorative font, try to go beyond what your first impression is and see if you can make something new come out of it.

The Contrasts of Type

Going beyond aesthetic appeal, type  enhances the communication of a specific piece. The reader should have a clear concept of organization, purpose, and flow of information.  All of which should be recognizable at a single glance.

Size – A contrast in size can make a big impact, so don’t be afraid.  If you contrast too little, people can think it is a mistake and not what you’re trying to convey, so make it obvious.  Alternatively, you don’t have to make the type large to have a contrast in size. You can have a small line of type on a large page, which still creates contrast.

Weight – Weight refers to the thickness of strokes. Most type families have a variety of different weights. Don’t go for the regular type with the semi-bold counterpart, use the extra bold or black version.  By efficiently using weight, you can visually organize the information on the page (via headings, sub headings, etc.). If you lack the room to put graphics or other visual elements in an otherwise drab and boring newsletter, bold the key phrases or headings.

Structure – Structure refers to how a letter is built.  One major rule to remember is to never put two typefaces from the same category together on the same page.  An easy rule of thumb would be to choose a serif font and a sans serif font until you get the hang of the different type categories.

Form – The shape of the letters is referred to as form. One of the easiest ways to think about it is lower case letters versus capital letters. An example would the form of a “G” capitalized and lower case, some fonts have the letter form the same for both capital and lower case (just slightly smaller).

Direction – The obvious choice for direction would be to type from a slant, but another interpretation of direction would be how the type is set on a page horizontal for straight across and vertical direction for when you use columns.

Color – Color has obvious interpretations as well. When choosing a color to include in your piece, knowing the meanings of colors is helpful.  Warm colors are forward whereas cool colors recede.  Also just having black text is still considered a “color” and is considered the most sophisticated of them all.

Combining the Contrasts

All in all, don’t be wimp, the most effective layouts take advantage of contrast. For good inspiration, leaf through a magazine and check out the articles and advertisements. Verbalize what you see, if you can name the dynamics and relati0nships you have power over them. Before trying a better solution identify the problem. Go ahead, experiment!

What now?

If you’re still confused or need help please don’t hesitate to call Liz at NuRelm 724.430.0490! Or email Liz at liz@nurelm.com.

About the Author

Author Profile: