Using a responsive email editor gives you the opportunity to craft great emails and for a while you also have the opportunity to include images – remember, Gmail displays them as default since the end of 2013.

How can you use this to your greatest advantage?

According to the study conducted by Edisonda if you embed your information in the visual in the header, recipients will notice it earlier. A lot earlier actually: the second version (see the heat map below) caught attention in 27,4 ms while the one placed below in 356,2 ms.

But this is not everything – you want them to process that information, not just see it.

If you use an image in the header and present your information below it, without any distracting visual background it will get more attention.

Their conclusion is that if you place your message on top of the image – to put it simply, if you use a banner in your mail – readers will unconsciously view it as an advertisement. Therefore it will get less attention, fall victim to the phenomenon we know as banner blindness.

edmdesigner<em>37</em>1Image source: Slideshare.net

Let’s make it clear: you absolutely can use visuals – as we will see in a minute they are great for catching the attention of the viewer. But If you have important information to present, clear all distractions.

Make your info stand out

Use placing, spacing, typography and contrasting colors – but don’t place it on a banner.

Are your visuals just dead weight?

Illustrations can serve you in numerous ways. It can give you more credibility, illustrate a product or guide the eye of the viewer to your CTA.

But you must use them wisely – otherwise they will be dead weight that pulls down the whole of your mail.

In a case study by TechWyse on a landing page you can see that while some of the visual elements were great in catching attention this wasn’t effective.

The most notable mistake on the page was the great red starburst which was noticed almost instantly. But it wasn’t a CTA or even linked – it was simply there to give some information. But it distracted visitors from other elements – among them the CTA – and thus had a negative effect on conversion.

edmdesigner<em>37</em>2Image source: TechWyse

This is exactly why you should be careful with using images portraying people too.

If you are posting is social media, faces are great for you: they stand out in a timeline, guide the attention to your post.

But the strength of showing faces to your audience can turn into a weakness in other context.

In a marketing email you have a limited amount of time to transmit your information. You want your recipients to notice the most important details and CTAs even if they just scan through the mail.

If you include an image portraying someone, that could hog much of the attention from all the other elements.

Just how powerful are faces? You can include a picture of a woman in revealing clothing or bikini and most people will still be fixated on their faces.

edmdesigner<em>37</em>3Image source: EyeTrackShop/Sticky

The conclusion is simple

Images are powerful tools to catch and guide attention, and if you have a good email editor and some creativity, you can use them to enhance your mail in great ways. But if you just throw in powerful images or overuse visuals you will experience a negative effect.

Distraction leads to less conversion. Keep it simple. Illustrate if you must, use images to create a great header, to give some atmosphere to your email – but don’t actively stop your readers from getting to the point you want them to be.

Author
Roland Pokornyik

Roland Pokornyik

CEO / Co-founder @ Chamaileon.io & EDMdesigner.com

  • HTML Email Development Tools HTML Email Development Tools

    Would you like to improve your HTML email development workflow and learn about new developer tools? This article series is for you.

    Read more
  • Git Branching Workflows in SaaS Development and the Review ASAP Policy Git Branching Workflows in SaaS Development and the Review ASAP Policy

    This article shows you a git branching workflow which helps developers to review changes frequently, leading to better code quality.

    Read more
  • Tabular Data Representation in Modern HTML Emails Tabular Data Representation in Modern HTML Emails

    Responsive tables are the most common ways to represent tabular data in HTML emails. Learn about the best practices and the card layout design approach.

    Read more