Through many years of designing websites, landing pages, emails and other digital assets for clients, type has, and always will, play a major part in my creative decision-making process.
Prior to actually designing anything, you need to think through the content, the flow of information and the desired path for the visitor. Will type size and font choice matter to your target audience? After answering all of that, the size and font choice for headlines, subheads, calls to action, body copy and bulleted information should follow suit.
Understanding how people read
Someone sitting comfortably behind a computer screen is usually viewing about 20 to 25 inches away. From this distance, 16-pixel text on screen is comparable to the text size printed in a magazine or book, making it a good choice for body copy.
People also read online more casually and skim over text to just gather a general idea of what the content is about. Many also scan through the content quickly and only look for specific pieces of information. They will browse until they find something that is interesting—so the proper use of bullets, subheads and callouts matter.
Font selection
Many font choices are predetermined based on brand identity. But if they aren’t, it’s important to select a web-optimized font that is easy on the eyes and legible. Using a display font to create visual interest and separation between headlines and body copy can be a great solution as well. Also, when choosing a font family, be sure that it includes different weights which is also important to differentiate copy when needed. Load time should always be taken into consideration. Using a display font for all copy on a website is not best practice as it can make the site heavy and load slower. Similarly, using too many different web fonts on a given site can bog things down.
The optimal line height and number of characters per line
Making your content easy and enjoyable to read for all users is important as well. I have learned that for an optimal line height for body copy you can multiply your body copy font size by 1.46—a good place to start.
The number of characters per line is important because it allows your reader to easily digest the information. Websites stay in the range of 45 to 75 characters per line for a single column of body text. Overall, this average has decreased over the past few years because the average body copy font size has increased.
Responsive or fluid type
Responsive type adjusts its size and layout to certain breakpoints while fluid type resizes smoothly, keeping the layout of type consistent regardless of the device. It all depends on the project, but both are executable options when placing your content within a page.
Staying current with constantly evolving with web typography is important. There are a large number of displays sizes across numerous devices to take into consideration. When your content is easily read across all of these devices, your visitors are likely to return, and read more. Because to them—size matters.
