Email Header Best Practices

Stripo.Email
Stripo.Email
Published in
8 min readJan 22, 2018

Marketing process is a complex thing. You need to motivate the target audience to open a message, to read it and then finally commit a purchase.

If your value proposition is interesting and generous enough, but the CTR level is very low, then you should probably change the design of your newsletters.

Where to start? Start with the header, as it is what the clients see first. Precisely by header they judge whether the message is worth reading to the end. And if the recipients find it boring or weird, they simply delete the message with no regrets.

We have gathered and analyzed lots of useful information on how to create a great email header. And now we want to share the best ideas with you.

So, let us be consecutive.

Header consists of two stripes: a header itself and a preheader.

Pre-header

A pre-header, also known as a pretext or a snippet, is the smallest and the least noticeable element of an email.

A pre-header is not supposed to contain any images or photos. An informative preheader notifies the customers about the purpose of an email and is displayed in an inbox along with the subject line. When receiving an email, according to Litmus, 24% of the recipients judge by the preheader whether to open the message. Do not neglect the preheader, never omit this part.

Everytime I receive an email from Campaign Monitor or the Quora Team, I know without opening it, what it will be about.
“Guest post from Zembula” sounds great.

This is what it looks like when I open my email:

Some companies insert their sale offers into the pre-header which brings them clicks.

When there is no pre-header in your email, the recipients will see the alt text — the very first text of the message. Don’t miss your chance to use an opportunity to increase your CTR.

Note! For a proper display of a pre-header, keep it to 50 characters.

Header

A header, as we already mentioned, is the face of your company. Let it be a good-looking and attractive one. Once we have opened the message, we judge by its header whether to read it to the end or delete.

There is no single rule what a professional email header must look like. It all depends… But we will provide you with a big number of email header design ideas.

You can create either one single header and use it for all your emails or create different ones for special occasions. But any header, in order to perform its mission — make us read the message to the end — need to be enchanting and beautifully built.

Ways to design an email header

Company name and logo

As a rule, a company’s logo includes the company’s name.

If your company is pretty new to the market, and people are just getting acquainted with you and your products, then do not forget to add your company name. As the company name is the thing the clients recognize you by. Insert it in all emails, no matter if it is a trigger email or a promotional one.

But when your company is world famous, and you are sure that everyone is familiar with your logo, then you may just omit the name of the company and put just the logo.

Note! Logo’s background should be transparent in order to match the message color theme.

Menu

Header can be not only informative and introductory, but also functional. Menu helps navigate your clients and lead them to your website. Or you can do it like Adidas did. They added a Store Finder. Brilliant idea. I choose the shoes I need on their website and then go to an offline store nearby, the company found for me, to try them out. Great service. Thank you!

Useful information

Cosmetics company Anabel placed their value proposition in the header. Interesting decision. I could not have missed it. For more detailed information I had to follow the link.
Take a look at this great email header example: see how Anabel online store does it.

The Filmmaker company has not changed their header in a while. It usually contains general information on the benefits and discounts you receive if you subscribe to their magazine.

Good way to advertise your product if the newsletter is only informative.

Call to action

The most important information of a message can be displayed in a header. As this is the first thing we see, we can use the call to action button and go to your website or login to our account.

Grammarly sent me a weekly report with “Visit my Editor” button right in the header. I did not have to leave my messenger, go to their website and log into my account. But as I certainly wanted to view the report with my most frequent mistakes, I clicked on the button.

Note! Make sure you add all the necessary links to the menu and CTA buttons.

In order to add a link to the menu tab with Stripo editor, you need:
➢ to click on the tab you need;
➢ on the tool panel you will see its name;
➢ insert the link;
➢ choose link color;
➢ click on any empty name in the editor;
➢ done.

Social net links

Why not to go against the system? If you want to stand out, why not to place links to your social nets accounts in the header? Pretty unusual, but quite notable. Especially, if your main goal is to gather subscribers.

Ways to enliven a header

GIFs in header

Want to make your header animated? Do it. Make sure the image size is less than 2 MB, because most of your customers read their emails on the smartphones. In case it takes long for a message to download, people just close. And only some get back to it when they have good internet connection. Either let some letters in your company name interchange or you can animate the whole header.

Play with colors

How to design header for an email just by playing with colors?
Do not hesitate to change them, especially if they do not reflect the brand colors.

Or in order to make the clients pay attention exactly to what you need, you may highlight some tabs in the menu or choose another font color precisely for this tab.

Read how to do it with Stripo.email.

Decorative design for special occasions

Christmas holidays, Easter, Thanksgiving or Valentine’s Day? Make the email newsletter header design festive. Now, you do not need to change anything, no need to look for new colors. It will be reasonable just to add some thematic decorations. Eggs for Easter, hearts for St. Valentine’s day and snowflakes for Christmas.

This is a perfect example of email header design:

Decorative Fonts

A good festive font will enrich your email header design. Use your imagination, get creative.

Important to make all the fonts legible.

Note! Some fonts are not correctly displayed by the email clients or on mobile devices. Here is the list of web-safe fonts.

Note! Any font disposed over any image will be correctly displayed on any device.

Frames

If you are quite conservative, or if you already use a few brand colors, then adding frames will be a good solution for you. They may be transparent, of any color and of any shape.

By the way, they will help you elegantly emphasize the most valuable information.

Note! Stripo.email offers a wide range of various frames, located in an “Additional images” block.

Create a complete card

This is sometimes a good idea to create a newsletter which looks like a single card. Do it for special occasions. Of course, here you will need to combine separate blocks with matching tones and colors. But the result is worth the efforts.

Nike, Airbnb and many other famous companies do not create special headers for their promotional newsletters. They place their logo right on a banner.

Interesting decision if you do not intend to add a menu to the header.

Conclusion

As you can see by the number of various examples of email header design, you are absolutely free to do what you want to. You are welcome to be creative.

But here are some tips to make your headers not only creative, but selling and effective:
➢ Pre-header is a very essential part of a newsletter.
➢ Insert logo.
➢ Play with colors.
➢ Decorate headers for special occasions.

All of our Templates are bright, creative and functional. Feel free to use them.

I sincerely wish you best of luck in all your future endeavours!

--

--

Stripo.Email
Stripo.Email

Create professional and responsive email templates fast without any HTML skills!