Published by Creative Market
We’ll be honest with you, friends: having keen typographic instincts takes experience — but it’s not an impossible skill to hone. You shouldn’t despair if you’re new to the design discipline; even graphic designers are not born eagle-eyed typographic masters. It takes plenty of practice, a lot of learning by osmosis, and even your fair share of falling flat on your face. Full stop.
Whether you’re wrangling type in Microsoft Word or InDesign, we’re ready to shed some light on some common typography mistakes that might not even register to you as common mistakes in your design process.
Now, with design or other creative fields, folks are always preaching to you about rules. You can’t do this. You can’t do that. You can’t possibly use this typeface. Everybody just simmer down — all will be OK, we promise.
For instance, many of you know that double-spacing after a period is a typically unnecessary holdover from days of typewriters. But, sometimes you might want to emulate that for specific aesthetic reasons, right? That’s OK! Use that double space if you purposely meant to. The trouble with sweeping suggestions for typography is that type is involved in so many distinct specialties. Typesetting for a book may be lightyears away from using type in a logo design or web design. Thankfully, a handful of basic typographic tenets still apply to a myriad of use cases.
So enjoy these humble design tips, but remember that in the end you — the designer — make the judgment call. So if you deliberately want to break a rule or suggestion, go-forth and break it beautifully, with thoughtful intention!
Sneaky error 1: Limiting your font combinations
Some of the most common typographic hand-wringing comes when designers are warned not to use too many typefaces in their work. Stick to two or less!, they say.
Here’s the deal: some of the most interesting, visually-arresting design comes from smartly utilizing a multitude of typefaces simultaneously. To be fair, the other edge of that sword is that it definitely takes a keen eye to do this successfully—but it’s not an insurmountable hurdle. While we wouldn’t suggest utilizing, you know, the entire suite of Google Fonts in a single project, there’s no reason to limit your typographic projects to just two typefaces if you do so in a thoughtful, deliberate manner.
Among many aspects to consider, contrast, hierarchy, and the personality of your typeface choices will go a long way in determining whether using multiple typefaces simultaneously will produce successful results. Things like typographic classification—sans serif vs. serif vs. slab vs. script—or weight, contrast, and size all need to be fully considered if you want to juggle an expanded typographic palette in one project.
Make sure you provide enough visual contrast to make the different typefaces each mean something different.
Consider both similarities and differences in the typefaces you choose as assets. Some typefaces’ effect may be amplified when surrounded by designs of a similar DNA, while others—say big, bold, energetic display faces—might be overwhelming when placed amongst similar kin. It’s all about getting a feel for what plays together nicely. You have to experiment.
One of the easiest traps to fall into is using different typefaces that are just a bit too similar. Think Didot and Bodoni. Or Garamond and Sabon. If you’re using different fonts that are of a similar classification—or share similar characteristics in terms of letter shape construction or legibility—you could run into trouble, especially if these similar faces are used for similar elements in your project. Make sure you provide enough visual contrast to make the different typefaces each mean something different.
Sneaky error 2: Overlooking measure
Typographic measure is the length of a line of content within a block of text. When you’re typesetting content, you want to make sure you’ve selected a measure that’s not only pleasing to the eye, but also one that won’t fatigue your reader. In conjunction with the whitespace your line spacing affords, your text’s measure is one of the most important determiners of its overall readability.
If your measure is too short, your poor reader’s eye may quickly tire from ping-ponging line to line as they scan too-short snippets of text. Conversely, if your measure is too long your reader’s eye may get lost as they try to navigate a long string of text back to the next line.
A good place to start with testing your text’s measure is two alphabets worth of glyphs.
Finding a comfortable line length will depend on a myriad of variables. First and foremost, your typeface’s contrast, x-height, and width all come into play in determining the comfort it provides your reader. As a general rule of thumb, a good place to start with testing your text’s measure is two alphabets worth of glyphs (approximately 50 characters). You’ll have to get your hands dirty and finesse your typographic particulars—also keep in mind you’ll have to balance these functional aspects of your type choices with the overall aesthetic direction of your typesetting. Font size, page sizes, column sizes, and baseline grids all come into consideration as well.
While it can get a bit cerebral, taking the time to experiment with your type’s measure will contribute greatly to crafting thoughtful blocks of copy.
Sneaky error 3: Altering script letter spacing
Most designers can appreciate a good script typeface—they are flowing, expressive, and can range the gamut from downright elegant to explosively loud.
Well-designed connected scripts are typically constructed so that each constitute letterform seamlessly interacts with those beside it. Sometimes—and we’re not naming names—designers interrupt the lovely contiguous flow of script typefaces by altering tracking, or manually messing with the spacing between a string of script letters.
Most often, this will result in unsightly gaps, especially with lowercase script letters, which leads to a stilted visual appearance. It’s the typographic equivalent of having a chain, in which only a handful of links are welded closed: not very useful, aesthetically questionable, and perhaps even a danger to the end-user themselves.
Check your design app’s kerning settings so you don’t accidentally set your scripts askew.
To be fair, sometimes these disagreeable visuals are not a choice on the designer’s part — at least not an overt one. Some design apps offer optical adjustment for kerning—where the app itself overrides the carefully crafted spacing for letter pairs chosen by the font’s designer—with its own computational best guess. This too can lead to script typefaces getting jostled around and looking unsightly with unintended gaps or cramped overlapping.
The moral of the story here is to be very judicious with making spacing adjustments to connected script typefaces, and definitely make sure you check your design app’s kerning settings so you don’t accidentally set your scripts askew!
Sneaky error 4: Ignoring display glyph size & kerning
When you’ve got a big honking piece of type you’re working with, any kerning issues will be amplified at large-scale. What might look like a small adjustment between two letterforms at caption size will likely look like a mountain valley when you push them up to display sizes.
Knowing this, ofttimes you’ll want your typesetting to be a bit tighter for headlines, especially for those using capital letters — it’ll add a sense of drama or gravitas, and will also help minimize the more generous letter-spacing needed at smaller sizes.
Secondly, there are certain characters that can be toned down a bit once they’re employed at larger sizes. Think ampersands, currency signs, at symbols (@), percent signs, octothorps (those are hashtags for you young social media mavens out there). Don’t be afraid to drop them down by 10% or 20% right from the get-go if you know you’ll be setting them large. In fact, sometimes you can even get away with reducing their size a bit more dramatically, so experiment.
Again, the individual typeface and the weight you’re using will dictate any tweaks you make. Because symbols in this vein are so distinct, compared with the majority of your design’s other letterforms, a little can often go a long way, as they’re not fighting as much for your reader’s attention.
Sneaky error 5: Stretching your type
Unless you have a pre-conceived reason to do so, avoid artificially stretching your type at virtually all costs. Most typefaces are painstakingly designed with incredible precision paid to the interaction of each and every letterform’s stroke. Messing with a typeface’s natural proportions is akin to the effect a funhouse mirror has on a person—the end results may be goofy at best, but horribly disjointed and unpleasant at worst.
Now, maybe you inadvertently forgot to constrain proportions while you were resizing a text element, that happens. No judgment there. But horizontally or vertically stretching type simply to fill space is very rarely a fruitful exercise.
Avoid artificially stretching your type at virtually all costs.
To be transparent, sometimes typographers will artificially scale glyphs within blocks of body copy by a few percentage points to help achieve better spacing. But that’s almost imperceptible to the naked eye, and the end results are often worth slightly fudging the rules. For our suggestions here we’re talking about type that you know has been stretched artificially. We’re talking about type with letterforms so distorted it looks like they were rolled through a pasta maker.
Again, this warning doesn’t apply if that’s the aesthetic you’re specifically going for. However, if you’re simply needing your type to fit a certain space—make sure you source typefaces that come in a robust range of weights and widths. Many families come with varying extremes of both condensed and expanded widths to complement the regular incarnation of the typeface. Use these—in conjunction with the available gradations in weight—to help your type fit the space allotted.
Variable fonts are another emerging font technology that will help typographers more easily find the balance between beautiful blocks of type and the economy of space your medium affords.
Conclusion
Polished typography is no easy feat, but it’s one that can be enjoyed by paying attention to a few particulars. Again, take these modest design tips but remember that designers make the best decisions. Cultivate a good eye, question the defaults your design app wants to use, and always feel free to deliberately break a design rule, so long as you break it with intention.
This article was originally published by Ryan Arruda on Dribbble, the leading destination for creatives to share, grow, and get hired.
