Legibility: Why it’s Important in Typography

What does legibility mean?  

In typography, the official definition of legibility relates to how easily words are to read on the page. Central to this is a glyph - or the shape of letterforms - and how they look. A legible font is one that users can absorb accurately and quickly, because of its size, shape and other physical properties within a graphic design.

In short, legibility means how easily people can identify and interpret symbols in a typeface. 

The importance of legibility in typography.    

When it comes to graphic design, legibility can make a world of difference. Choose a typeface with poor legibility and you may find your graphic design falls flat. Whether it’s a company logo, a promo flier or a sign conveying safety information, legibility creates impact.

Fail to create a legible product and you may find that people:

• Are left with a negative impression of your brand, as illegibility creates an unprofessional look. It might also feel inconsistent with the rest of your brand’s output.
• Do not absorb important information. In some cases, this can create significant safety or legal issues. Remember that readers often scan text, so they’ll only take in what’s immediately clear.
• Confuse key symbols, leading to mistakes. A zero and a capitalised ‘O’ may look similar, but they mean very different things. If your interface requires data input, poor legibility could create a headache.
• Can’t access your services. Accessibility matters. What’s legible to one person may be completely illegible to another. Design a website with red text on a green background and you’ll exclude the 4.5% of the population with colour blindness(1).

(1) - https://www.colourblindawareness.org/#:~:text=is%20Colour%20Blindness%3F-,What%20is%20colour%20blindness%3F,most%20of%20whom%20are%20male

Key elements of legibility for graphic design.   

There are a number of key elements to the legibility of a typeface, including:

• Spacing. A legible font is well-spaced, so users can easily view each easily view individual characters.
• Character width and weight. Bold or light fonts have varied legibility. In a too-narrow font, users may struggle to identify letters or recognise words. Particularly lowercase letters and new words. 
• Type Design features. Various design properties can affect legibility. Like letter shapes that appear slanted, fussy or quirky and tight line spacing may be less legible.
• Character differentiation. The most legible typefaces have clear differentiation between lookalike symbols such as ‘1’, ‘I’, ‘l’ and ‘!’ or ‘0’ and ‘O’.
• x-height. This measurement is based on how high the lowercase ‘x’ stands. Typefaces with taller x-height tend to be more legible.
• Stroke contrast. This is the ratio of thick to thin strokes. Too-thin strokes can affect legibility, especially in small sizes.
• Counters. These are the negative spaces inside the lettering. The smaller they are, the harder it can be to read the font.
• Serif. In general, serifs enhance legibility. But this isn’t always the case. With the right dimensions, sans serif fonts without decorative tapers can perform well too.
• Visibility. Many graphic designers believe transparency is the key to a highly legible font. The idea was made famous by marketing manager Beatrice Warde in 1930. Invisibility means the typeface should be so unremarkable that it becomes almost invisible. The result? Your words do the talking, not your font.

Readability vs legibility in typography: What’s the difference?

In typography, readability and legibility are synonyms, but are not exactly the same. A font needs to first be legible to be readable. But readability is a wider concept that relates to how the font is arranged - also known as the typeset.

Readability encompasses:

• Size. Readable fonts need to be big enough for readers to decipher letter shapes and words.
• Type case. All-capped copy tends to be difficult to read.
• Line spacing. A legible font can’t work its wonders from cramped lines. 1:4 is sometimes thought of as the ‘golden ratio’ for line spacing, but this will vary based on font and medium.
• Line length. The more words per line, the harder a user needs to work.
• Colour. This isn’t just the font colour, but the background colour too. On digital devices, it also brings in colour variation from light. Contrasting colours are more readable.
• Alignment. A legible typeface doesn’t work alone, it must be aligned properly on the page for optimal readability. Alignments can be to the left, right and centre. Left alignments are the most used globally and are standard in British and American English where reading is left-to right. Chinese however is read vertically (top to bottom, of course), then right to left, needing a centre or right alignment. Centre alignments can be useful for word lists and poster designs.

Legibility FAQS.

What are the five elements of legibility?

Five of the most important elements of legibility include:

• Character differentiation
• x-height
• Counters
• Stroke contrast
• Spacing.

Together, these determine it’s readability how easy it is for users to get meaning from a font.

What is a visual type scale?

A visual type scale is a set of pre-selected font sizes that allow for flexibility but keep the type consistently legible. For instance, a project’s type scale may include allocations for the heading (H1), various subheadings (H2, H3, H4, H5, H6), standard text, as well as smaller-than-usual text, for use in terms and conditions or disclaimers. 

What is font hierarchy?

Typographic hierarchy or font hierarchy, is a way to keep the text highly readable. It pulls out the important information using a more prominent typeface, creating a hierarchy of messaging. Large headlines, intermediate subheadings and bold introductions are all examples of font hierarchy.