[This blog was originally posted on
Background images are like an icing on the cake in marketing emails. You have worked hard on the content of the email, now if you back it with an awesome email background image that has a close connection with either your brand or the content of your email, you are adding to the chances of getting better conversion rates.
Why Email Background Images?
Our brain can process visuals at an incredible speed of 0.013 seconds. Another research reveals that 92.6% people say that visual dimension is the primary factor affecting their purchase decision. Thus, brands often rely on product images and graphics to generate interest in marketing emails; and adding background images is one such powerful tool used by them.
This design technique is applied well in the world of web but, unfortunately, as far as emails are concerned, marketers are still reluctant to use this really appealing marketing tool. Why?
The main issue with adding a background image in email is that it is not supported across all email clients (image blocking). So, if you wish to create that wow factor with background images in email template, you need to know which ESPs will support your images and which will expect you to go the extra mile to make sure your design appears just the way you want it to.
Email image blocking is a result of many email providers’ default settings or personal preferences provided by them. Blocking might hamper your marketing campaign and even fail to make an impact on prospects- with possibilities of leaving a rather bad impression.
An improper text-to-image ratio (which is not 80:20) can be catastrophic for your email campaign, if the email client blocks your images. Best Practices to follow for Perfect Text-to-Image ratio in emails >>
So, let’s focus on a tool that will help your email background template to render across all email providers – well almost all.
How to Add Background Images – A Bulletproof Tool
The prime culprit seems to be Outlook 07/10/13, which does not support either table background email images or background-image styles. Campaign Monitor’s bulletproof background image technique can be a good solution to this problem. Make sure you check whether your ESPs support VML (Vector Markup Language) coding if you have a single whole background image for your email. But just in case you are repeating the image, you can apply that in body and top table tag with repeat property and it will render in Outlook 7, 10, 13 even without VML code.
You can check it out at backgrounds.cm
Here, you get an option of applying email template colorful backgrounds to entire email as well as table cells; and you can generate a code for both scenarios.
The only issue that might arise is the size of the image. In case Outlook 2000 and above considers your image to be too big (size or dimensions), it might crash. So before you go for html email background image, it is very important that you check whether your images are sized correctly, Also, test your email in live copy of Outlook.
To be on the safer side, it’s always good to have an ALT text for your images. Include the dimensions of your image – the width and height of your email image gives your ALT text a display container when images are disabled. If you do not mention the dimensions, some email clients collapse that area and off goes your ALT text too.
Another option that can be considered in case the image doesn’t open in emails is to set a background color as a fallback. This will ensure that, even if the background image doesn’t show, the content of your email is readable against the fallback color.
The WOW Factor
Let’s take a look at some interesting emails with awesome background images that grab eyeballs.
Salesforce‘s event promotion email has a illustrative background image with text in foreground in such a way that the attention is divided equally.
Popular ridesharing app Uber‘s email is a visually attractive email owing to the fact how the background image merges well with the text and the styling is continued across the entire email.
National Geographic is famous for making bold statements through their photographs and the message was similarly conveyed here in this email where the heading matches the background.
Athletic apparel retailer UnderArmor has beautifully placed the text over images alongwith actionable CTA copy for the subscriber to take heed. Learn how CTA copy in email helps in conversion.
By fading the images to sync with the text, this background image in email HTML by AMC Stubs has made the copy pop-up very well.
BLANCA Resort and Spa
This email from BLANCA Resort and Spa gives a real feel of the resort through the background images in table cells (not full email body). The resort conveys the ambiance and facilities they provide in an impressive manner.
Nature Baby sends out an email to announce a 30% sale. The email design is enhanced with a tiled background image.
- Visual dimension is the primary factor affecting purchase decision
- Background images can thus help in conversions
- Images aren’t supported across all email clients, especially Outlook
- Test your email background image in live copy of Outlook; big images may crash
- Add an ALT text for your images
- Mention the size of the image; your ALT text will reside in that frame
- Set a background color as a fallback