Graphic design is a burgeoning industry. With the rise and ubiquity of the Internet in the last decade, web design especially has become prevalent. Other forms of graphic design include print, mobile, illustration, and typography. Typography refers to any design involving the arrangement of letters or alphabetical symbols in a space. Every design geek has taken a course in typography and knows the vast importance of it, yet basic type-crimes (errors or faux-pas in typography design) can still be seen virtually everywhere. While many are quick to dismiss the rules of graphic design, Ron L. Peters in his book Do Good Design emphasizes just how important good design is in our society: “Design creates culture. Culture shapes values. Values determine the future. Design is therefore responsible for the world our children will live in.” Practicing good design is of utmost importance, and good typography is crucial to good design as a whole. This list takes a look at 10 commonly occurring type-crimes:
(Note: to clear up further confusion, a “font” is a specific weight or style such as Arial 16 Bold, whereas “typeface” refers to the broader, all-encompassing Arial).
(stretched type, compressed type, etc.)
In essence, a good font should be left alone. It can be made bigger or smaller to accommodate the space it occupies, but it should always retain its original ratio. It should not be stretched, compressed, skewed, or any other applicable distortion. As a rule of thumb, if the font looks pixelated, something is wrong. The program Adobe Illustrator is better than Photoshop in this way, because it uses Vectors as opposed to pixels — so your type should never look pixelated in Illustrator. Overall, type is supposed to look crisp and harmonious, not tweaked into oblivion.
Too Many Signals
Signals such as: bold, underline, all caps, oblique, and italics are all uniquely different ways to add emphasis to type. Italic type for example is reminiscent of the strokes in calligraphy, and it has a cursive form as well as a Roman influence (named italic in part because it was developed in Italy). Originally, it was often used to help people save money, as it required less space. When the typewriter came out, underline largely replaced italics. Oblique is by some accounts a type-crime in and of itself; it is simply slanted type and not the actual cursive, true italic form. Signals should only be used when appropriate, and should not be overdone.
Orphans & Widows
One of the most common type-crimes; designers will cringe upon hearing these words. The terms are often used interchangeably, although they are not the same: an orphan is a lone word at the end of a paragraph, and a widow is a word or part of a sentence that ends at the bottom of a paragraph and carries over onto the top of the next paragraph. They are considered type-crimes because they create unaesthetic gaps in text and make it more difficult for the reader.
“Dummy” Quotes & Hanging Quotes
There is a difference between hatch marks and quotation marks. Hatch marks are used to denote feet and inches, and often surface in math (indicative of equal length for triangles in geometry). Hatch marks should not be used in lieu of Quotation marks. Quotation marks should also hang outside of the text. In a clean design, the Quotation marks remain outside.
Incorrect Use of Hyphens
Technically more of a grammatical error, yet just as applicable to design as it is to grammar. Hyphens are used to hyphenate compound words, to break words, and between non-continuing numbers such as phone numbers. En dashes are used to connect continuing or inclusive numbers, example: time and dates, page numbers, and so forth. Em dashes are used to denote a sudden break in thought that causes the end of a word. They enclose words or phrases and create strong breaks in the structure of sentences. Interesting note: the “en dash” received its name for being the length of a standard sized letter “n,” and likewise the em dash with the letter “m.”
Poorly Justified Type
Designers will be familiar with the term “river,” which is what happens when type is poorly justified — large unsightly gaps will appear throughout the paragraph — the end result looking like several rivers of white space are flowing throughout the text. These often appear in newspapers.
A good designer can always find a way to make a paragraph look relatively straight and crisp at the edges. If a paragraph has lines sticking out and the margins are uneven (most margins are flushed left, meaning the rags would be sticking out to the right), it can be distracting and unsightly.
Poor Kerning, Tracking, & Leading
Kerning refers to the amount of space between letters in a word. A word may look untidy due to too much space between some letters, or not enough. Tracking is essentially kerning but applied to the entire sentence, paragraph, or body of text, and not just certain letters within the word. “Leading,” (from the literal lead bars that used to be in the press) refers to adjusting the space vertically between lines of text. Any design program worth its money will have simple commands to increase or decrease the kerning, tracking, and leading of words and sentences. (In most Adobe programs you simply highlight a word and press alt + the arrow keys).
Embossing & Drop Shadows
There is great debate about the drop shadow. It is said that when a certain New York Times magazine printed their headline with drop shadow, hundreds of designers called in the following day to the extent that the NY Times had to disconnect their phone temporarily. While it is a way to draw emphasis to type, many are unsatisfied with its unnatural, gimmicky feel. Similar to #10 on the list, embossing and drop shadows are text effects that are best left omitted.
Potentially a controversial item on the list, there are several typefaces that are widely believed by designers to be rubbish and never to be used. Examples include Comic Sans, Papyrus, Jokerman, and Hobo. Even the ubiquitous Times New Roman is frowned upon by many designers who believe it is best kept to its original purpose: newspapers. Many of these typefaces such as Papyrus (famously used in James Cameron’s Avatar) have drawn a lot of scrutiny for being misused and overused. One font in particular known for its overuse is Helvetica. So prevalent in fact is the overuse of Helvetica, that in 2007 a documentary film came out about it. It is a great film and the author of this list highly recommends you see it!
Getting your typography correct is not an easy thing to do. Like graphic design as a whole, is has to be both aesthetically pleasing and functional.
Just like you do in a logo, when you’re working with big blocks of text in a print or web design, you have to put a lot of thought into how the type is working.
We’ve assembled 13 crimes against type you need to avoid. It’s not an exhaustive list — there are other things that can trip you up as well (oh, the difficulties of being a designer), but it’s a good place to start.
An example of creative management for a lot of text, by Atelier Martino&Jaña for the European Capital of Culture.
1. Start off with the right fonts
Yes, this one is subjective. There’s always going to be a debate over the usability of fonts between designers and clients alike. But there are fonts that are popularly liked and those that are popularly disliked.
Comic Sans is almost always disdained, and Helvetica is so frequently a top choice, that it’s overused in popular culture.
When making your design put thought into the font you choose. Do a little research! Is your font unprofessional, illegible or overused? Try something else.
2. Be selective with the typefaces you use in your projects
There are SO MANY font faces out there. Why not use a bunch of them all in the same piece? It’ll mix things up. Ha — just don’t do it.
You only need 2 or 3 — one for the title (maybe subtitle), and one for the body. As my high school math teacher used to say, “Keep it Simple, Skippy.” Simplicity looks and reads better than chaos.
3. Pair your fonts with thought
There are typefaces meant for titles, and typefaces meant for body. Don’t mix them up!
Typically, the way to go for the title is a bolder typeface, generally a sans-serif, but sometimes a decorative one. For the body — serifed fonts are created to look and read better in large bodies of text.
4. Pay attention to hierarchy
If you’re laying out different segments of text in a design, think about how these bodies of text are going to relate to one another. There has to be a hierarchy — a clear title, potentially a subtitle and a body. You can achieve this by the right font choice as well as sizing and choosing the right signals (bold, italics, underline, etc.)
5. Trust your typographer
Fonts are created with love and joy, and it takes a lot of work to make them work. Don’t mess with a typeface to try to get it to fit into a certain space. It ruins all the hard work the type designer did.
If you need to, change the font or typeface (aka use Futura instead, or Helvetica Condensed if you need to), but don’t stretch it out with your computer.
6. Kern, track and lead
3 important type concepts: kerning is the space between specific letters in a word. Tracking is the degree of space between all letters and words in a paragraph. Leading is the space between lines in a paragraph.
You’ve should get them all right to make your text work, and while typing the words gives you a good start, these 3 elements might not be built into the type as it’s rendered in your graphics software. You may have to do some edits to make them work better.
7. Keep your signals simple
A signal — such as bold, italic, underline, all caps, etc. is used to emphasize important segments of text. You don’t want to confuse your readers by mixing up or using too many signals. Keep it simple and choose one. Maybe 2.
8. Colors are your friends
Color can make or break your text. There has to be a high level of contrast between the text and the background so your design is readable. Who can read black text against a dark blue background, or yellow text against a white background? No one.
9. Choose your quotes carefully
There are multiple kinds of quotes out there. Smart quotes are for — you guessed it — quotes. They’re the little 6′s and 9′s that you see on the left. Dumb quotes are for expressing height. Such as, I am 5’6″ — straight up and down.
10. Don’t double space at the beginning of a sentence
Many of us learned to use double spaces at the start of a sentence. We were wrong. Just one will do.
11. Only justify if you need to
Aligning the body of your text can be hard, for sure. But you can’t depend on justifying text to make everything look neat and tidy. If done poorly, it creates what are called “rivers” of white space — those lines you see running down the middle of the text.
If this is happening with your justified text, it’s better to align it to the left and keep your rag (see definition below) clean.
12. Keep your rags clean
Rag is what you get when you’re not justifying the text — it’s the way the more ragged side of each paragraph looks. You don’t want this to be a big mess, you want it to be neat and tidy. It keeps the design looking clean.
13. Stay away from orphans!
The word beans highlighted in red is an orphan, or a word left alone in a line at the end of a paragraph. Don’t leave orphans hanging around. Find a way to bring that word back into the paragraph.
14. And widows.
The same goes with widows, or a single line from a paragraph that carries over to a new column. It’s not pretty to see the leftovers of a sentence or paragraph standing all by themselves, so make sure they stay with the rest of the family.
The most important thing to remember here is: rules were made to be broken! Learn these rules thoroughly and follow them most of the time. But when you have it down, feel free to experiment.