The importance of typography

Home » The importance of typography

Typography is the voice of the written word, it can be loud or silent, strong or delicate, and be as beautiful as it can be vulgar.  

It serves the purpose of adding to a design, while also ensuring the words are legible, readable and visually appealing to the reader. Typography is what sets apart good design from great design – bad typography can ruin even the best project. Taking the time to learn about typographical elements can help elevate your project and bring your design to the forefront of your audience’s attention. 

The terminology ‘typeface’ and ‘font’ are commonly assumed to be synonymous, but in fact they refer to different aspects of typography. A typeface is the style of the characters, such as: Bodoni or Helvetica. Whereas the font is the different variations within that typeface such as: Helvetic Light, Regular or Bold. The best way to imagine this is that the typeface is the family, as a collective, while the font is the individuals that make up that family.   

There are five basic classifications of fonts: serif, sans serif, script, monospaced and display. Serif and Sans Serif can be used in both body copy and display type whereas, scripts and display fonts should only be used in headings. Monospaced is generally used for displaying code and originates from use in typewriters. Different typefaces will vary in how suitable they are for copy and headings. Choosing the right one is important for legibility, readability and the overall look and feel of your design.  

Proportional fonts use the appropriate amounts of white space between each character to create optically spaced kerning. While Monospaced typefaces use a fixed amount of white space. Proportional fonts are more commonly used as they are the most aesthetically pleasing and readable, but when being used in dynamic labels (with animated characters) we run into an issue. For example, your stopwatch on your phone will use monospaced digits to prevent a horizontal wobble. If the stopwatch used proportional spaced digits, then the reader would lose focus because the digits would be moving rapidly side to side as each number changes. There are pros and cons to both proportional and monospaced fonts, choosing the right one for your situation could be critical.

Anatomy of type describes the visual elements that make up the typeface’s letterforms. Typefaces are created using these components which contribute to their appearance and legibility. Some of these elements include: 

Ascender: An upward vertical stroke that extends beyond the x-height 

Baseline: The invisible line on which all letters rest 

Bowl: The generally round or elliptical forms which are the basic body shape of letters 

Cap height: The distance from the baseline to the top of the capital letter 

Counter: The white space enclosed by a letterform 

Cross bar: The horizontal stroke in letters 

Descender: A downward vertical stroke that extends beyond the baseline 

Ear: A finishing stroke usually on the upper right side of the bowl, typically found on the lower case ‘g’ 

Link: The small, usually curved, connecting stroke between the upper bowl and lower loop in the double-storey ‘g’ 

Loop: The enclosed or partially enclosed extenders on cursive ‘p’, ‘b’, ‘l’, ‘g’ and similar letters 

Serif: A stroke added to the beginning or end of one of the main strokes of a letter. 

Spur: A small projection off a main stroke 

Tittle: Is a small dot on a lowercase ‘i’ or ‘j’ 

X-height: The distance between the baseline and the height of the lowercase letter ‘x’.

When considering typography, we must consider inclusive design for accessibility. This includes the target audience, people with various disabilities, users from different cultures, and users outside of your focus demographic. Understanding the needs of a variety of individuals is the key to ensuring legibility is never compromised and assuring no one is excluded.  

“Good accessible design happens when you view your design from many different perspectives, or lenses.” – The Art of Game Design: A Book of Lenses 

Something else to consider when designing with accessibility in mind is contrasting colours. This keeps the type legible and aids in the accessibility for colour blind and visually impaired users. However, we can’t rely on colours alone to give visual cues. Elevate your design by using other elements that highlight your intent such as underlines, icons and arrows which all act as additional tools to assist your audience.  

Legibility is a function of typeface design, and the designer will have to make important decisions regarding the typography to achieve legibility and accessibility, some of these include: 

• Using generous leading and line spacing 
• Steering clear of justified text
• Avoiding italics 
• Using generous kerning in the type 
• Applying larger text size 
• Considering Sans Serif typefaces for legibility 
• Using concise and clear writing
• Offering plenty of colour contrast.  

All of this is important, as accessible design is about expanding your customer base and ensuring you reach the maximum number of people to ensure limited exclusion of users.  

“Typography is known as an invisible art, because if a typographer has done a good job and produced a page that flows and is ‘easy on the eye’, he has done his job and the reader doesn’t notice”– Jim Williams 

Before the invention of the printing press by Johannes Gutenberg in the mid 15th century, books were written by hand. Johannes was a goldsmith and so was able to create letter blocks which could be used repeatedly. Arranging the letters for each page could often take a whole day, but it meant the page could be printed as many times as needed. His letterforms were based on the Blackletter Calligraphy that originated from handwritten manuscripts. The problem was that the amount of type that could fit on a page was extremely limited. Blackletter typefaces were the standard for printing in the mid 15th century, this was because they mirrored the handwriting style of the time.  

Digital type has taken away all the physical limitations of the traditional printing press. The speed and ease of execution mean that we now have huge capabilities along with the fact it is freely accessible to the masses give us infinite possibilities to do things that would have been impossible in hot metal type. Nevertheless, we mustn’t forget the fundamentals of typography and always keep in mind, legibility, readability, accessibility and the purpose of our creations.  

If your project needs a professional design eye, contact us today to work with our exceptional team of designers.