Down the font legibility rabbit hole

While working on a recent project I was struggling with optimizing the readability of the content in the interface. The product is a safety-critical interface used in aviation with lots of codes in small sizes. Good readability is crucial to make sure the users can do their job well and with as little fatigue as possible.

The White Rabbit →
SF Mono

Legibility ≠ readability

Typographic clarity comes in two flavors: legibility and readability. Legibility is a function of typeface design. It’s an informal measure of how easy it is to distinguish one letter from another in a particular typeface. Readability, on the other hand, is dependent upon how the typeface is used. Readability is about typography. It is a gauge of how easily words, phrases and blocks of copy can be read. (It’s About Legibility →

San Francisco’s High-Legibility Alternates →
The top line of characters are a square grotesque design (Eurostile) and the bottom line a humanist design (Frutiger) highlighting various characteristics thought to improve legibility. (Graphic courtesy of Steve Matteson of Monotype Imaging.) →

«Humanist genre typefaces are considered to be more legible because:

- Open space inside the letterforms prevent blurring their shapes

- Ample space between the letterforms prevent them from clashing or blurring together

- Highly distinguishable shapes to prevent ‘at a glance’ ambiguity

- Varied horizontal proportions to add distinguishing characteristics.»

Monotype & AgeLab Develop Streamlined Method for Testing Typeface Legibility →

Ariall the things

The proof of the pudding

Overview of different fonts with sample text →
Codepen for SF Pro High-legibility alternates
Typography window in Pages
A tool to test the legibility of different fonts for typical aviation data like flight numbers, aircraft types and gate numbers →



Strategist at In The Pocket

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store