I think we've all had an experience that defined a hill we were willing to die on. I remember one of my design-related hills so vividly that I had to write a blog about it!
One of my design hills involves readability: the ease with which people read text and are then able to interpret said text. This stance developed from a project where I was asked to provide design feedback, such as typography, hierarchy, and layout, on a set of documents created by an external group.
One of the documents was an important form. When I tell you my eyes bugged out of my head when I opened it 😳
The text size was huge, like 14 points huge, all the same size and thin typeface, and it spanned across the entire width of the page. The best practices of readability that had been drilled into my brain in design school kicked in to high gear as I wrote my recommendations.
However, in response to my recommendations, I was told that this document couldn't be altered. The document was so important, that the external group decreed that all the type needed to be set in 14 points, to "ensure readability". But I knew this in fact didn't ensure readability at all!
Thus, my design-related hill to die on was formed: that readability is not ensured by large type size, metaphorically screaming at people. Rather, readability comes from design best practices such as contrasting hierarchy, optimal line lengths, and negative space, which allows us to process information in ways that are more in sync with how our brains are wired.
Note that my point here is not that important information should be diminished, but that in order to improve chances of comprehension, large text size alone is not effective. I believe the most successful designs are ones that take into account how humans naturally process information.
Legibility vs. Readability
It's important to define the often incorrectly interchanged terms of legibility and readability.
Legibility is an informal measure of how easy it is to distinguish one letter from another in a particular typeface.
Readability is about the reader—the ease with which a reader can successfully decipher, process, and make meaning of the text read.
Legibility and readability can be compared like squares and rectangles. All readability requires legibility, but legibility doesn't necessarily equate to readability.
Brain workings
Our brains process a crazy amount of information, about 4 billion bits per second, most of it unconsciously (Toptal). Our brains naturally prioritize information because, well, that's a lot to sort through at once! When the amount of information coming in exceeds our ability to handle it, our performance suffers (Nielsen Norman Group). When attempting to sort through complex information, we may take longer to understand it, miss important details, or we may even get overwhelmed and abandon the task. Not ideal behaviors for reading important documents!
In order to help us make sense of it all, our brains use inductive reasoning and conditional probability to create "shortcuts" to processing. (Toptal). Humans naturally perceive objects as organized patterns and objects in order to save energy and operate more efficiently—this is the guiding principle behind Gestalt psychology.
Visual indicators and design best practices rooted in Gestalt principles, such as these listed below, help us to group objects together, allowing our brains to process information more quickly and efficiently.
Contrasting hierarchy
When everything is important, nothing is important!
(See how that statement is in bold but surrounding text isn't? 🤓)
Contrasting hierarchy helps with 'chunking'—the breaking up of content into small, distinct units of information, as opposed to undifferentiated masses of content (Nielsen Norman Group). "Chunking" aligns with gestalt principles, helping us break up information so we can process it in ways that align with how our brains function. Hierarchy can take the form of contrasting text sizes, font weights, negative space, color, and more.
Line length
Line length is a best practice that was drilled into my head in design school, and for good reason! In the mid-twentieth century, Swiss designer Emil Ruder conducted studies testing optimal line lengths. He concluded that the optimal line length for body text is around 50–75 characters per line, including spaces (“Typographie”, Emil Ruder).
Too narrow: If text spans across lines that are too short, our eyes have to travel often, breaking the rhythm of reading. Lines that are too short can also cause stress to readers, making it easy to unintentionally skip ahead and start reading the next line before finishing the current one.
Too wide: Long lines of text make it difficult to gauge where lines start and end, making it hard to quickly find the next line. This also disrupts the flow of reading and causes frustration. Additionally, there's an inverse correlation with line length and people's focus. At the beginning of every new line of text, readers are able to re-focus, but this focus gradually wears off over the duration of the line. (“Typographie”, Emil Ruder)
Negative space
Negative space is crucial to legibility. It gives our brains breaks—moments of rest to process what we've read and to prepare for what's to come. It also allows us to put those gestalt principles, 'chunking' content in order for our brains to operate more efficiently. Negative space applies to space within letters, space between letters, and space between lines of text.
Negative space is as equally necessary as 'filled' space to allow us to make sense of the 'filled' space (trippy, huh?). We decipher the world through contrast; black couldn't exist without white. This contrast is crucial to legibility, which helps to enhance readability.
In conclusion, 👏 graphic 👏 design 👏 is 👏 important 👏
When best practices and psychology are incorporated in design, people are better equipped to read and interpret messages, helping them to feel better informed, confident, and at ease in their everyday lives.
This is why this is a hill I'm willing to die on!