By Arno Ghelfi
Do you like the letters you’re reading? Seriously. Are they easy on your eyes? Do you want to keep reading? I hope so — because I’m the guy who designed this website.
As a designer, I put a lot of thought into what fonts work best for headlines, bylines, and the body copy you’re reading now. For this project, I elected to use the font Effra for its clean lines and humanist shape — reminiscent of Original9‘s vision to create high-quality, compelling content. From a technical standpoint, I chose Effra because humanist sans serif fonts have open forms that lead the eyes horizontally, making them the most legible of the sans serif typefaces.
If it sounds like I spent a lot of time thinking about a font for this blog, it’s because I did. I believe typography is the most important visual element for a successful reading experience. Forget about a gripping image or witty header—the right font can turn a good story into a great one.
However, brand publishers and content marketers often bypass font selection altogether. Coupled with the technological evolution of font delivery, this neglect of fonts leads to a world of digital content with many options, but little variety. So, how can online storytellers start to bring fonts to the forefront?
A Brief History of Web Typography
First: a little typographic history. Web typography has drastically evolved over the last decade. Not so long ago, websites could only use fonts within the “web-safe” families: Arial, Georgia, Times and a few others were found on the overwhelming majority of computers, thus guaranteeing a correct rendering on the reader’s computer (and earning their “web-safe” nickname). With such a limited selection of fonts, all websites basically looked the same.
A hallelujah moment for designers, web developers and clients alike came a few years ago when a new generation of font hosting services entered the mix. These services allow an unlimited number of fonts to display correctly, regardless of device, operating system or browser. For a fee, font catalogues like Fontshop and Hoefler&Co simply feed desired fonts to a readers’ browser — and Google Fonts currently provides over 700 fonts in its catalogue free of charge.
With this technology in place, designers are now able to pick an ideal set of font families to fine-tune the visual language of a website, blog or media property. Sounds amazing, right? Well, not so fast.
When Brand Books Meet Digital Content
For content marketers, the visual language of your company—your brand—has probably already been defined by your marketing department in a brand identity guide or brand book. So selecting a new, more appropriate family of fonts for your projects likely faces a corporate hurdle first.
While dusting off an old brand book is helpful for defining parameters on business operating materials, the majority of color palettes and fonts don’t address the inherent differences between print and digital. Web-based articles require a font that will facilitate readability on the various devices and screen sizes used by your audience. For publishers, the font that brings digital language to life might not be the same font that lives beautifully on your business card.
An Expanded Set of “Web-Safe” Fonts
The idea that sans-serif fonts such as Helvetica or Arial, with their clean lines and lack of details, were better rendered on screens—and, therefore, better choices for digital—has been shattered by the democratization of high resolution and retina screens that allow fonts with more refined variations in width and shape to be rendered perfectly.
These new screens, paired with inclusive font anti-aliasing software found in modern browsers—and with the immensity of the catalogue offered by the leading web font services—have truly revolutionized web typography. Hardware, software and service: always a winning trio.
For storytellers, finding the right font for your unique project won’t be an easy task—it will require extensive research, trained eyes and more than a few revisions. Selecting the right font is only the beginning of a successful design: you’ll then have to refine font size, leading (line-height), kerning (letter spacing) and more.
If you choose to hide behind dated concepts or irrelevant corporate identity guidelines, even a Pulitzer prize-worthy story may not get its due respect on the web.