Typography is one of the most important elements of graphic design. In this article, we'll take a look at typographic terms that will help you get started in the world of design.
Typographic terms are innumerable, and some you might never have heard of before. Some of these terms can also be widely confused and misused. In this A to Z of Typography, I've gathered some terms that are essential for every designer to know. These terms are important to use when typesetting a text. Book typesetting and digital typesetting have some similarities and differences, but it all depends on the anatomy of a typeface.
Each term is shown in a different font that can be found in Envato Elements. There, you can find awesome fonts, print templates, photography, and other assets that can help you kick your projects up a notch.
Watch A to Z of Typography: Tips, Tricks, and Hacks!
Strapped for time? Do you prefer videos over written tutorials? Don't worry. You can watch this complete video where you'll learn the A to Z of typography. If you enjoyed this video and you'd like to watch more, don't forget to visit and subscribe to the Envato Tuts+ YouTube channel!
What Will You Learn?
In this article, you'll learn:
- Basic typographic definitions that will help you establish yourself as a knowledgeable designer.
- Some advanced typographic expressions that will help you communicate with other designers.
- Typographic tips and tricks that can help you further your typographic knowledge.
A is for Ascender
The ascender is any part of a lowercase letter that extends above the meanline of a font—for example, the letters b, d, and h. Ascenders help make characters recognizable from one another.
B is for Baseline
The baseline is the line upon which the letters in a font appear to rest. The line below is the descender. Capital letters sit on the baseline, with the exception of Q and J that can sometimes extend just below it.
C is for Cap-Height
The cap-height is the measurement from the baseline to the top of the flat uppercase letters, for example M and I. Some capital letters are drawn with an overshoot to appear optically equal to the rest of the characters.
D is for Descender
Descenders are the vertical strokes below the baseline in a character—for example, g, j, p, and q. The length of the descenders in a font can affect the readability between the lines of text. If the descenders are too long, they can touch the next line of text. In this case, more leading space needs to be added. Leading type is the process of adding space to lines of text, and this space can vary depending on the ascenders and descenders.
E is for Ear
An ear is a finishing stroke, usually on the upper right side of the bowl of the lowercase of a two-storey g. The ear will sometimes have a teardrop shape or a decorative flourish that matches the font style.
F is for Foot
The foot is the part of a stem that rests on the baseline. It is typically found in serif style fonts.
G is for Gadzook
A gadzook is usually found in a ligature, the result of the combination of two characters. It's the connecting piece that attaches these two characters together without it being originally part of either.
H is for Hook
The hook is a curved stroke in the head of some lowercase letters like f and r. The hook will appear to have a curve that leads into a terminal teardrop or sharp end to a character.
I is for Italic
Italic is a slightly slanted type style that takes its basic shapes from a stylized form of calligraphic handwriting. Italics are often used to emphasize text and can appear more elegant in serif fonts. Sans serif italics are usually only slanted and maintain the same base shape. Some characters in serif italics will change from double-storey to single-storey, as in the case of the "a" character below.
J is for Joint
The joint is the spot where a stroke joins a stem to become one.
K is for Kerning
Wondering what kerning is? It's the process of adjusting the space between two characters. Kerning in typography is often used to correct spacing problems in a combination of letters, especially slanted strokes. In a design application, you can adjust the kerning manually or by selecting the optical option. Optical kerning consists of pre-kerned letters created by the font designer.
L is for Ligature
A ligature is a special character that's the result of a combination of two individual characters. Some letters can bump into each other when printed (for example, fi, fl), and ligatures allow them to flow better together. Sometimes, we can find three-character ligatures—for example, ffl and ffi.
M is for Midline
The midline is an imaginary line that rests on top of the body of lowercase letters and above the baseline. The distance between the baseline and the midline is called x-height because the letter x will occupy that space.
N is for Neck
The neck, also known as the link, is the small curved stroke connecting the upper bowl with the lower loop in the double-storey lowercase g.
O is for Overshoot
An overshoot is a small extension of a character that goes over the cap line or below the baseline. An overshoot helps characters optically appear the same size as other characters that have flat tops or bottoms. For instance, the lowercase e will go above and below the lines compared to the lowercase x. The same also applies to the uppercase O and X.
P is for Proportional
Proportional characters are designed to occupy only as much wide space as needed. Non-proportional fonts use the same set width—also known as monospace. When a character is proportional, it becomes more legible.
R is for Roman
Roman type is the standard style we see when reading long-form body copy. Sometimes, Roman is also used to refer to the regular weight in a font.
S is for Single-Storey
A single-storey character appears in lowercase a and g. In some styles, these two characters can have a single counter, as opposed to their double-storey type, which has two counters.
T is for Terminal
A terminal is the end of any stroke that doesn't include a serif—for instance, Q or t. A teardrop terminal refers to the terminals on letters like r and f.
U is for Uppercase
Uppercase letters are the capitals in a typeface. The name comes from the days of metal type, when capital letters were kept in the upper part of the type case.
V is for Vertex
The vertex is the pointy shape that results from an intersection of two strokes at the bottom or top of a character—for example, A, v, V, w, W.
W is for Width
The width in typographic design is the space occupied by a single character, including the spaces on the left and right. Depending on the software, this space is measured in millimetres or in points.
X is for X-Height
The x-height is the space between the baseline and the midline—the letter x will often occupy this specific height. Some characters will have an overshoot over the midline to appear optically even with the rest of the characters. A typeface with a large x-height tends to be more legible.
That's It!
It's important to learn and master typographic terms to help us make better typographic choices. In this article, I showed you some essential terms that are important to learn so that you can communicate in the correct design language. Once you've mastered these terms, I encourage you to take a look at some of our other articles from the Envato Blog and Envato Tuts+ that can help you expand your knowledge even more!
How to Make a Font: 10+ Typography and Font Tutorials for Beginners
A to Z of Sketch: Tips & Tricks!
A to Z of After Effects: Tips, Tricks, & Hacks
A to Z of InDesign: Tips, Tricks, & Hacks!
A to Z of Illustrator: Tips, Tricks, & Hacks!
A to Z of Affinity Publisher: Tips, Tricks, and Hacks
The Ultimate Guide to Basic Typography
A Brief History of Type
What Are Variable Fonts?
