Screen-reading considerations

How does screen reading affect typographic choices?

Less and less.

Over the last 30 years, the quin­tes­sen­tial prob­lem of dig­i­tal ty­pog­ra­phy has been how to make fonts look good not only on high-end pub­lish­ing equip­ment, but also coarser de­vices like laser print­ers and per­sonal-com­puter screens.

These days, the hard­ware dif­fer­ences be­tween these de­vices have largely dis­ap­peared. Thus, with screens be­com­ing more pa­per-like than ever, there’s de­clin­ing need to make spe­cial ac­com­mo­da­tions for screen reading.

Whether it’s dis­played on screen or printed, the com­puter draws a dig­i­tal let­ter­form the same way: by scal­ing a glyph shape to a cer­tain size and ac­ti­vat­ing the pix­els that are in­side the shape. Thus, the qual­ity of ren­dered dig­i­tal type de­pends on two fac­tors: 

  1. The num­ber of pix­els avail­able (known as res­o­lu­tion, usu­ally mea­sured in dots per inch)

  2. The num­ber of col­ors each pixel can dis­play (known as color depth, mea­sured in pos­si­ble col­ors per pixel).

But more pix­els aren’t al­ways bet­ter. At the high end, all read­ing is con­strained by the phys­i­ol­ogy of the hu­man eye. The eye’s limit of per­ceiv­able de­tail is usu­ally es­ti­mated to be 1–2 ar­cmin­utes. (An arc­min­ute is 1/60th of an an­gu­lar de­gree in the field of vi­sion.) There­fore, pix­els smaller than one arc­min­ute are su­per­flu­ous, be­cause we can’t re­solve dif­fer­ences that small.

Be­cause this limit is an an­gu­lar mea­sure, per­ceiv­able de­tail varies in di­rect pro­por­tion to read­ing dis­tance. For in­stance, my desk­top mon­i­tor is about 24″ away, which means I can see about 143 dots per inch. But on a tablet or phone held at 12″, I can see twice that, or 286 dots per inch (which be­comes four times as many pix­els per unit of area).

For the first 20 years of dig­i­tal ty­pog­ra­phy, com­puter screens barely im­proved. They were stuck—yuck—in the range of 75 dots per inch. Dur­ing that time, com­pa­nies like Ap­ple, Mi­crosoft, and Adobe de­vel­oped tech­nolo­gies that were meant to make dig­i­tal fonts look bet­ter on screen. Dur­ing the desk­top-pub­lish­ing era of the late ’80s, the big jump was from bitmap fonts (which only look good at one cer­tain size) to out­line fonts (which can be scaled to any size). Still, screen ty­pog­ra­phy was mostly an afterthought.

The project of im­prov­ing screen type be­came more ur­gent with the ad­vent of the web. Some of the best-known fonts emerg­ing from these ef­forts were Mi­crosoft’s Ver­dana, Geor­gia, and Cal­ibri, all of which were heav­ily op­ti­mized for screen read­ing. At the turn of this cen­tury, it was true that cer­tain fonts looked bet­ter on screen, and oth­ers looked bet­ter in print. These fonts be­came the start­ing point for those de­sign­ing on­screen typography.

But since 2010, screen hard­ware has been mak­ing up for lost time. High-res­o­lu­tion screens first emerged in smart­phones, then spread to tablets, lap­tops, and now desk­tops. For in­stance, my smart­phone dis­play has a res­o­lu­tion of 326 dots per inch, and my desk­top mon­i­tors have a res­o­lu­tion of 185 dots per inch, both of which ex­ceed the lim­its of hu­man vi­sion. (By the way, if you haven’t up­graded to a 4K desk­top mon­i­tor, it’s well worth it. See the in­fi­nite-pixel screen.)

For font choice, it means you should use what­ever font you’d pre­fer on the printed page. Those tra­di­tional “screen-op­ti­mized fonts” of the ’90s were op­ti­mized for screens of what we will soon con­sider a more prim­i­tive era. Fonts like Geor­gia and Cal­ibri have no spe­cial leg­i­bil­ity ben­e­fit on to­day’s screens. (Like all sys­tem fonts, they still have the ben­e­fit of be­ing in­stalled on nearly every com­puter, how­ever, so they’re still use­ful for shar­ing draft doc­u­ments with colleagues.)

As for page lay­out, most screens are smaller in height and width than the tra­di­tional 8.5″ × 11″ printed page. So if you’re cer­tain that a doc­u­ment will only be read on screen, it could make sense to shrink the page mar­gins and raise the point size to ad­just for this dif­fer­ence. But if a doc­u­ment could also be printed—most down­load­able PDFs would fall into this cat­e­gory—then it’s best to stick with a print-op­ti­mized layout.

by the way
  • The de­fin­i­tive ar­ti­cle on this sub­ject is Beat Stamm’s Raster Tragedy, which has been up­dated steadily since its orig­i­nal re­lease in 1997. Per­fect for those still in the hunt for their ul­ti­mate font-nerd badge.

undock move Heliotrope Equity Valkyrie Century Supra Concourse Triplicate buy font close