The Typographic Basics Everyone Should Know

Typographic Basics

I was reading an article the other day that defined a lot of pretty basic things about type. These are things that I learned my freshmen year in college, and I’m sure many other design majors did, too. Unfortunately, it hasn’t reached many outside of our designer bubble. The basics that I’ll be posting about today are handy terms when you are dealing with type a lot—even if you aren’t a designer. I’ll also give a couple of keyboard shortcuts to some symbols that you should be familiar with.

  1. Typeface and Font

    A lot of people confuse the terms Typeface and Font. The typeface is the overall design style of a family of fonts. Font, however, is the specific weights within the typeface. For instance, I like the typeface Raleway. Raleway has many different fonts within itself—regular, medium, bold, black, etc. People who don’t know this won’t be the targets of memes in the design community, but it is best to know the difference. And if you slip up every now and then, it’s all right because many designers do, too. (Psst. Get Sagona demo and Akrobat demo for free!)Typeface versus Font Graphic

  2. Kerning, Tracking, and Leading

    The three most influential pieces of a typographic design—kerning, tracking, and leading. Kerning is the individual spacing between two letters. When working with some Adobe programs, you can change it from metrics to optical to achieve decent kerning. You can also kern it all manually.

    Tracking is the overall spacing within a group of letters (AKA a word). If you don’t want to do each individual letter, set the tracking and you can get every space the same.  I personally like to kern myself, but tracking normally does a good job.

    Leading is the spacing between baselines of text. Fun fact: it is called leading because printers used to set type by hand, and would use large bars of lead to separate lines of text. All Adobe programs give you the ability to edit these yourself, and as far as I know Microsoft Word does as well, although probably harder to find.

    Kerning, Tracking, Leading graphic

  3. Hyphen, En Dash, and Em Dash

    Most people don’t even really know that these three exist, much less their differences. The hyphen or dash is the shortest one and is used to hyphenate words. You see it at the end of a line of when a word is separated onto two lines, as well.

    The en dash is between periods of time or numbers, and is the medium-sized dash. Examples would be saying “read pages 20–30 for homework” or “I will be there December 2–10.”  The en dash even has a handy keyboard shortcut—just hold alt and type in 0150 on the number pad to the right. Mac users need to hold option and the hyphen button to get your en dash.

    Em dash is the longest dash of them all and is used for phrases. You’ll see them when a character may be stuttering or just in certain phrasing. I used it when mentioning the keyboard shortcut for en dash above. The keyboard shortcut is 0151 instead of the previous, and then for Mac press shift between option and the dash button.

    Different Dashes Compared


Typeface, leading, en dash—these words hopefully will stick with you as you go about your typing today and the future. There’s a lot to understand, even when you’re just someone who types away monotonously. Don’t be fooled and study up on things to improve your skill set and keep your brain growing. Check out the typography cheat sheet that has a lot of shortcuts to other type items that weren’t mentioned in this post. What do you think about these basics? Are there any that you would add to the list? Let me know in the comments below!