Electronic mail design lives or dies by the small print. One apparent element is the topic line. One other is the e-mail header. Each of those components present vital first impressions. One comes earlier than an electronic mail is opened and the opposite instantly after.
As soon as your topic line entices your subscribers to open your electronic mail, your electronic mail’s header is the very first thing your readers will see. As such, your electronic mail header has to hook your subscriber, so that they’ll learn the remainder of your electronic mail.
We’ll talk about what an electronic mail header is and its components. We’ll additionally share 5 suggestions for designing electronic mail headers.
What’s an electronic mail header?
 First, let’s clear up some doable confusion round related phrases. In HTML electronic mail templates, the header usually refers back to the chunk of code enclosed within the <head> earlier than the <physique> factor. The <head> or header consists of particulars like your electronic mail authentication signature and CSS stylesheet. This code is often invisible to your readers.
However that’s not the form of electronic mail header we’re speaking about right here. As a substitute, we’re specializing in design components that seem on the prime of your electronic mail.
Try this pattern electronic mail:
This electronic mail header instance consists of the Google emblem and the Google Analytics emblem. This offers the reader an concept of who the sender is and what to anticipate from the e-mail.
Beneath the header is the physique of the e-mail, which encapsulates the primary message and content material of the e-mail. On the backside, the e-mail footer rounds off the e-mail with hyperlinks to the Google Assist Heart and the Analytics discussion board.
The header is a superb place to incorporate vital data in your subscriber. Point out to your readers what to anticipate out of your emails at a look.
What are you able to embrace in electronic mail headers?
There are various components you possibly can embrace in an electronic mail header. Try our record of 5 elements you should use to design your electronic mail headers:
- Emblem
- Menu
- Countdown
- Name-to-Motion (CTA)
- Social media icons
We’ll dig into these elements and a few of the well-designed electronic mail headers we’ve seen beneath. Within the following part, we’ll overview some greatest practices when utilizing these electronic mail header components. One in all our prime greatest practices is straightforward: Don’t overdo it! One factor per header could also be lots.
1. Emblem
Advertising is all about model recognition. Don’t miss the chance to get your organization emblem on the market as quickly as your subscribers open your electronic mail. It’s good to ascertain your model’s authenticity as quickly as doable. Don’t let your readers have a shred of doubt concerning your electronic mail’s sender.
Nonetheless, this doesn’t imply you could embrace a big, overpowering emblem. As you noticed within the final instance, Google Analytics retains headers good and easy with the Google emblem and Google Analytics emblem.
Pay attention to readers utilizing darkish mode and the way it’ll have an effect on your electronic mail. For instance, the black from most logos might disappear when a subscriber views an electronic mail in a darker interface. Altering your header picture to work in each gentle and darkish mode is one option to keep away from this problem. Discover out extra in our put up on darkish mode emblem issues.
2. Menu
Menus are a good way to drive site visitors to your ecommerce internet web page. They complement your CTA by creating outlined subcategories in your subscribers to navigate. Try how Adidas does this:Â
They replicated the menu bar on their internet web page to concurrently create a sense of familiarity and funnel clicks to their web site. In case your electronic mail headers embrace a menu or navigation bar, attempt to design them to look as very like your web site as doable. That method, you’ll present a extra constant expertise to subscribers who click on by way of.
3. Countdown
Countdown timers are a well-liked option to make electronic mail campaigns dynamic. They create a way of urgency that may encourage your subscribers to take motion earlier than time runs out. Improve your click-throughs and conversion charges with an simply seen countdown timer on the prime of your marketing campaign.Â
Look how Casper pairs a easy menu with a countdown timer to assist subscribers navigate the trail to buy:
4. CTA
Don’t underestimate the facility of a CTA. In case your aim is to drive clicks to your web site, why not embrace a CTA entrance and heart in your electronic mail header? Make it the very first thing your customers see, identical to Moschino did with their deserted cart electronic mail:
They convincingly used an electronic mail header picture with their CTA.
5. Social media icons
Use social media icons in your electronic mail header to encourage subscribers to turn into followers as nicely. Let’s say you’ve all the time engaged along with your subscriber by way of electronic mail. How about redirecting them to your Instagram account? Discover new methods to start out conversations along with your subscribers. Since subscribers are already conversant in your model and your content material, many might be pleased to turn into a part of your social media viewers too.
5 suggestions for designing efficient electronic mail headers
Moreover solely utilizing one factor in every electronic mail header, we’ve got a couple of different suggestions. Now that we’ve addressed the fundamentals, let’s have a look at 5 greatest practices for electronic mail header design:
- Play with colours
- Use animations, GIFs, or photographs
- Customise however be constant
- Maintain it readable and accessible
- Use email-safe fonts
Let’s dig into every of those beneath.
1. Play with colours
We’ve talked in regards to the significance of growing a visible model id. Use colours in your header to border your electronic mail along with your visible model id. Maybe you’ll select contrasting colours to assist your message pop or select out of your trusty model palette.Â
Both method, colours inform a narrative and enable you to interact along with your subscriber base! Bear in mind to outline electronic mail header colours and different formatting in your electronic mail design system.Â
2. Use animations or photographs
As we noticed within the Moschino instance, a well-chosen picture or GIF could be a highly effective, eye-catching software to enhance your buyer engagement. We’ve talked about how photographs can supercharge your emails. Why not put them within the header and set up your visible model id up entrance? In fact, don’t go overboard with animations or photographs. You need to make a press release to interact your consumer – not create litter that stops them from studying the remainder of your content material.
3. Customise however be constant
The e-mail header is an area so that you can play with the way you introduce your model. Every time subscribers open your electronic mail, they make one other connection along with your model. You may need to use a barely totally different header when concentrating on prospects throughout the Halloween season versus New Yr’s. Nonetheless, whereas it’s good to maintain your content material related, you additionally need to maintain your content material constant.Â
Make it straightforward in your customers to acknowledge your model at a look. Should you’re sending out a month-to-month electronic mail e-newsletter, you need to maintain the e-newsletter header contemporary however recognizable as a part of a collection of emails out of your model.
4. Maintain it readable and accessible
If you select your colours and design your header, keep in mind to pick out colours that make your textual content pop for each regular-vision and low-vision readers. Accessibility is essential to partaking your subscribers. In case your electronic mail header consists of vital data, add it as reside textual content and never a graphic. That method, display readers will interpret and skim again textual content to subscribers with imaginative and prescient impairments.
5. Use email-safe fonts
The e-mail header is a spot to let your creativity shine. Nonetheless, don’t sacrifice accessibility or deliverability for creativity! Use email-safe fonts when coding your electronic mail header templates to make sure your readers can view your message precisely as you supposed.Â
Wrapping up
Electronic mail header design is a good way to create a constant and memorable inbox expertise in your subscribers to showcase your model.
Are you aware if each mailbox supplier shows your electronic mail header design as you supposed? There’s one option to know for certain: Preview your emails on dozens of in style electronic mail shoppers and gadgets.
At Electronic mail on Acid by Sinch, we wish to say that good mail isn’t nearly a very good design – it’s about testing your emails to make sure they work for all of your subscribers throughout their numerous electronic mail shoppers and gadgets. Should you’re prepared to start out, head to Electronic mail on Acid and check out our electronic mail testing instruments for seven days free of charge.
Simplify the Electronic mail QA Course of and Ship Perfection
What’s one of the simplest ways to run by way of your pre-send guidelines? With Electronic mail on Acid’s Marketing campaign Precheck, we’ve simplified the method and set every little thing up for you. Use it to double-check your content material, optimize for deliverability, guarantee accessibility, and preview how campaigns look on greater than 100 of the preferred shoppers and gadgets. All earlier than you hit ship!
Writer: The Electronic mail on Acid Workforce
The Electronic mail on Acid content material staff is made up of digital entrepreneurs, content material creators, and straight-up electronic mail geeks.
Join with us on LinkedIn, comply with us on Fb, and tweet at @EmailonAcid on Twitter for extra candy stuff and nice convos on electronic mail advertising and marketing.
Writer: The Electronic mail on Acid Workforce
The Electronic mail on Acid content material staff is made up of digital entrepreneurs, content material creators, and straight-up electronic mail geeks.
Join with us on LinkedIn, comply with us on Fb, and tweet at @EmailonAcid on Twitter for extra candy stuff and nice convos on electronic mail advertising and marketing.
