What Makes a Great HTML Email Template?
Email marketing is lucrative, but the pressure is on to stand out in an inbox. One of the best ways to get attention (and results) is to deliver visually stunning, modern, original-looking emails. Using, of course, HTML.
But what happens when you don’t have the resources to code custom HTML emails?
Fortunately, you can create HTML emails that stand out, improve retention, and drive conversions… without tons of time or in-depth HTML expertise.
Here’s how.
What makes a winning HTML email template design?
To create amazing HTML emails, you must know what your end goal is. In other words: What makes a good HTML email?
Responsive design
Responsive design means that the email will look great no matter what size screen it’s being read on. Usually, responsive design is needed to ensure that email design looks just as good on mobile screens as it does on desktop screens.
If you don’t have time to create two different designs (one for mobile and one for desktop), then choose mobile. Mobile design will look good on desktop, but desktop design doesn’t always render well on mobile. And with 47% of people across all demographics checking email on mobile, it’s vital that your mobile email design is perfect.
Designed for each screen size
If you do have time to create different designs for each screen size, then we recommend you do. Create at least two different wireframes: One for mobile and one for desktop. If you have lots of time, you could create a third wireframe for tablets.
Here are our best practices for designing for different screen sizes:
Designing for desktop screens
Designing for desktop allows you to be versatile because the screens are spacious. Choose from the design options below:
Inverted pyramid design, with wider content at the top tapering down into a single call-to-action
Single-column design, with all content at the same width down the screen
Two-column design, with one column text and the other column images
Designing for mobile screens
Mobile screens are much smaller and narrower, so design choices are more limited. Here are our recommendations:
Single-column layouts (more than one column will render too small on the narrow mobile screen)
Links/buttons at 44 x 44 pixels (so they are clickable with a finger tap)
Simple design and brief content (too many design elements can overwhelm a mobile screen)
Consistent branding
No matter how beautiful an email is, if it doesn’t match the rest of your marketing, consumers will be confused.
Use the same brand colors, fonts, logos, images and design style when designing HTML emails.
Luckily, our new Branded Templates make this simple and easy. Simply input your website URL and Campaign Monitor will pick out your colors, logos, and fonts to include in one of our unique templates, meaning you can send your first email even faster.
Correctly sized images and content
Choosing the wrong size images can have them bleeding off the screen, and incorrectly sized content might be unreadable and cut off at the edges.
HTML gives you plenty of freedom, but you should stay within the following parameters to ensure readability:
Stay within 600 pixels for the width of your content for most emails
Stretch to up to 640 pixels for the width of your content to have a bold look
Stretch background images or color blocks to full-width if it is okay that some email clients cut off the edges
Optimized subject lines
Before subscribers will see your beautiful HTML email, they must open it. And with inboxes crowded with marketing emails, it’s crucial that your subject lines drive open rates.
Our best practices for email subject lines are the following:
Aim for 41 character length
Personalize the subject line (sometimes–not always)
Instill urgency
Ask a question
Interactive elements
Interactive emails are those that invite the reader to directly engage with the email by tapping on an image to reveal text, taking a quiz, using a calculator, or more.
Not surprisingly, interactive emails are on the rise because of how well they drive engagement. We recommend incorporating interactive elements into your HTML email to delight your subscribers and stand apart from the competition.
Why interactive HTML emails are best
For marketers who want to make a splash with their emails, interactive HTML emails should be the focus. Here’s why.
Interactive emails help you stand out in an inbox
The average office worker receives 121 emails per day! It’s crucial that marketers create emails that jolt customers into paying attention.
Interactive elements are a great way to do this because while the trend is growing, it’s not yet a “given” in customer inboxes.
In 2017, the Content Marketing Institute surveyed marketers and found that 46% were using interactive content in their marketing. That was a 79% increase from 2016, and probably even more marketers are using interactive content now.
But in that same survey, the vast majority of marketers reported that they were using interactive content in websites, social media, and blog posts–not email. So, implementing interactive content in your emails sets you ahead of this trend and enables you to stand out.
Interactive emails drive engagement and conversions
Interactive content is built to drive engagement. Who can resist taking a fun quiz, especially when you don’t have to click out of the email?
The data bears this out: Interactive content consistently gets twice the engagement of regular content.
As people engage, they become more invested in your content and brand and will be more likely to not only open more emails from you, but also convert into paying customers. In fact, interactive content gets 3x more conversions than regular content. Additionally, 82% of consumers reported that they are more likely to click a link in an email if it has interactive content.
Interactive emails provide more insight into subscribers
Every time subscribers engage, they make a choice, which reveals something about what they want. A high open on an email suggests that the subject line worked well, for example.
But interactive content goes further: It often directly shows deep-level information about subscribers by asking for information. For instance, interactive content like quizzes, surveys, and calculators require subscribers to answer questions or input information. Marketers can then use that information to segment lists, curate content, or promote new launches.
Wrap up
Interactive HTML emails are a must for any marketing team. For smaller teams—especially if that “team” is just you—interactive HTML elements help you compete with even the biggest businesses in your industry.
Just remember:
HTML email is a must-have in marketing, but interactive HTML emails is where to focus to drive engagement, improve conversions, stand out and compete with larger brands.
Interactive HTML can seem intimidating for smaller companies without a huge email team, but using tools makes it easy.
Interactive elements can also be simpler than you might expect, like adding a video into your email or animating buttons.
You can eventually experiment with more complex entertaining options like games!
To get started building interactive HTML emails today, check out our HTML email templates builder.
