loading1
loading2
alt

Typography: The Anatomy of a Letter

category

Design Tips & Resources

author

osmanassem

The world of typography often seems like it has its very own language, full of serifs, strokes, and swashes.

Sorting out all those terms can be confusing in itself, so we’ve compiled a visual glossary that will guide you through the lingo — whether you’re an aspiring typeface designer or just a general typography enthusiast. Learning the building blocks of typography will help you better understand how to pick a suitable font and apply it effectively within your design projects.

Today we will go through some definitions and some basics of the typography including the anatomy of letters and the spacing of type and positioning.

Typefaces vs. Fonts: Difference?

A lot of people use the terms “typeface” and “font” interchangeably. But they’re two very distinct things. Before we get started talking about typography, let’s get our terms straight.

A typeface is a set of typographical symbols and characters. It’s the letters, numbers, and other characters that let us put words on paper (or screen). A font, on the other hand, is traditionally defined as a complete character set within a typeface, often of a particular size and style. Fonts are also specific computer files that contain all the characters and glyphs within a typeface.

The Foundation: Positioning & Spacing

Typography Definitions

Baseline: The imaginary line on which most letters and other characters sit.

Cap Line: The imaginary line that marks the upper boundary of capital letters and some lowercase letters’ ascenders (see Ascender definition in the next section).

X-height

The x-height isn’t exactly a part but rather a measurement. It measures the height of all lowercase letters that are part of the same typeface. It’s called x-height because the letter x of each typeface is what determines the measurement.

Cap Height

The cap height is a measurement of all capital letters in the same typeface. The most accurate measurement is found in flat bottomed characters like the letter E.

The Anatomy of Letters

Leg

A portion of a letter that extends downwards, attached at one end and free at the other.

Arm

A straight or curved portion of a letter that extends upwards or outwards, attached at one end and free at the other

Ear

The small stroke that extends outwards from a lowercase g in some typeface styles.

Shoulder

The stroke that curves downwards and to the right of the lowercase h, m and n.

Spine

The spine is the main curved stroke inside the upper and lower case S.

Tail

The decorative curved descender of a capital Q, R and K. The descenders of the lower case g, j, p, q, and y are also sometimes called tails.

Ascenders

An ascender is a vertical stroke that extends upwards over the x-height.

Descenders

A descender is a vertical stroke that extends downwards below the x-height.

Stem

The stem is the main vertical stroke in upright characters. When a letter has no verticals like a capital A or V, the first diagonal stroke is considered the stem.

Stroke

A stroke is the main vertical diagonal line in a letter.

Bar

A bar is a horizontal stroke in letters like A, H, e and f.

Serif

A serif is a short line at the beginning and the end of strokes. Serifs are what make a typeface a serif or a sans serif. Serifs can have different shapes: hairline, square/slab, wedge. They can all be bracketed or unbracketed, meaning that their connection to the stroke is rounded or perpendicular.

Terminal

When a letter doesn’t have a serif, the end of the stroke is called a terminal.

Bowl

A bowl is a stroke that creates an enclosed curved space, as in the letters d, b, o, D and B.

Counter

The counter is the enclosed space in letters like o, b, d, and a. Counters are also created by bowls.

Link

A link is a stroke connecting the bowl and loop of a two-story lowercase g.

Swash

A swash is a fancy or decorative replacement to a terminal or serif in any capital letter used at the beginning of a sentence. Swashes are also used at the end of letters to decorate the composition. Calligraphy is full of swashes of all kinds; at the beginning, at the end and even in the middle, extending from ascenders.

Spur

A spur is a small projection that veers off the main stroke on many capital G’s

Resources:

http://www.canva.com

http:// visme.co

Leave a comment