Here are some tips for using typography on the web, taken from the book “Effective Visual Communication”, by Bo Bergstöm.
Serif vs. Sans-Serif
In print, serifs help, on screen, serifs hide.
The serifs in fonts create a horizontal path through the text, and give the reader’s eyes a path through the letters to follow. This makes serif fonts preferable in printed media. However, when reading text on the web, the serifs, and the thinner strokes in letters often found in serif fonts, can become swallowed up by the light of the screen. Consider choosing sans-serif fonts, or at least serif fonts that tend towards consistent stroke weight.
Reduce Scrolling
More scrolling is more work. However, this conflicts with the fact that greater line height improves readability, especially on the web. A web designer may lengthen the paragraphs lines as a solution, however this also decreases ease of reading.
To solve this issue, there are a few solutions.
- Edit the content and make sure that only what is absolutely necessary is left.
- Split the text into columns, allowing a wider text body on the page, without increasing paragraph width.
- Add pictures to the paragraphs, enlivening the paragraph navigation experience.
Keep in mind that web users move fast, and there are lots of choices. Convey information concisely, and the user will thank you. Don’t make people decipher information from large bodies of text, lest they move on to get their answer from an easier source.
Word Spacing
Websites’ readability can benefit from a greater distance between words (word spacing) than in printed text. However the word spacing should not exceed the line spacing (the space between two lines of text), since this will muddy up the composition of the document. In addition, keep in mind that enough spacing between lines is important to improve readability.
Good Luck!
May the fonts be with you.
References:
Bergström, B. (2017) Effektiv Visuell Kommunikation. 3rd ed. Stockholm: Carlsson Bokförlag.