typography Typography Explained: A Quick Guide to Font Terminology font terms fi

Typography is a major part of modern graphic design, but most font terminology comes from the 15th century! Use our quick guide of typeface terms as your cheat sheet to typography.

Font vs. typeface

What is the difference between font and typeface? It’s the most common question in typography. To understand the difference between the terms, you have to remember some typing history. When early printers laid out a page of text, they used individual lead blocks, called “sorts,” for each letter, which they called “glyphs.” The blocks were held together by a frame, coated in ink, and imprinted on a page like a stamp.

A font was the collection of blocks—capital letters, lowercase letters, punctuation marks, etc. in a given size. The font was the literal mechanism of printing a letter or what you have to own to imprint letters. This is still the case today. In modern terms, a font is a computer file. A font is not the shape of the letters you see on the screen. Technically, Helvetica and Times New Roman are not fonts. The file you install on your computer to use Helvetica, typically a .TTF or .OTF format, is the real font.

Typeface has always meant the printed letter itself. Think of the type of face on the lead block. A typeface is what you can see on a screen or a page. Chances are when you ask, “What font is that?” you’re wondering the name of the letter shapes not what file type is installed on a computer, so 99.9% of the time you say “font” you really mean “typeface.” Arial, Century Gothic, Calibri, and Wingdings are all typefaces, but you must install the font file to use them.

Font—the file you install to access certain letter shapes
Typeface—the letters you see on the screen or page

typography Typography Explained: A Quick Guide to Font Terminology font terms 1

Serif vs. sans serif vs. script

Serif, sans serif, and script describe design details in a typeface. Serif typefaces have little embellishments at the end of each stroke. Times, Garamond, and Baskerville are serif typefaces. Though there are thousands of exceptions, serifs are generally considered more formal or old fashioned.

Sans serif simply means without serif. The term is often shortened to just “sans.” The text you’re reading on this screen is a sans serif typeface. The terminals, or ends of each stroke, do not have a little slab or stroke. The terminals may be angled or rounded and sans serif type can still have a lot of personality. Helvetica, Arial, Avenir, and Century Gothic are all sans serif types.

Script typefaces are cursive or flowy types where the letters connect to each other. These typefaces are easy to distinguish from serif and sans serif.

Serif—embellished letter terminals
Sans serif—without embellishments
Script—cursive style

typography Typography Explained: A Quick Guide to Font Terminology font terms 2

Leading, tracking, and kerning

Leading simply means vertical line spacing. Think of those early printers using moveable type and how much lead or metal they added to space the lines. This is more than single- or double-spacing a Word document. It’s the amount of breathing room between stacked lines of texts. Graphic designers customize leading to the specific text. Microsoft Word defaults to 120% of the font size. So if you’re typing in 10-point the default leading is 12 points.

Tracking is the uniform horizontal space between characters. Even though every letter shape results in different visual space between letters, your program will automatically space letters a certain number of pixels apart. Word’s default tracking should work for most written documents, but you can change it too “tight” or “loose” if needed.

Kerning is custom horizontal letter spacing. I’ve watched designers spend obscene amounts of time moving letters a pixel at a time to find the perfect balance. It seems crazy, but in the end the design always looks so much better. Think of letters like W and A. The angled sides can create big visual gaps between letters. Designers kern letters until the visual space is balanced. This time-consuming task is generally reserved for titles and headlines. No one is kerning entire magazine articles.

Leading—vertical line space
Tracking—universal letter spacing
Kerning—custom letter spacing

typography Typography Explained: A Quick Guide to Font Terminology font terms 3

Character terminology

In typography, a character is an individual letter, punctuation mark, or symbol. Of course, there’s a bundle of jargon related to the anatomy of characters. Here are a few of the most common and useful terms.

Stroke refers to the lines and curves of the characters. Some typefaces have uniform stroke weight, meaning each part of the letter is the same width. Calligraphy styles have varied stroke weight, with some parts of the letters very thin and other parts much thicker.

X-height is exactly what is sounds like, the height of a lowercase “x” in a given typeface. This sounds silly, but it’s a useful way to describe the differences in typefaces. The x-height is often the level of the cross stroke on a “t” or “f” and a capital “E.” These are details designed into the typeface, not factors you can adjust like kerning.

Ligatures are pre-set ways to connect letters that often appear together. Professionally made fonts will often include ligatures for common combos like “ff,” “fi” and “th.”

typography Typography Explained: A Quick Guide to Font Terminology font terms 4

Typography questions answered:

How do I install new fonts on my computer?

Read our step-by-step guide on how to install fonts on Mac and Windows computers.

How do I choose the right type for my project?

Choosing the right typeface is a huge part of a designer’s craft. The only universal answer we can give is that you should pick a font you can use legally—just because you can download a font from the internet doesn’t mean you’re allowed to use it! Here are some more common mistakes to avoid when choosing a typeface.

Where can I find more detailed typography terminology?

If you’re looking for more than we’ve included in our quick guide, check out this glossary by Font Shop.

What are the parts of a font called?

If you need to know the technical name for a particular stroke, check out Anatomy of a Character by Fonts.com.

What is typography in design? What is the role of typography?

Typography is the handling of type including headlines, body copy, words, symbols. Graphic designers combine typography with other design elements like pattern and color to create their work. Typography is just as important in web design and digital marketing as in print.

What is a normal font called?

Professional fonts come in font families made up of different font weights. Regular or book is the common name for the most used weight. Typical font weights include bold and italic. Extensive font families may include light, narrow/condensed, black, and combinations like bold italic and narrow light.

We’d love to explain more about typography. Post your font questions in the comments!

Leave a Reply