The Ideal Line Height; Wezterm’s CLI Font Introspection; Font Drop: Geist
The first section is a bit of a wonkish dive into optimizing font line height/width for a given text+context. It’s paired with a neat utility for spelunking fonts on your system, and closed out with a pair of new free typefaces and a deep dive into what geometric fonts are.
TL;DR
This is an AI-generated summary of today’s Drop.
The Ideal Line Height: This section discusses the importance of optimal line height and width for readability, user experience, and accessibility. It explains how line height, also known as leading, and line width, also known as measure, directly impact the readability of the text. The ideal line length for reading text on desktop devices is around 60 to 80 characters with a line height of around 1.5 to 1.6. The section also highlights the importance of accessible design for people with sight impairments. The primary resource for this section is The Good Line Height.
Wezterm CLI Feature: This section introduces a feature of the CLI portion of Wezterm, a terminal emulator. The feature, wezterm ls-fonts, provides information about which font files it will use for different text styles and can list all of the fonts on the system. It can also display the shaping plan for a given text string and show an ASCII art rendition of that text.
Font Drop: Geist: This section presents Geist, a new font family created by Vercel in collaboration with Basement Studio. Geist comes in both monospace and sans-serif flavors, and its design process focused on glyph simplicity and legibility. The section also provides a brief history of geometric typefaces, which Geist is an example of. The primary resources for this section are Geist and its GitHub page.
The Ideal Line Height
A recent “Design” edition of TL;DR featured The Good Line Height, a web tool for fiddling with both a font and various settings to come up with the optimal line height. It’s a neat resource, and all, but it does not go into “why”. So rude!
Figuring out the optimal line height (and width) for a given font and text is crucial for several reasons, primarily revolving around readability, user experience, and accessibility.
The line height, also known as leading, and line width, also known as measure, directly impact the readability of the text. If the line height is too tight, it could undermine horizontal eye movement and encourage scanning down the left edge. It could also force people to reread lines of text. Conversely, a line height that is too loose could make lines of text visually “float away” from each other, making vertical scanning more difficult.
Similarly, the line width plays a significant role in readability. Reading a long line of type can cause fatigue as the reader must move their head at the end of each line and search for the beginning of the next line. Too short a line breaks up words or phrases that are generally read as a unit. Studies have shown that longer text widths resulted in faster reading times over narrower text widths.
The optimal line length and height can also significantly enhance the user experience. For reading text on desktop devices, the ideal line length is around 60 to 80 characters with a line height of around 1.5 to 1.6. However, these values can vary depending on the typeface and the context in which the text is being displayed (one reason the tool mentioned at the beginning is cool).
The line length and height can also affect the aesthetic appeal of the text. A well-balanced line length and height can make the text look clean, open, and friendly, contributing to a positive user experience.
We can round out the discussion here (I have a resource for you in a second) with a bit about accessibility. People with sight impairments who use screen readers, for example, benefit from a line height of about 140%-180% for optimal readability and accessibility. As someone with aging eyes, accessible design — especially when it comes to text — is becoming increasingly important to me. If you want me to “see” your creations, you’re gonna have to go the extra mile to keep me on your site/paper/app.
These topics (and more) are covered in more depth over at Pimp My Type, which has numerous other articles that are worth the time, and that we’ll feature in upcoming Typography Tuesday editions.
Wezterm’s CLI Font Introspection
Short section to point to a neat feature of the CLI portion of Wezterm (the terminal emulator I use as my daily driver).
By default, wezterm ls-fonts will explain information about which font files it will use for the different text styles.
You can also ask it to including a listing of all of the fonts on the system in a form that can be copied and pasted into the configuration file (e.g., wezterm ls-fonts --list-system). This is super handy.
And, you can also display the shaping plan for a given text string; in this example, the a and the b are separated by a special symbol which is not present in the main font, so we expect to see a different font used for that glyph (e.g., wezterm ls-fonts --text "Daily Drop").
Finally, wezterm ls-fonts --text Drop --rasterize-ascii is a troubleshooting option to show an ASCII art rendition of that text. (There is another option but I don’t have cycles to talk about “codepoints”, so we’ll cover it in a different Typography Tuesday edition).
You can start poking here to get inspiration for making a standalone “system font lister” that could, say, output JSON.
Font Drop: Geist
Geist (GH) is a new font family created by Vercel in collaboration with Basement Studio. It comes in both monospace and sans-serif flavors, and the design process for it focused on glyph simplicity and legibility. While those are important characteristics for utility fonts, they are vital in a monospace context when coding or terminating.
The non-mono version of the font was is an inspired, modern, geometric typeface that is based on the principles of classic Swiss typography.
A geometric typeface is a genre of typography that is characterized by its construction based on geometric shapes such as perfect circles, clearly defined angles, and squares. This design approach results in a very structured character for each of the letters. Geometric fonts are almost always sans serifs, meaning they lack the small decorative strokes (serifs) at the end of larger strokes in a letter or symbol.
This class of typeface originated in Germany in the 1920s, with notable early designs by Herbert Bayer and Jakob Erbar. The geometric fonts gained popularity during this period due to their clean, modern design. They experienced renewed popularity in the 1970s, and are still used for current, trendy, and contemporary designs.
Common features of geometric typefaces include a nearly-circular capital ‘O’, sharp and pointed uppercase ‘N’ vertices, and a “single-storey” (I always cringe at how that word is spelled) lowercase letter ‘a’. The ‘M’ is often splayed and the capitals of varying width, following the classical model.
Geometric fonts are particularly well-suited to any design project in the industries of technology, computers, mobile applications, gaming, or science due to their high degree of legibility and clean design. They convey a message without it getting lost in unnecessary ornamentation. Geist itself was designed to be used in headlines, logos, posters, and other large display sizes. Some other/popular examples of geometric fonts include Gilroy, Ciruclar, Avenir, Futura, ITC Avant Garde Gothic, and ITC Kabel.
Geist Mono is a monospaced typeface that has been crafted to “be the perfect partner” to Geist Sans, and is well-suited for use in code editors, diagrams, terminals, and other text-based interfaces where code is represented.
You can download the latest release from the GH releases page and install the fonts on your system.
The Geist font family is free and open sourced under the SIL Open Font License.
I switched to it for the week from my daily driver (Comic Code Ligatures) and it’s going well-so far. RStudio dailies do not pick up the ligatures (it may be due to me using the variable font version of the typeface), but everything else does. I’ll report back on how it goes and whether I’ve kept it as a default anywhere.
FIN
I may swap out the current fonts I’m using across my sites for Geist. ☮️
hrbrmstr's Daily Drop 
Leave a comment