Seeing Before Reading: Messages Encoded in the Design of Information [Visual Imagination #2]
I stumbled across an essay called The Rhetoric of Text Design in Technical Communication, by Charles Kostelnick, a professor at Iowa State University, that discusses the meaning encoded in the visual arrangement of information. Kostelnick writes,
We see documents before we read them: this initial encouter evokes an aesthetic response but one with immediate practical consequences. Since seeing precedes reading, the reader's first glance influences the information processing that follows. The balanced arrangement of visual elements on the page, the contrast among these elements, the efficient use of spacetogether these create a unified visual display that predisposes the reader to respond favorably (or unfavorably) to the information in the document. (200)
Here's an example showing a variety of document designs:
What messages do you immediately infer about the design of the information based solely on the structures above? Kostelnick explains that the design functions as "macro-punctuation." Just as punctuation clarifies meaning within sentences, the way we arrange and style information visually also provides "visual cuese.g., division, coordination, subordinationsthat enhance the reader's ability to process information in the text" (190).
From the design of the information, you can make inferences about relationships, parallelism, equality, emphasis, repetition, patterns, and coherence within the information. These inferences prompt readers to understand some aspect of the information before they even read it.
In the graphic above, A has an equality about the information, as does B, C, and D. But with documents G and H, the smaller columns perhaps contain subordinate information, such as notes about the main information.
Beyond hierarchy that establishes relationships, divisions also send messages to the reader. Looking at F, you can guess that the unique sections will contain different but related ideas, whereas the documents without divisions will contain a more unified theme.
Document E has a list of items. You would expect that the list of items supports an idea in the preceding paragraph, that the list items be parallel concepts or examples following from the preceding block.
D provides more white space than C. The design suggests a stronger focus on the information, that we read every word, whereas C invites us to skim and scan, much like reading a newspaper.
Overall, the design of information provides cues about the meaning of the information. These cues, like punctuation, are often unconsciously interpreted by readers, but they do significantly influence the message.
I'd Rather Be Writing Newsletter
Get new posts delivered straight to your inbox.
About Tom Johnson
I'm a technical writer based in the California San Francisco Bay area. In this blog, I write about topics related to technical communication — Swagger, agile, trends, learning, plain language, quick reference guides, tech comm careers, academics, and more. I'm interested in , API documentation, visual communication, information architecture and findability, and more. If you're a technical writer of any kind (progressional, transitioning, student), be sure to subscribe to email updates using the form above. You can learn more about me here. You can also contact me with questions.