Ultimate Guide to Email Typography: Best Fonts and Font Sizes for Email – MageMail

Your triggered emails, such as promotional emails and newsletters, need to reflect the core aesthetic of your business if you want to increase brand presence and engagement. but they must also be legible.

so what is the best font for email?

colin wheildon, author of type & design: are you communicating or just making pretty shapes? he writes: “It is possible to impress three-quarters of your readers simply by choosing the wrong type.” if he spends time crafting the words he uses, he must equally care about how he presents them to his audience.

The fonts you have in your company emails, if used correctly, are recognizable symbols for you to spread in the digital world, echoing your brand’s unique style. if text is the equivalent of the spoken word, the fonts you use are your voice. they influence your tone and can create familiarity with your customers.

We know what you’re thinking…

“I’m creative. With the fonts I know and love, I can create emails that not only stand out, but are readable, fresh, and timeless.”

You may have even considered branding your magic mail emails with fonts that match your site.

but as you start formatting your email fonts, you’ll notice something: those mounds of fonts you used to design your site are nowhere to be found in your email control panel. all you’ll find are “web-safe” fonts, like times new roman and arial.

So how do you make your written content look visually distinct to strengthen your brand presence and impact? Are you stuck with using comic sans for every marketing email you send?

Screen Shot 2018 01 02 at 16.48.06GMT7

(source: author’s screenshot)

In our ultimate guide to email typography, we introduce you to the best email fonts you need to use for any body copy and display text, show you how >shocker in any font you want and it will tell you what font sizes and settings to use.

keep reading!

cross-platform fonts

“why can’t you use whatever font you want?” you might ask.

In a contemporary world with virtual reality (vr) and artificial intelligence (ai), how can we not have an email network that is fully compatible with the sources available to us with other web-based means?

The thing is, you don’t submit the fonts yourself, you use other people’s fonts. It’s not just you who needs to have the font available, p. at magemail or another email service provider.

Your recipients’ email client displays the text you send in the desired font style, only if the font style is compatible with them.

Whether you’re sending marketing emails, order confirmation emails, or anything else, your live text fonts need to be compatible with all email clients and your recipients’ computers. you want to reach as many people as possible to get the best opportunities from the most promising leads. this means you should use cross-platform fonts for your live text, which work with most email clients and services.

Here is the full list of fonts supported by most email providers:

arial, arial black, comic sans, courier new, georgia, impact, charcoal, lucida console, lucida sans unicode, lucida grande, palatino linotype, helvetica, book antiqua, palatino, tahoma, geneva, times, times new roman, ms trebuchet, verdana, monaco.

As you can see, there isn’t a huge selection. Many of these “web safe fonts” are also not suitable for your email copy because they lack clarity. you want your emails to look great. but you also want them to be read.

Take Helvetica as an example. it makes a bold impact when you use it in a title or headline. but displaying the body text in helvetica can make reading difficult. As one type designer explained to Bloomberg, “the letters are too close together.” this makes it too difficult to scan the forms and quickly digest the information. Since the average time spent on an email is around 11 seconds, it’s crucial that your content is readable.

In a different sense, “fancy” or “novelty” fonts, like comic sans, can undermine your core brand aesthetic because they look cheap and buff. For the main body text of your emails, you need compatible fonts that are legible but neutral. you do not want to draw attention to any display text which could also be included as: your offers, your titles and headers > and the words on its buttons.

So, what cross-platform fonts make your emails and live html text more readable to recipients, without taking away from your core brand aesthetic?

Here are our top 5 email fonts for optimal readability and neutrality:

1. Georgia

georgia is a serif font (meaning it has little curls or balls at the end of its letters). Designed in 1993 for Microsoft, it was inspired by the early Scotch-Roman typefaces used in printing. it has an authoritative, “classical” aesthetic after its established use in novels and newspapers. This is one of the easiest fonts to read, with even letter spacing and thick serifs that guide your eyes as you move them across the page.

See Also:  Where do i mail my idaho state tax return

2. verdena

The Verdana font, named after its designer’s daughter, is literally a combination of the two words “verde” (something green) and “ana” (her name). is one of the easiest to read, sans-serif, and web-safe fonts. like-shaped letters are designed to appear differently, specifically for greater overall readability. the lowercase letters are taller than is typical for such a font, so it can be a great font to ensure your uppercase sentence copy is accessible to all ages and abilities.

3. timesnew roman

times new roman was commissioned by the british newspaper the times in 1931. it has a design with thick serifs and contrasting line weights (for example, how the short line at the bottom of the “t” is much thinner than the vertical line leading to the bottom) help guide the reader’s gaze from one letter to the next. However, it’s the familiarity that makes Times New Roman so popular: Until 2007, it was the default font for all versions of Microsoft Office and many other word processors. use it for a serious, classic and respectable tone in accordance with its usual use for official documents.

4. trebuchet ms

When Vincent Connare designed this sans-serif font, he called it a “trebuchet”, literally a medieval catapult. he thought it would be “a great name for a font that launches words across the internet.” and he was not wrong. trebuchet is now one of the most established web safe fonts. is designed with small, clean strokes at the beginning and end of difficult letters that serve as legibility guides, without distracting too much from the main letterforms, as is the case with full serifs.

5. arial

arial was designed in 1982 to serve as a free alternative to the already popular helvetica. arial is the source of much debate when it comes to web and email copy. although many software manufacturers and email providers use it by default, some designers claim that it is difficult to read, with letters too close together, as in Helvetica. Similar letters appear to have the same angles and lines, making them difficult to distinguish in large text. however, many designers appreciate arial as a great font to complement the non-intrusive, unassuming, and recognizable tone of its somewhat ubiquitous use as a software default.

Whatever safe web fonts you use, be aware of their effects. mutually compatible typefaces are so established that they are taken for granted more than most. they can sink into the page and become almost unnoticeable. This means readers can focus more on your content than how you present it, which is especially necessary with longer copy.

size matters

After working hard to select the best fonts, it would be a tragedy if your text appeared too small or too large to read. but it can be difficult to know how live html text sizes will appear for different recipients. Here’s a helpful guide on font sizes and line height to use for the most readable cross-platform text.

header: 22 – 28 pixels

body text: 14 – 18 pixels

line height: 1.4 – 1.5

The size of your text will vary depending on the font you use, so play around with values ​​within these suggested ranges and see what works best for you. Always send test versions of your emails to yourself to verify that the variations and consistencies are as expected. check, check and double check to make sure your text is clear on all devices and for all email clients.

web fonts

To stand out as a unique brand, you need to draw your recipients’ attention to the core elements of your emails that your body copy is intended to support. this is the point where you may want to explore other typographic options and tactics. you may have heard of “web fonts”.

Web fonts, not to be confused with web safe fonts, are becoming more prevalent. they are based on a different approach than before, loading fonts from the internet rather than within the confines of individual computers, email clients and providers. most popular email services, including gmail and outlook, have no problem displaying them.

This is great if you know which email providers your recipients use. Unfortunately, lesser-known email services, as well as those designed specifically for businesses, may not display their web fonts. instead they will change to a default font or, if you have specified a supported “fallback” font, this is what your recipient will see.

Different fonts exhibit variations in size. This means that if your text is displayed in a font that you never intended it to be, your emails could appear cluttered and unprofessional to recipients with incompatible email clients. It’s not the end of the world, but if you put in the effort to design your emails well, you want them to reach as many people as possible in the way you want.

For high volume marketing emails, web fonts are not yet ideal as they are not as widely established.

See Also:  Tinder dating among teens: when swipe

brand fonts

The fonts you use are a big part of your brand identity. You need to show subscribers that your style seamlessly intertwines with everything you do to create a recognizable aesthetic and familiar connection every time they open your emails. Maintaining consistent fonts for things like your company name, headlines, and offer text is vital if you want to establish yourself as a company with personality, a brand, and not “a business.”

Although web-safe fonts can be good for lots of copy, they give you little to play with in terms of bold, attractive and unique design. but it’s not just your text on the page that you need to select fonts for. In a business context, your multimedia content is full of written texts, whose purpose is to entertain, interest, satisfy and pleasantly surprise. these are the parts of your emails you want your readers to see first, so use fonts that grab attention and make a statement.

Images and other visual media, such as banners, backgrounds, and buttons (ctas), may include any of the various fonts you have access to within your graphics software. plus, visual file formats give you the ability to “lock” your fonts so they appear the same on multiple devices.

It’s easy to add multimedia content to your triggered emails with magemail, but you can also follow these techniques to increase the effectiveness of your newsletters and other regular mailings.

Here’s how to include branded fonts in your emails by using them for display text in your media:

1. static images

today only

(source: verygoodemails.com)

Images have become increasingly common in the email format. Although most email providers still block images the first time they are received from a new address, users can easily click to display them if they feel the sender is safe. the presence of your web-safe body copy should always serve as a backup, regardless, providing all the information your recipient needs in case images or other media don’t load.

web fonts may be distorted if they are not supported by your recipients email client, your images will or will not appear. This means that even if your images are not displayed, your subscribers will still know what the information is. they won’t just assume your company is incompetent at designing readable emails. this makes them preferable to web fonts, which, as noted above, can vary in appearance, making it look unprofessional.

In the example above, Floyd Furniture Store overlays its promotional image with a thick, bold font. the company name (their logo) is also shown as an image file above, although it only contains text. the offer text typeface is geometric, 3d, and more complex in terms of design than any of the web-safe fonts. the company name font is minimal, but tall and crisp. the fonts combine to create an aesthetic of clean lines and sharp angles, reflecting the company’s precision engineering and design. certainly these short texts would have less of an impact if they were displayed in a compatible standard font.

2. animated gifs

the vans holiday gift guide

(source: verygoodemails.com)

gifs add movement to the static email format in a very instant way. while videos can take a long time to load and require your recipient to actively press play, gifs display almost as soon as you open an email in their animated form (with supported email clients).

gifs are surprisingly compatible with most email clients, with the only drawback being that unsupported email clients will only display an initial frame. this can be easily combated by ensuring that all key information is displayed in the first frame. You can also use whatever fonts you want in a gif, since they are essentially just flipbooks made up of images.

Adding motion to text can give it some life. play around with some color changes to make your title appear to flicker, or maybe add some subtle, sporadic movement to each of your letters to separate them from their static background. If you want to create your own gifs, check out this article that will walk you through designing in photoshop. You can also use sites like giphy.com to quickly make your gifs and then overlay text with custom fonts using your graphics program.

vans holiday gift guide email (above) uses a custom animated font for its “gift guide”. skeuomorphic design (which makes digital elements look like their real-world counterparts) is used to make the typeface reminiscent of neon sign writing, with a shimmer and shine effect. the font fits in with a holistic cartoon-style aesthetic, with balanced lines and curved angles. the animated motion does an amazing job of drawing your gaze to it, as well as reflecting a brand identity that screams “creativity” and “innovation.”

3. add a custom action call

button colors

(source: verygoodemails.com)

with magemail-enabled emails, all images can be linked. This means you can design your own custom emails with fonts to match your brand’s unique voice and style. Create the button you want to use as an image in your graphics editor, insert it, and make sure to link it to a landing page on your site.

See Also:  Bella Hadid admits she had a nose job at 14 and feels like Gigi's 'ugly' sister in Vogue spread  | Daily Mail Online

Your ctas should be clearly visible, as they represent the path you want users to take to your site (and, hopefully, to a purchase). Marketers see significant differences in click-through rates due to slight adjustments to their CTA buttons. simply changing the text from “start my 30-day free trial” to “view demo” could improve click-through rates by 211%. making your cta as attractive as possible could make a big difference in your email revenue.

for a brand like starbucks, in an extremely competitive market, it is important to show a constant brand presence and attract users with an eye-catching cta. If everything you do reflects your unique aesthetic, you will better communicate the type of brand you are to subscribers. A consistent brand also exhibits high design standards, an important insight to create if you’re selling “luxury” consumer products.

The “Join Now” button in the starbucks email campaign above leverages the same brand font used to display your company name. this familiar “all caps” font style draws attention to itself, contrasting with the body of the message, presented in sentence form, with a neutral font. The font not only makes the button visible, it helps strengthen the presence and influence of the infamous starbucks brand through familiarity with this established brand font.

So, what are the best fonts to use if you want to spice up your media? here are our top 5 contemporary fonts to use in your multimedia copy:

1. open sans

open sans

open sans is a sans-serif font designed specifically with digital content in mind. commissioned by google in 2010, it has “vertical stress, open forms, and a neutral yet friendly look”. has been “optimized for readability across print, web, and mobile interfaces.” open sans is now one of the most popular alternatives to standard web-safe fonts, often used for large chunks of text, but also suitable for clear, friendly and conversational headings, titles and offers for its minimal simplicity. /p>

2. Josephine slab

josephine slab

josefin slab is a striking, quirky yet minimalistic serif font style. It is a mix of Scandinavian, geometric aesthetics and modern details. the light lines give it a fresh, airy feel, though its quirky attributes (such as the upward emphasis on letters like “e” and “f”) can make large blocks difficult to read. use it to capture the attention of your readers or rebrand your company name with a sleek, modern aesthetic.

3. arvo

arch

a bold serif font like arvo makes a statement. With heavy serifs, which act as feet of land, the letters stand out strong and independent, with little fluidity from one to the next. this is a relatively new font, used a lot in web design. but beware. it’s bold, brash, and should be used to display text and headings, as it can be hard to read when used in long sentences.

4. lato

high

lato, which means “summer” in Polish, is a popular font for longer display text, such as offers and complex descriptions. its readability and simple, rounded shapes are also suitable for friendly, unassuming letters and modest, colloquial headings. If you have to use more than a couple of words to convey your information, Lato’s compact form also means you’ll be able to pack in more while maintaining a high level of clarity. This is good to know, especially if the text of your cta is more complex than the standard two-word versions “buy now” or “join now”.

5. vollkorn

volkkorn

vollkorn is an open source serif typeface designed by friedrich althausen in 2006. vollkorn was primarily designed for body text, but is notable for its heavier weightings, where it works well for displaying text in headers and headers. its serifs help fix readers’ eyes on the page and give it a classic, respectable, “old world” quality, akin to Times New Roman. use for a contemporary take on this print-influenced authoritative tone.

Use extraordinary typefaces to create a lasting impression with your display text. Overlay your images, gifs, and cta buttons with fonts that draw your subscribers into your brand promotions, content, and community.

limitations breed creativity

revolutionary composer igor stravinsky said: “the more restrictions one imposes, the more one frees oneself… the arbitrariness of the restriction serves only to obtain precision in execution.”

The limited range of fonts you can display in the main body of your emails should not be considered a limitation at all, but rather an opportunity for creativity. As with web design, all others are subject to the same requirements and standards.

Knowing the best fonts for email and the font sizes to use will make your business stand out from the competition. Using the techniques we provide, you can design emails with fonts that reflect your company’s unique style, while also being legible, clear, eye-catching, and unique.

be creative!

Leave a Reply

Your email address will not be published. Required fields are marked *