Lost Among Europeans

<< Newer Confinement
Older >> Fonts for Writing

Reading on Screen

In the previous post I talked about choice of fonts for editing. What about for reading?

What makes for a good font choice? This is all personal, and I don’t mean to make taste the topic of this post.

Once you’ve chosen a font, there are several factors that go into the experience of reading it on screen.

First and foremost is size. For some reason, most people set their fonts too small. Try this: write a half-page of text set in 11pt font, say Georgia, in your word processor. Print it, and compare the printed text with the text on screen (both at your regular reading distance). Get them to align, applying zoom as necessary in your word processor.

Then there are typographical considerations. A very quick summary can be found in Matthew Butterick’s very useful site [1]. There’s a lot of design knowledge there to help readers, and it’s often ignored by websites, but also by people for their own use. Setting proper line spacing does wonders for your reading experience.

There are techier parts to consider. You’re reading text rendered in a monitor, likely an LCD screen. And that is quite different from reading on a page.
Computer operating systems use some tricks [2] to make up for the low resolution of most LCD screens. Each operating system does it its own way, and in addition has its own view of monitor calibration and color science.
Then there’s your monitor to consider, its quality and settings.

So, how does one navigate all this? It becomes necessary to do some experimentation. One day we may have better-than-paper screens, but for now, you need to test how well a font renders on your system.

Two fonts stand out when it comes to screen rendering: Verdana and Georgia. These were commissioned by Microsoft, and were designed by Matthew Carter, an eminent font designer. They rendered very well on the low-resolution screens of the early web days, and became ubiquitous. They’re likely available on your machine.
General screen resolution has increased a bit in recent years, and Georgia and Verdana are no longer indispensable, but I think they both should be in your shortlist of fonts for personal use.

Something that affects all glowing screens: avoid pure-white backgrounds and pure-black text.
For one thing, the printed page does not offer pure black ink on pure white paper. The contrast between black and white on screen is greater than on paper. You could say there’s glare.

Many posts claim that reducing contrast a bit helps long term readability. I haven’t seen a good explanation for this, but in my perception, pure black-on-white rendering seems “noisy”, with slight artifacts on letterforms. As if they were drawn with a splotchy ball-point pen.

This page is written using 14% text on 98% background. (100% being pure white and 0% being pure black.)

To summarize, for your personal reading on screen:

  1. Pick fonts that render well on your system.
  2. Set a comfortable size.
  3. Follow some basic typographic rules. (see [1])
  4. Don’t use pure-black text on pure-white background.

Personally, I look for fonts that don’t call attention to themselves. As mentioned already, Verdana is a classic for a reason. Another great font designed by the same author is Charter. On Macs or Linux, Charter is probably installed already.
My favorite monospaced font is Consolas, which was also commissioned by Microsoft. It doesn’t come installed in Mac or Linux, but I like it so much I bought a license. The designer has another great monospaced font called TheSans Mono [6]. A good monospaced font installed on Macs is Menlo, and on Linux there’s likely DejaVu Mono. Both Menlo and DejaVu Mono are variations of Bistream Vera Mono, which is likely available on Linux and Macs.

It’s nice to have choice, and, also, if you plan to publish on a web page, or write documentation to be distributed publicly, font licensing terms become important.

There are now some high quality free-and-open fonts available:
Fira Sans [3], whose spacing and rhythm make it very readable, even at small sizes. Adobe’s Source family [4], of which I like the serifed font best. Fira and Source include a good set of weights, italics, and, wonderfully, small caps (see [1] about small caps.)
IBM created a family of open fonts, IBM Plex [5], which is also worth checking. This font family includes a monospaced font which is second only to Consolas, in my opinion.


1: Practical Typography

2: Font rendering on screen

3: Fira fonts

4: Source family fonts

5: IBM Plex fonts

6: TheSans Mono