So, Paul Airy has this book we’re all crazy about called A Type of Email. We’ve got our fair share of typography nuts on staff, and this book is about the clearest, most tangibly applied set of guidelines we’ve seen regarding HTML typography in emails.

Paul’s also started a newsletter called Type E which serves as a kind of expanded universe for the info in the book. We did our best to mask our fangirl status and reached out for an interview, which Paul graciously granted us.

We also asked Paul for some of his favorite examples of Really Good Typography™ and interspersed shots of his top picks throughout. Got any of your own? Tell us below!

Hi Paul! For starters, could you help our readers understand how you think about typography in general?

I’ve had a love for letterforms ever since school, and typography has always had an important place in my life throughout my career as a graphic designer, web designer and now as an email designer.

Type is a beautiful thing, and typefaces allow us as designers to express the mood or personality of a piece of communication. I think of typography as an art form, a way of sculpting words to convey a message, that goes beyond the language itself.

“[Subscribers] are at the heart of my approach to email design and development. My starting point is not to assume anything about them.”

What’s the essence of great typography?

Quoting Wikipedia, “Typography is the art and technique of arranging type to make written language most appealing to learning and recognition.”

Seriously though, great typography doesn’t just happen, it’s crafted. It’s about skillfully managing the relationship between each piece of text in a piece of communication, in order of hierarchy, using size, weight and space so that the communication makes sense to the reader, both at a glance, and as it’s read through.

To create really great typography, you need to pay attention to detail. Use the correct characters for apostrophes and dashes for example, address widows and orphans, and in the world of email, fix those Apple links!

Paul: Great Western Railway has built most of its emails using HTML typography, using Georgia and Arial, and have superimposed the headline onto a background image using VML.

When did you first connect the dots of typography and email?

The online fashion and home retail email campaigns I worked on in my first role as an email designer were by their very nature, image heavy. The use of HTML typography was encouraged for deliverability reasons, but was typically confined to a few short paragraphs, and the legal copy in the footer.

Mobile wasn’t a thing at the time, so templates were being designed and developed for desktop only. The approach was very much to design an email in Adobe Photoshop (based on the creative that had been already been designed for the direct marketing channel), ‘slice it and dice it’, and build it in Adobe Dreamweaver.

But I knew, if we were to progress, we needed to be much more fluid with email. Even though mobile wasn’t a thing yet, it soon would be, and that meant that typography had to be too — not static and embedded within an image, but fluid, responsive and HTML.

Can you talk about your subscribers-first approach? What’s at stake here for the average email marketer and reader?

I talk about putting the subscriber first, or #SubscriberFirst, a lot, and that’s because they are at the heart of my approach to email design and development.

My starting point is not to assume anything about them. I don’t assume they always have an internet connection. I don’t assume they have an email or webmail client that automatically displays images. I don’t assume they have images switched on. I don’t assume that if I were to embed typography within an image (which I wouldn’t of course), that it’d be legible enough for them to read on an iPhone Retina display.

Instead, I aim to make it as easy as possible for the marketing message—which has been deemed so important, it’s been thought worthy of being sent using the email channel—to have every opportunity of reaching the subscriber, so that they read it and engage with it — and crucially — without them having to do any ‘work’ whatsoever in the process.

So I guess, #SubscriberFirst means that I challenge the way I go about email design and development, removing anything that gets in the way of the message and the subscriber.

I use HTML typography so that:

• The subscriber doesn’t have to select the ‘Click here to download pictures’ link.
• Whatever device the subscriber is reading it on, it’s crisp and clear.
• That the text automatically reflows on mobile, and they read the message, without having to scroll, pinch and zoom madly around.
• The message appears instantly, before the images even get a chance to load.

This is really why marketers should devote more attention to their use of HTML typography, because if they don’t, they’re putting barriers in the way of their message and their subscriber, their customer, their supporter — and ultimately putting their email at a disadvantage.

Paul: Nike were, until November last year, building their emails with a combination of HTML typography and image-embedded typography so that they could maintain the use of their brand font, Trade Gothic. They’ve since encoded Trade Gothic into the HTML as a web font.

Type E: Issue 06 was all about web-fonts. Do you have any personal rules about when to avoid them in an email?

I don’t have any rules about when to avoid web fonts as such, but I do set myself some guidelines for including them. I start by looking at email and webmail client data in Litmus Analytics, to understand what subscribers are using, and if a significant percentage of those email and webmail clients support web fonts. If they do, there’s a case for including them. It’s important, when considering web fonts that you set the expectations of any stakeholders, so that they clearly understand what the experience will be for subscribers that don’t use email and webmail clients that support web fonts, and the fallbacks they’ll see.

I then ask whether web fonts add value to the subscriber experience or the email itself. A brand may choose to implement a ‘brand font’, as Nike have done, for use offline and online, to deliver a consistent brand experience across all channels. A web font may also be chosen to inject a level of personality into an email that you couldn’t achieve otherwise.

Paul: The Guardian has its own web font, Guardian Egyptian Web Headline, and they’ve replicated their editorial style very well in email, so the visual brand experience is seamless across print, web and email.

Do you think that the use of web-fonts will continue to rise?

Yes, I do. We’ve certainly seen an increase in recent years, perhaps due to a combination of email marketers, designers and developers becoming less precious about delivering exactly the same visual brand experience to all their subscribers, and the arrival of services like Google Fonts, which have made web fonts easier to implement.

What is the largest challenge you see when it comes to typography in emails? What is the simplest thing that our readers can do to evaluate their emails for better typography?

I’d say the largest challenge is still the temptation to use image embedded typography. In most cases, it’s not necessary. I’ve seen many instances where text has been embedded within imagery that could have easily been encoded into the HTML.

The simplest thing then, that your readers can do in evaluating their emails for better typography, is to ask the question, can I replace this image embedded typography with HTML typography? Are the fonts easily replaced with web safe fonts, or even web fonts?

Paul: While Harrods have used web fonts on their website, and web safe fonts on their email, they’ve still managed to capture the essence of their brand through the layout.

Can you tell us about your process for your newsletter? What have you been working on lately?

Type E: was born out of a desire to encourage email designers and developers to embrace HTML typography in email, to help them implement it, and tackle some of the more demanding or finer points of the craft.

Initially, I intended to publish it as a blog, but decided that the best method of helping designers and developers to grasp the subject matter, would be to demonstrate the techniques discussed, and so, I opted to publish it as an email.

What you’ll find therefore, in each issue, is that the techniques outlined have been integrated into the build of the email itself — I like to walk the talk!

In terms of the process, I start by thinking carefully about a specific topic to cover. I then research it, write about it, work relevant code examples and contextual explanations into it, and go over it again and again, editing and re-editing to ensure that I’ve clearly communicated why I’d recommend a particular approach, and that the tips for implementing it are clear and easy to follow. Finally, the email and code examples are tested before it’s sent out to the subscribers.

Type E: has evolved since the first issue, as I’ve made adjustments to layout and colour, and introduced different coding techniques. It’s still recognizable as the original Type E: and its core values remain, but you’ll certainly see that there’s been a change. Not being afraid to challenge and change why and how we approach email design and development is at the heart of Type E: I guess, and it’s demonstrated from one issue to the next.

My most recent issue is Type E: 07. The Mobile Issue, which looks at a combination of design and development techniques, as opposed to just development, which previous issues have been more weighted towards.

You’ll also see in this issue, the latest version of the Accessibility Switcher™, something I’ve been working on for some time, making its first appearance in Type E: 04. The Accessibility Issue.

Accessibility was always the next aspect of email design and development for me to encourage email designers and developers to embrace, after first embracing HTML typography itself. I delivered a talk, ‘A Type of Accessibility’ at the Email Design Conference in London, in 2015, at a time when accessibility was being talked about here and there, but not really being put into practice.

I decided to challenge the techniques that were being used at the time, and encourage designers and developers to use semantic tags, styling them with the ‘magic margin’ (style=”margin:0;”) so that email clients wouldn’t add excess space around them, a significant reason why semantic tags hadn’t been embraced at that time.

So, in Type E: 07. The Mobile Issue, apart from implementing standard accessibility techniques, I’ve also built into it the latest version of the Accessibility Switcher™, to enable subscribers to enlarge and reduce text at the touch of a button (on supported email and webmail clients), and also, as an option on subscription or through the preference centre, four colour tint views, for those who struggle with white backgrounds and underlined links.

Paul: Lego is a highly visual brand, but in spite of this they’ve still coded their email entirely with HTML typography, using the web font, Sansa Soft Pro.

What is the best place for email marketers to get started with typography?

Really Good Emails (😉) is a great resource for getting inspiration on how typography has already been implemented into email campaigns. I encourage the marketing team I work with to take regular visits there. I also recommend signing up to as many emails as possible from across all sectors, not just the one you work in. When it comes to implementing typography, Type E:, and A Type of Email are great places to start of course!

P.S. Get 25% off Paul Airy’s eBook “A Type of Email”. Enter code rge25 at checkout!

Paul Airy (Beyond the Envelope™) is a specialist and thought leader in HTML Typography in Email, and as well as writing a book on the subject, has spoken at the Email Design Conference, Boston (2014), London (2015), and at the Email Innovations Summit, London (2016).