Let's ChatRecently, my colleague Bob Ball wrote an excellent piece on the fundamental principles of good typography, If I can’t read it, it’s ugly! If you haven’t read it, go check it out before you continue reading this article.
It’s ok. I’ll wait.
Done? Good.
Bob makes some great points. Designers would be wise to heed his warning to avoid the siren call of favoring form over function. (I’m looking at you, Panda-Hat-Wearing-Millennial-Designer.)
He also lobbed me a proverbial softball, asking the question, “What makes for good digital typography?” This is an important question to ask, especially for those of us who work with non-profits.
Our work affects the lives of millions of people all across the world. Done well, our designs have the potential to provide food for orphans, shelter for the needy and hope for the hopeless.
Typography matters.
So what makes for good digital typography? Before we answer that question, we have to answer 3 other questions:
Let’s talk about the first question.
Bob makes the point that all typography serves the same purpose:
“In short, the best design whether in print or online is where the reader does not notice the design or the type, but comprehends the message.”
Typography is similar to theater lighting. In a theatrical performance, there is almost always some sort of lighting being used for the benefit of the audience. But, if you’ve been to a play before, chances are good you don’t remember the lighting. That’s because good theater lighting is invisible. When done well, it calls attention to the events that are unfolding on the stage, not to itself.
Typography is the same. Done well, it doesn’t call attention to itself, but enhances the message the author is trying to communicate. There are many techniques that transcend the medium used and Bob has covered a number of them, so I’ll spare you the reiteration. The details of what makes for good digital type vary somewhat from print, but the principles of legibility are generally the same.
The primary difference between print and digital typography comes down to how the characters are created. Printed type consists of ink or a similar material applied to a physical surface. Digital type amounts to light shining from a screen.
This seems like kind of a “duh!” thing to point out, but it accounts for the fact that digital type is harder to read than print type. Over time, reading digital type causes eye strain. The eye is taking in light from the screen while trying to focus on something specific in the midst of that light. (Not to mention compensating for more light from the inevitable screen glare.)
By contrast, reading printed type relies on a reflected light source to illuminate the ink on the page.
Also, the issue of formatting is a distinct difference between the two. With print type, you can control every tiny detail. Typeface selections can be perfect. Line lengths can be exact. Ink color and paper consistency can be expertly paired for a beautiful reading experience. Not always so with digital type.
Because of the infinite possible combinations of screen size, default fonts, browser capabilities and monitor display settings, you can’t know many things that were once taken for granted in the publishing process.
Besides knowing that digital reading causes eye fatigue, we also know that the habit of the typical online reader is to skim content, not read it. This isn’t just because our eyes can’t handle extended screen time. It’s because internet use is rewiring the way our brains work.
In his book, The Shallows: What the Internet Is Doing to Our Brains, Nicholas Carr argues that our use of the internet is fundamentally rerouting the synapses of our brains and changing the way we interact with the printed word:
“The Net’s interactivity gives us powerful new tools for finding information, expressing ourselves, and conversing with others. It also turns us into lab rats constantly pressing levers to get tiny pellets of social or intellectual nourishment.”
The internet is feeding the pleasure center of our brains. We are rewarded when we hop from one link to the next. Our need to get to the next bit of information is being constantly created and fed as we browse. As a result, the online user is like a toddler on a sugar high: easily distracted and unwilling to give up more time than is absolutely necessary to reach their goal.
In light of this, a simple principle to remember is don’t make me think. According to Steve Krug, who wrote a book by the same name, this is the most fundamental rule of usability. It permeates every area of web design and needs to be our North Star as we create digitally.
True. You’ve been patient. And now that we understand the context for digital typography a little better, here are some practical guidelines that can improve our use of digital type:
At the end of the day, I am not too concerned with how much you know about typography. Seriously. You’re probably thinking, Wait a second. Didn’t he just ramble for way too long about typography? What is he talking about? Hear me out. My chief concern is not how well you understand typography. My chief concern is whether you care about your audience.
Empathy is tough to impart through a blog. But take a second and ask yourself, Do I care about the people I’m designing for? Do their needs matter to me? If I found out that I could improve their experience, would I do it?
You see, if you care about your audience, you’ll master your craft. You’ll strive to create work that is not only beautiful but helpful, and you’ll take every opportunity to improve it. If you care about your audience, you won’t bristle when you receive a critique — you’ll embrace it.
If you care about your audience, you will grow. The typography will follow and it won’t be ugly.
The panda hat though…get rid of that. You look ridiculous.
--
A Primer for Digital Typography was originally published on the Masterworks blog.