Ready to kick off your UX design career? Announcing the new and improved UX Academy. Learn more here — next cohort starts May 15th!

View all articles

Why Memorizing Pangrams Will Up Your Typography Game

This is Part 2 of a 3-part series on building your typography skills:

Choosing the “right” font for your design determines how well your designs are perceived.

The title of this article should actually be “How To Choose The Right Typeface For Your Design” because the choice you’re making is about typeface and not font. Let’s not get bogged down by the minor details just yet though.

First, let’s talk about shoes and how they relate to typography. 

The shoes a person wears leave an impression.

A man can wear beaten, faded jeans, an old, faded shirt, and have unkempt hair. But if his shoes are clean and polished, people notice. 

He is perceived positively wearing these shoes:

These are Allen Edmonds shoes, they exude style. (Photo credit: Lithic Goods)
These are Allen Edmonds shoes, they exude style. (Photo credit: Lithic Goods)

He’d be perceived negatively wearing these shoes:

Sometimes you just need to replace your shoes. (Photo Credit: Pink Gazelle)
Sometimes you just need to replace your shoes. (Photo Credit: Pink Gazelle)

If you don’t believe shoes matter this much, then ask other people what they notice when they first meet someone. 

An expensive suit with old dirty dress shoes creates a bad first impression.

Oh no he didn't wear those. (Photo Credit: The Comforts)

How does this boil down to talking about fonts and typefaces? Your font and typefaces can be the shoes of your design. 

Even if typography itself is only 10% of your overall design, it can still have a major impact on how the design is perceived overall. 

Let’s dig a little deeper into fonts and typefaces. Remember, a font is a specific size and style of a typeface. 

(In the previous article about typography terms, we reviewed typographic terminology and we mentioned that one example of a typeface is Helvetica... The font itself would then be Helvetica italic 10-point.)

It follows then that the first part of choosing the right font starts with choosing the right typeface. 

We’ll cover how to use something called a Pangram to help you choose the right font later in this article. 

4 Ways To Choose The Right Typeface


1. Use Safe Typefaces 


Every designer has some amazingly outlandish typefaces that they use for special occasions. However, 95% of the time you are designing, you’ll use safe and clean typefaces. These safe typefaces are akin to the shoes you wear everyday. 

It’s better for a typeface to be clear and legible, rather than so unreadable that it’s distracting from the overall communication goals of the design. If someone has to spend an extra 4 seconds to understand what have written, then they will disregard your design.

Garish Monde is difficult to read. (Photo Credit: Downloadatoz)
The right slide is very easy to read. (Image Credit: FSCONS)

Here are some safe sans-serif typefaces you might start with: Arial, Impact, Lucida Grande, Tahoma, Verdana, and Helvetica.

Here are some safe serif typefaces to start with: Georgia, Palatino, and Times New Roman.

These fonts are likely available to you and will display on the web with little to no issues (they’re what are known as “web safe fonts”). 

2. Know 5 Families Of Type

(Photo Credit: Smashing Magazine)

These five classifications of different typefaces are the 20% that are used in 80% of today writing and content. 

This is not a comprehensive list of all the available typeface classifications, but it is sure to get you moving toward picking the right typeface. 

A. GEOMETRIC SANS


Geometric Sans is a combination of three different groups (Geometric, Realist, and Grotesk), but there is enough commonality between them to group these as one group for this example.

This type family of sans serif typefaces are based on strict geometric forms. The letters are often uniform in width and focus on a “less is more” aesthetic in their design. 

Geometric typefaces are often classified as clear, objective, modern, and universal. On the flipside, they can be said to be cold, impersonal, and boring. 

Examples of Geometric/Realist/Grotesk Sans: Helvetica, Univers, Futura, Avant Garde, Akzidenz Grotesk, Franklin Gothic, Gotham.

B. HUMANIST SANS


Humanist Sans typefaces are more clean and modern and derived from handwriting. 

These typefaces are designed to be as simple as possible, involving thinner and thinner stroke weights similar to our handwriting. 

They are often classified as modern yet human, clear yet empathetic. 

Examples of Humanist Sans: Gill Sans, Frutiger, Myriad, Optima, Verdana.

C. OLD STYLE


Old Style

Known as the “oldest typefaces”, Old Style is marked by little contrast between thick and thin, and curved letter forms tend to tilt to the left. 

These typefaces are often classified as classic, traditional, and readable. 

Examples of Old Style: Jenson, Bembo, Palatino, and Garamond, 

D. TRANSITIONAL AND MODERN


Created in the mid 18th century and late 18th century, Traditional and Modern typefaces emerged as an experiment in making letterforms more geometric, sharp, and virtuosic. 

Transitional and modern faces are often classified as strong, stylish, and dynamic. They are also said to be too conspicuous and baroque to be classic, and too stodgy to be truly modern.

Examples of transitional typefaces: Times New Roman, Baskerville.
Examples of Modern serifs: Bodoni, Didot.

E. SLAB SERIFS


Slab Serif have become more popular in recent years. They have a stroke similar to those of sans faces but with solid rectangular shoes stuck on the end. Slab Serifs are unusual in the world of typography; designer Dan Mayer says: “Slab Serifs are an outlier in the sense that they convey very specific — and yet often quite contradictory — associations: sometimes the thinker, sometimes the tough guy; sometimes the bully, sometimes the nerd; sometimes the urban sophisticate, sometimes the cowboy.”

Slab Serif can be known as urban or rural, generally standing out in the wrong surroundings but fitting right in in the right places. 

Examples of Slab Serifs: Clarendon, Rockwell, Courier, Lubalin Graph, Archer.

3. When Selecting Two Fonts, Use Decisive Contrast

Much of the time one typeface is all you will need to use in your designs. However, there are certain occasions where you’ll want to use multiple typefaces to make parts of your design stand out. 

When you choose to use multiple typefaces, make sure the typefaces you’re using have large contrasting differences. 


Now, we’re not saying any two typefaces can work well together, but there are some that work quite nicely in tandem.

There is a good rule of thumb at work here that you can use in your designs. If the two typefaces have one thing in common but are otherwise vastly different, this helps determine if the two might look elegant when paired together:

  • If the two have a similar x-height or stroke weight
  • If the two are from the same period of time
  • If the two are by the same designer

Take a look at typography techniques here and Type Genius to dig further into combining fonts. 

4. Use “Wild” Typefaces Sparingly

(Image Credit: Purdue OWL)

Let’s go back to the analogy of how your shoes and clothes clothes pair well together. If we have a wild belt - one that has quite a bit of personality - it does more for the outfit than wearing an entire outfit of bright pink.

Let’s dive even deeper — an amazing belt buckle on a well dressed suit can create subtle contrast.

If the suit is too wild, this can create a polarizing negative impression:


The same can be said for typefaces like on a Thai Menu:

All wild typeface.

Wild typeface mixed with neutral typeface. 

The little bit of wild typeface in title and headers of the bottom menu fits right in with the cleaner, more neutral, readable font in the body. 

5. Bonus Rule For Choosing Fonts: ‘There Are No Rules’

These 4 principles are guidelines to help you pick the right typeface. 

As you build your own skills in selecting typefaces, you’ll develop your own rules about choosing type. There are no “wrong” or “right answers” as many would like you to believe. 

It’s up to you to determine how you want the viewer to feel when they look at your designs. 

This is how typography invisibly enhances your design — the choices you make can reduce friction and even bring delight to your designs. 

How to choose typefaces 

Have you ever heard of a pangram? You’ve probably memorized the most familiar one, “A quick brown fox jumps over the lazy dog,” without even knowing it! A pangram is a sentence that contains every letter of the English alphabet at least once.

Why are pangrams important for learning typography?

(Image Credit: CreativePro)

If you were designing your own typeface, a pangram helps you show off how your typeface displays differently than others and how all of the letterforms work together.

When you’re choosing a font for your designs, you need to take the entire typeface into account. Seeing all of the letters in the alphabet arranged in different combinations will help you evaluate and select the best typeface for your project.

Usually, one pangram will give you enough information to make a typeface selection. But, you might want to try multiple pangrams before you make your final decision. You might also work on pairing fonts by using different pangrams to help compare and contrast.

Here’s are list of our favorites: 

  • Crazy Fredericka bought many very exquisite opal jewels. (48 letters)
  • Amazingly few discotheques provide jukeboxes. (40 letters)
  • The quick brown fox jumps over a lazy dog. (33 letters)
  • Pack my box with five dozen liquor jugs. (32 letters)
  • The five boxing wizards jump quickly. (31 letters)
  • How vexingly quick daft zebras jump. (30 letters)

Examples credited to RinkWorks

You can also use Google Fonts to test many different fonts at once.

Experiment with size, bold, and italics and see which font variation works for your eyes. 

Applying the 5 principles you learned in this article with pangrams will help you make better choices.

With this document you’ll always have a shortcut to help you choose and pair typefaces!

What are some of your favorite typeface choices? Tell us if they are sans serif or serif.

Improve Your Designs Invisibly Though Typography

Learn step-by-step how and when to use typography to enhance your design along side a mentor. You'll build 7 projects you can proudly display in your portfolio.

Click here to learn more about our NEW Typography course

 

(Images Credit 6-14,18: Smashing Magazine, Photo 14 Credit: Tettrabyte & Abuxto2)

 

About Designlab

Designlab teaches you UI/UX design skills through online courses with 1-on-1 mentorship from expert designers.

Get Updates

Be the first to read our new articles on UI/UX design education, career development, and more!

Got it! We'll keep you in the loop.

Get the syllabus & take a tour