Grab Attention with Google Web Fonts in Email Newsletters

Your subscriber engagement depends not only on WHAT you write in your emails but also HOW you present your text. The usage of eye-catching web fonts will style up your email. Choose a web font that fits the character of your message and displays correctly for email clients. For a more creative solution, use Google web fonts in email!

Choose web fonts instead of images

Marketers often use images with styled text for headings and other parts of an email. We at Mailigen prefer the usage of web fonts instead.

A couple of great reasons are:

• Web fonts display regardless of whether or not images are blocked. Whereas, images in most cases need to be unblocked before being able to see them.
• The usage of web fonts reduces the loading time of your newsletter. Regardless of how many times you use the web font in a template, only one request for the hosted font file is required. As for images, the loading time depends on the number of images used in a template.
• No matter how good the quality of the images used in a template is, the text will always look sharper and better than an image.

Use Google web fonts in email

Try Google fonts to style up your email text! But, what are Google fonts and why should you use them? Google fonts are high-quality fonts that you can include in your emails. Let’s look at their main advantages:

• Google fonts offer a vast range of high-quality open source web fonts that you can use for both commercial and non-commercial purposes.
• It is very easy to access them and to use them in emails. Follow the six steps below on how to use Google web fonts in HTML email.
• Google web fonts are supported by the major email clients: Apple Mail, Microsoft Outlook (most versions), Lotus Notes, Thunderbird, Android and iOS devices.

Although Google fonts won’t display if images are blocked, there will always be fallbacks used instead, for example, sans serif. Therefore, recipients will be able to see the text of your email anyway.

How to use Google web fonts in HTML email

If you are an HTML user, follow these six simple steps to add Google web fonts to your email campaign:

1st step

Go to https://www.google.com/fonts and choose your favorite web font. In this example, we are going to use Open Sans.

2nd step

After you have chosen your web font, click on a Quick use button:

3rd step

Select the font styles among which to choose later:

4th step

Choose the character sets you need. Latin is set by default. Choose any other if you are preparing content in different languages requiring specific letters:

5th step

Press on @import section and copy it:

6th step

Place the copied text from the @import section in the <style> tags of your email template

<style>
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
/*  Place your css style here  */
<style>

 7th step

Assign it to your chosen text:

<span style="color: #000000; font-size: 24px; font-family: 'Open Sans', sans-serif; line-height: 150%; margin: 0px; font-weight: bold;">Your title goes here</span>

And you are done! That’s how it looks in an email campaign:

Other web fonts for your email

Even if you do not choose Google fonts, there are far more web fonts that you can safely use in your email campaigns apart from the usual Arial or Times New Roman. Here are numerous email safe fonts recommended by our expert team:

 font-family: Arial, Helvetica, sans-serif;
 font-family: Georgia, serif;
 font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
 font-family: 'Times New Roman', Times, serif;
 font-family: 'Arial Black', Gadget, sans-serif;
 font-family: 'Comic Sans MS', cursive, sans-serif;.t.c.
 font-family: Impact, Charcoal, sans-serif;
 font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
 font-family: Tahoma, Geneva, sans-serif;
 font-family: 'Trebuchet MS', Helvetica, sans-serif;
 font-family: Verdana, Geneva, sans-serif;
 font-family: 'Courier New', Courier, monospace;
 font-family: 'Lucida Console', Monaco, monospace;
 font-family: 'Brush Script MT', cursive;
 font-family: Monaco, Consolas,'Lucida Console', monospace;

Although the majority of email clients support default web fonts, there might be some that do not, like Outlook 2007, 2010 and 2013. For these Outlook versions, Google fonts change to Times New Roman. There is a workaround for this but it doesn’t completely fix the issue with Google web fonts as it only lets you choose a font that Outlook supports.

To sum up on web fonts

All marketers want their emails to stand out in the crowded inboxes. Default web fonts and especially Google web fonts are a great way to grab the attention of your email subscribers. Do not clutter your newsletter with unnecessary images in headings if you can use email safe web fonts instead; these will lighten up your email, speed up loading time and simply will look better. The hardest choice will be finding the right font for your email. Use an A/B split test for email content to find one which suits your audience best and the message character.

If you are looking for professional help to choose web fonts and integrate them in your email text, please contact our team. For the whole email template design, contact our Email Template Factory, and we will ensure your campaigns are both beautiful and successful.