Paper reading has been established for longer than 500 years. Respectively, designing for paper-reading has developed profound graphics and typographic comprehensions. The digital form of text is much younger, compared to the print, going about 30 years back to the 90s of the 20th century. When screen time increased, the way of reading has changed with it and reading on screens has become more and more common.

What are the precepts for designing readability on screen? There have been many types of research conducted regarding screen readability. A study(*) over the effects on fatigue and visual strain claims that it is not the technology itself, but rather the image quality that seems crucial for reading. Compared to the visual display units used in the previous few decades, the more recent electronic displays allow for good and comfortable reading, even for extended periods. We will address the subject of devices more on article 3.3. This chapter will focus on the design aspects of on-screen readability.

What is already clear now, is that we cannot merely adopt the typographical rules for printed, fixed layouts to the multiple sizes and changing features of digital platforms. In this chapter, we will review a few readability design practices used in print and their relevance in digital.

Typography as a Vessel.
Readability and typography are about “looking through the glass” and not “looking at the glass”. Beatrice Warde drew a visual example, in which she outlined how to drink a glass of good wine: You can choose between two wine glasses – a golden glass with beautiful decorations, or the most delicate cut clear glass blown into a sphere, where the edge of the glass is almost not perceptible when you drink the wine. The glass wine-glass puts the focus on an as pleasant as possible wine-drinking experience, and not on the design of the wearer. As with typography, aiming to get the text at the centre of interest. The environment disappears, and you are focused on the content.

From that doctrine, the most beautiful books are being designed, based on practices that were created with the advent of the art of printing. The typed text has developed beside the printing press for the optimum reading experience for the paper carrier. As a typographer, you need to know these practices before you can deviate from them functionally. Designers for reading need to know that everything that confuses or causes the eye to stumble is a barrier between the reader and the text.

On that note, reading from a screen should not be different.

Text Size.

Pleasantly readable text size is not experienced the same by every reader. In print, the size is fixed and is determined during the design phase of the content, considering the book type and target readers. In digital, it is in many cases, possible to manually adjusted text size. Whether this is a right solution that designers need to learn how to handle, or if it can be decided to maintain fixed size font in the digital reading arena – is a subject we would like to further test and discuss in the following phase.

Typefaces values derive from their technical print technology

As for the sizes themselves – the starting point of point size will, in digital platforms, be very different than print and will derive from screen resolution. Text font-size will normally be defined larger than in print. Those examples and more will be part of the guide for the digital reading experience.

Typeface.

“Matthew Carter, the designer of the fonts Georgia and Verdana, worked around pixels. He basically made pixel drawing and then wrapped the outlines around them. Normally, we make paper drawings or draw with vectors and then wait to see what happens when it’s rasterised. This was reversed – he rasterised first. And it was brilliant typefaces that worked in these harsh, harsh conditions of Windows, which is not a friendly environment for rasterising fonts. He kind of brought the traditions of typography to something which was not designed to respect these traditions.”

Peter Bil’ak, editorial and type designer at Typoteque, Interview March 2019

The choice of font is another critical element of the design. A font can convey a certain feeling, rather than only readability. Several properties of a typeface are being considered when choosing a font family: Which type is suitable for the content – Serif? Sans-Serif? Monotype? How are the letters spaced and has the kerning been appropriately applied? What weights are available? Does it have a sufficient glyph set for the required language’s? All those test-points and more help the designer determine the choice of a letter.

From our experience and our pre-research sources, you can already see differences between digital-oriented fonts and print fonts in their contrast, spacing and sizes when designing for digital reading platforms. We would elaborate on those differences and their consequences on font choosing in our guide to designing for digital reading.

Several fonts that caught our attention during the pre-research phase.
The fonts in this selection are used for both print and digital.

Sentence Length.
When it comes to reading long texts, readability is of paramount importance. A pleasantly readable sentence length is one of the fixed values ​​in print. In print, we experience text between 9 and 12 words per line as pleasant, aiding our eyes to move fluently to the next line. Too short rule breaks are experienced as extra disturbing.

On a 5 cm-wide screen, this rule will mean an unreadable font size. The derivative is having fewer words per line, for maintaining readable font size, extending the full-text length. In the following steps for writing the guide for designing the new digital reading experience, we will explore how to present sentence lengths on various digital formats.

Relations.
The most substantial relation in typographical design is the relation between font and format. This relation is the one determines all layout decisions for good readability.

The following diagram is presented in “Book typography – a designer’s manual” by Mitchell & Wightman. This diagram illustrates the relations between typographic elements and in that way offers a work method for the book designer.

In the next phase, we would define the core elements and the relations between them and other elements in the digital arena, to be served as a tool for the digital text designer.

The Attention Span.

“The length of the content is not the problem. It’s the attention span that’s the problem. I mean, people are binge-watching, so why shouldn’t they be binge-reading? But then the challenge is to come up with ideas of presenting the subject matter in a [chewable] consumable way. It would require to think about how to keep people attentive, and at the same time, allow for reflection and interaction with a text of two thousand words.”

Niels Schrader, Co-Head Graphic Design Department Royal Academy of Art Den Haag and founder of Studio Mind Design, Interview January 2019

Attention span is one of the digital reading opponents’ argument. Its source does not entirely lie within the design field, but in the fact that the content carrier is not an isolated reading environment. Whether reading is suitable for designated reading devices or can be applied on any device will be discussed in article 3.3. In regards to design, we look at the attention span from the perspective of long vs short reading segments.

The mini-magazine app Astronaut demonstrates 3 ways to interact with text
while maintaining a high quality of readability.

Even though the printed book text is long and continuous, there are typographic practices regarding paragraph length and breaks between them. We would suggest using those breaks to present the text in smaller pieces. More on this topic will be discussed and tested during the writing of the guide to designing the new digital reading.

Screen Typography.
One of the critical readability design elements that got lost in the digital reading outputs was the ability to control typography. The loss of a fixed layout on the one hand and granting typographical decisions for readers on the other has a significant influence on the digital reading’s experience.

In the following phase, we would test how typographic values can become once again a cornerstone in the design process for digital reads.

next article: Design Ingredients