New Perspectives On Web Design

(C. Jardin) #1

CHAPTER 9 The Next Steps for Web Typography


Macrotypography
After we have qualified content, depending on the findings, we can take a
different approach to setting up macrotypography.
If the text is easy to read, i.e. scores high at Flesch-Kincaid Reading
Ease^41 or low at Automated Readability Index^42 — it means it can be read
rather quickly. In this case, there’s room for varieties in style. You can select
a typeface with plenty of character and layout the document in an unusual
way to add interest. The elements can be mixed and matched, as the reader
will be able to understand the story.
One such example is a poster (or a website) for an event. The set of
information on a typical poster is well-known and clear. For instance, a
typical conference website features speakers, attendees, sponsors, topics,
schedule, location and a ticket form. Yet, besides providing the visitor with
information, its purpose is to stand out in the forest of similar events.
Because it serves as a communication tool for some other content (the
event), and it’s expected to be memorable on a visceral level, we can select a
typeface with character.
On the other hand, if the text or the matter is complicated, the layout
should be sound and stable and in this case any quirkiness or unexpected
typographic extravagance can break the flow of thought. Such text can be
broken into components with extensive use of illustration and infography,
numbered image captions and clear document outlines. A document that is
difficult to read or understand benefits from robust structure.
The easiest way to set up the structure is with our old friends block
paragraphs, numbered lists, a clear grid and generous gutters.
For instance, step-by-step how-tos are easiest to follow if each step is
accompanied with a clear photo or illustration. It’s easy to mess things up
here, too. The natural direction of reading for westerners is horizontal,
left to right, so it’s always better to design each step as a horizontal pair

41 http://en.wikipedia.org/wiki/Flesch-Kincaid_Readability_Test
42 http://en.wikipedia.org/wiki/Automated_Readability_Index
Free download pdf