Despite the fact that text-only messages are no longer appreciated, the use of right fonts continues to matter. HTML email templates give unparalleled freedom of using various email fonts in your messages so that you can express your brand better. However, this needs to be treated with caution as your subscribers will be able to read only the fonts supported by their mailbox providers.
Email developers need to keep email typefaces in accordance with the support provided by inbox providers and in this concise guide to using fonts in email marketing, I will discuss how you can use typefaces to render psychological impact for your branding game. We will have a quick look at various font types and see how you can use them for your email marketing campaigns.
What Are Web-safe Fonts For Emails
The fonts widely used by various operating systems, device types, and accepted by a majority of email clients are known as web-safe typefaces for email marketing. Using web-safe fonts for emails confirms that your messages render as per your design. Georgia, Helvetica, Times New Roman, and Arial are some of the popular fonts accessible by all device types and operating systems.
Also, they are chosen as default fonts on a majority of devices and OS. These fonts are to be considered different from web fonts as the latter are licensed for use on websites. This shouldn’t discourage you from using web fonts as they are supported by major email clients like Apple Mail, Gmail, iOS Mail, Outlook App and Outlook for Mac.
Three Methods Of Embedding Fonts In Email
#1 Use @import
You can directly import the font by providing the URL of your desired font inside the code, in the <head> tag. It also works for the self-hosted web fonts with almost every email client supporting it.
#2 Use <link>
The <link> method is universally accepted while it provides better accessibility as compared to @import. It allows your phone to load fonts with an inline code along with your HTML file’s code. While this can backfire for larger file sizes, your viewers will find it easy to access your emails as all elements are loaded all together.
#3 Use @font-face
If you want greater control over the file format for your web fonts that you want to import, you should use the @font-face method. It allows you to import the file format of your choice among the five formats, including .woff, .woff2, .eot, .svg, and .ttf as per the support extended by the email clients of your subscribers.
How To Choose The Email Font
The email fonts can be largely divided into Sans and Sans Serif types. Sans Serifs are considered modern, and they make your messages look approachable. They don’t have a decorative stroke on their feet. On the other hand, Serifs are more traditional fonts, being used for quite a long time now. They help project your brand as authoritative and trustworthy as most of the newspaper publications use it. Depending on requirements you can choose the fonts from either of these two font families.
After you select the right font or a combination of fonts, the next step is to decide the ideal font size to be used in your messages as well as the color scheme. I have observed that the 14px to 16px size range is ideal for all devices while the color should contrast with the background. This helps in mobile optimization and 36% B2B companies find mobile optimization useful for overall performance. You can also combine Sans Serif and Serif font families as needed but keeping the mix limited to a few varieties is always appreciable.
Here I am putting down the email examples of using Serifs, Sans Serifs, as well as a combination of typefaces in emails for your ready reference. Have a quick look here:
Fallback Fonts: An Essential Part Of Email Typography
To ensure proper user experience despite your brand fonts failing to load, it is advisable to use fallback fonts. This helps your subscribers in consuming your messages by replacing custom fonts. You need to use fallback fonts based on the font height, and spacing as both of these factors vary depending on your selected typefaces. You can also set multiple fallback fonts and assign ‘system font’ as your alternative to ensure seamless renderability.
Email fonts have a considerable role to play in your brand image as well as how your subscribers perceive your messages. For instance, using short and bulky fonts for a luxury brand will never work out. Thin and tall fonts are used for such applications since they resemble the human body in the fashion industry. In the same way, you need to consider both psychological factors as well as brand consistency while choosing the typefaces.
You don’t need to follow any rules strictly, but maintaining consistency and keeping your messages clean should be the ideal approach. 89% of the marketers use it as the primary channel for acquiring leads so neglecting on any facet isn’t an option. I hope you find this concise guide to using fonts in email marketing insightful for your future endeavors.
About the Author
Kevin, the Head of Marketing at Email Uplers – one of the fastest growing custom email design and coding companies, specializes in crafting beautiful email templates, PSD to HTML email conversion and free HTML Email Templates. He loves gadgets, bikes, jazz, and breathes email marketing. He is a brand magician who loves to engage & share insights with fellow marketers.