A Beginners Guide to Typography: What You Need to Know

    August 05 2020

    Typefaces vs. Font

    The first distinction to make is between typefaces and fonts. A lot of people use these terms interchangeably, but they aren’t actually the same thing. Typefaces are a family of related fonts, while fonts refer to the weights, widths, and styles that make up a typeface. For example, Helvetica Light, Helvetica Condensed,  are all fonts that exist in the Helvetica typeface.

    PLANOLY - Blog Post - Typography 101 - Image 1

    Baseline, Median, and Cap Height

    The baseline, median, and cap height are all invisible guidelines that help determine the visual placement and height of typefaces. The baseline defines the visible base of the letterforms of a typeface, or where the letterforms start. 

    The median defines the height x-height of letterforms. The x-height refers to the height of all lowercase letters and is defined by the distance between the baseline and the top of a lowercase ‘x,’ hence the name. 

    The cap height defines the height of capital letterforms above the baseline.

    PLANOLY - Blog Post - Typography 101 - Image 2

    Ascenders vs. Descenders

    Ascenders are the part of a letterform that projects above the median or x-height. Letters like h, b, d, and t, all have ascenders in their lowercase forms. Ascender height is the imaginary line that all ascenders fall under.

    Descenders are the longest part of a letterform that descend below the baseline. Letters like y, g, q, and p, all have descenders in their lowercase form. Descender height is measured by the distance from the baseline to the descender. 

    PLANOLY - Blog Post - Typography 101 - Image 3-1

    Serif vs. Sans-Serif

    ‘Serif’ and ‘Sans-serif’ are two common variations of typefaces. Serif typefaces, also called Roman typefaces, include “serifs.” A serif is an extension at the end of a  letter stroke. Serifs are meant to mimic pen marks, help to lead the eye from letter to letter, and are thus believed to improve readability. For this reason, Serif typefaces are commonly used for body text and printed materials—books, newspapers, magazines, etc. Sans-serif refers to typefaces without serifs at the end of letter strokes. Serif typefaces also tend to look more ornamental and communicate trustworthiness or professionalism.

    San-serif typefaces do not include serifs and instead are recognizable by the simple, often even-width lines they are composed of.  In French, “sans” means “without,” so just think,  “without serifs,” to remember this! Sans-serif typefaces tend to be perceived as modern, approachable, and clean. It is also believed that they render more clearly in digital formats, making them more legible. For this reason, Sans-serif typefaces are commonly used by tech companies and on the web. Keep in mind; there are always exceptions to any rule—these are just some helpful guidelines.


    Tracking refers to the horizontal spacing between text. When adjusting tracking, the spacing is adjusted for all characters and done uniformly—so all of the characters have an even and exact space between them. Tracking is sometimes adjusted to help text better fit a space (tightened) or help legibility (loosened).

    PLANOLY - Blog Post - Typography 101 - Image 4 (1)


    Kerning is the process of adjusting the space between two characters. Unlike tracking, which is uniform and applied to the text as a whole, kerning adjusts the space between just two characters to make their pairing more balanced and compatible.  All character pairings are not alike, and sometimes kerning is required to make a pair work better together and become more legible.

    PLANOLY - Blog Post - Typography 101 - Image 5


    Leading refers to the vertical spacing between lines of text.  In the early days of manual typesetting using metal forms, strips of lead were placed between lines to separate them—hence the name “leading”! Leading is important because it helps with the legibility of large bodies of text. The smaller the space between lines, the more “narrow” leading is; the greater the space between lines, the more “wide” the leading is.


    So there you have it! These terms are by no means an exhaustive list but should put you in a great place to understand the very basics of typography.

    Talk the Talk: 10 Graphic Design Terms Explained
    The 10 Essential Graphic Design File Types and How to Use Them


    Learn more about Rosee Qualls, on PLANOLY

    Rosee Qualls

    Rosee Qualls is a contributing designer at PLANOLY. She is an expert in branding, graphic design, and illustrations.

    More by Rosee Qualls

    blog side moduleV2

    Simplify Your Social Planning

    From idea to post - PLANOLY is your go-to planner for TikTok, Instagram, Facebook, Twitter & Pinterest.

    Share on Social

    You May Also Like