top of page

Whats Your Type? - Basics of Typography

  • Writer: Arun B
    Arun B
  • May 2, 2020
  • 3 min read

Typography is a very mysterious subject among designers because it’s often mi-understood or mis-interpreted. So lets try to shed some lights on it.


Many designers that I come across with, thinks that typography is about choosing which font(s) to use, what size(s) and what style (bold/italics/regular). But typography is actually a lot more than that.


In order to understand what typography really is, we will talk about few fundamental elements of typography and its applications.


Historically, if you look at the publishing industry, the first and foremost goal of typography was Readability. If choice of font makes the information on the page harder to read, it becomes irrelevant whether the choice of font(s) was pretty.


Font Categories & Styles:

Fonts have different categories. Some are strong, some are subtle and some are in between. Many experts divide these categories into two major groups: Serif and Sans Serif. However, with the advancement of technology and our works, the categories can be expanded to: • Serif • Sans Serif • Mono-Spaced • Display • Script • Text • Dingbats


Serif fonts are most widely used font for regular text (body copy). These fonts can be used as headline as well. These fonts are relatively easy to read and come in three sub-categories: Old-style, Modern and Square Serif.


Sans Serif fonts are more modern; usually have an overall even stroke weight, which creates little contrast for the letters. These fonts can create a more modern look and are suitable for small copy, large copy, sub-headings or headlines.


Other types of fonts mentioned in the above list, usually have specific purpose such as: decoration of a design, mimicking handwriting or give the design an old charm.


Mono-Spaced fonts are evenly spaced fonts while Dingbats are symbols that is used to decorate the text or page.


Apart from categories, fonts can have different styles; such as: Plain, Italic, Bold & Bold Italic.


Some fonts can have additional weights such as: Extra Light, Ultra Thin, Roman, Book, and Heavy etc. These gives the designers even greater variations and choices to spice up their designs.


Measure:

Now let’s talk about Measure. The Measure is the name given to the width of a body of type. There are several units of measurement used for defining the Measure’s width. The basic units are: • One point = 1/72 of an inch

  • One pica = 12 points

  • One em = The distance horizontally equal to the type size, in points, you are using. Eg. 1em of 12pt type is 12pt.

  • Millimeters

  • Pixels


Deciding what size to use can be easier with an understanding of the things that affect readability. The most crucial factor is the x-height of the lowercase letters and their relationship to the uppercase and ascender letters. The relationship between the uppercase/ascender letters and the x-height depends solely on the design of the font. Fonts with a large x-height, or “tall” lower case characters, are easier to read than fonts with small x-height characters.


Character & Word Spacing:

There is an optimum width for a Measure and that is defined by the amount of characters are in the line. A general good rule of thumb is 2-3 alphabets in length, or 52-78 characters (including spaces).


Kerning:

Inter-character spacing, known as kerning, creates a more pleasing look to the text. Most word processors do not allow kerning adjustments and most page-layout programs apply kerning automatically; however, certain letter combinations may require manual adjustments. Some of these letter combinations include most low- ercase letters, and uppercase letters: F, I, K, L, O, P, Q, T, V, W, X, and Y. Kerning also is required when using all uppercase letter combinations such as VA and WA.


Tracking:

The adjustment of word spacing is called Tracking. It is similar to kerning but refers to the adjustment of a selection of characters, words, and spaces. Its main purpose is to make type fit a required space without altering the type size or line spacing. Tracking can be either negative, making the words closer together; or positive, making the words farther apart. An important use for tracking is to fix single words (or 2–3 short words) at the end of a paragraph (sometimes called orphans or danglers). Although not always avoidable, the problem usually can be solved with some minor tracking. Of course, this should be done only after all editing is complete.


There are many other elements such as: Paragraph spacing & alignment, Indents & Tabs, Line breaks, Drop caps, Raised caps, Bullets, Box, Quotes, Line breaks, Hyphens & Dashes etc. But these elements are known to most of all and can be a topic of discussion on another day. For now, enjoy with types.

Comments


ABOUT THE AUTHOR

Arun is a prominent UX expert with 22+ years into this field. Arun have spent most of his professional career working with several World renowned Financial Institutions, Advertising Agencies and Technology companies and was responsible for award winning digital transformation projects, websites and mobile applications.

He also frequently acts as mentor for several Startups and Financial Technology companies.

 

This blog is Arun's latest initiative to provide important insights to the User Experience community. 

SUBSCRIBE 

Never miss an important post. Subscribe to my mailing list and you will be notified and much more. 

Thanks for subscribing!

© 2020 by The UX Lab

bottom of page