It’s Not You, It’s Your Type: Choosing the Right Font for Your Site

Typographic selections for any project, let alone a website, is a truly large task. When designing for the web, it’s important to know that content is constantly changing, and that type implementation will change as the material changes. The selection of type for the web is literally fraught with moving parts that will alter the initial design almost constantly – whether it’s a browser type or contributors adding new content.

This differs from packaging or print a great deal as those are a more static approach. Either way, the selection of type is truly an emotional experience, both for the designer and user. It’s the designers job to evoke these emotions with a steadfast design that reflects the brand it’s representing. The fonts chosen will become a primary component of the user experience on a site or application, so it’s important to view the entire context to deliver the right formula.

While it’s important to focus on the overall design of the site, and how the typographic elements intermix with their visual counterparts – it’s critical to remember that the purpose of the content is to help the user solve a problem and accomplish a goal oriented task.

Beyond this human connection and desire for aesthetic perfection, the first front of defense is ensuring that the type readable. A site that is readable will move way ahead in engagement than those that employ non-readable and highly non-fluent fonts in unappealing sizes. Body copy is the most important aspect of readability – a logo or title, seen in a larger font is less important for usability than that of the longer, body copy material. When choosing font size, the general rule is a 10-12px range as the norm, with a recommended 14-16px for optimal readability. Ensuring a font is big enough to draw the users attention but not making it so large that it becomes clunky, making other visual elements look too small – it’s all about balance and context.

The average website contains a great deal of content within its pages, so there’s rarely an instance where just one typeface will suffice – both from a design and usability perspective. A general rule to follow is the application of one font for headlines and one for body copy, this is in addition to the fonts used in a logo or branding assets. The fonts chosen for site content should be given as much effort as those selected for a logo. Just as a logo can set the tone for the vision of a brand, headline and body copy can dictate the users’ emotion and set a kind of visual narrator for the content.

With respect to mobility, whether using responsive design or not, there is no questioning the importance of an optimized mobile experience. With many using mobile devices over desktops on the rise, users are ingesting information on their devices at a rate that seemingly multiplies on a daily basis. To keep a users attention, the type must be considered so as to keep the users attention with easy to read copy.

Even when using web-safe fonts, conduct a series of A/B testing rounds to ensure a font (or fonts) make an impact in conversion rates. Testing appearance across multiple browsers and platforms will ensure all users see a consistent original design and confirm whether a font and size is optimal.

The main key here is design context and consistency. With the right font for the brand vision and sizing to match. Taking into consideration the importance of fonts in influencing users – the right implementation of this sometimes overlooked design aspect is paramount to a better user experience and heightened engagement.