I am a newbie to HTML coding and am working on HTML emails. Recently I came to know that many of the email clients strip out the images put in the background in HTML email for security reasons. But what are these security reasons? What type of security threat can a background image possibly hold. Thanks in advance to anyone who helps out.
-
1Have you tried embedding the images? I think they may be blocking "external resources" more than "images" .... I recently had good success with base64 image embedding. See this SO question on the topic.. http://stackoverflow.com/questions/1207190/embedding-base64-images – Louis van Tonder Jul 24 '14 at 07:02
-
if the image actually isn't an image, if it's a script? – sevenseacat Jul 24 '14 at 07:03
-
also, users can block images in email. If it's a background image, how can they do that? – sevenseacat Jul 24 '14 at 07:09
-
@LouisvanTonder No I haven't tried that. Just started with HTML emails. Will surely check it out – abhinav Jul 24 '14 at 07:31
-
Great. I am sending some basic HTML invoices through email with an embedded logo, and haven't run into problems yet.. albeit no background images. – Louis van Tonder Jul 24 '14 at 07:39
3 Answers
It's because most major email providers have a web browser mailbox, so they often disable 99% of CSS so it does not change the styles and the overall structure of the mailbox. The idea is that if too much CSS is provided, then it could override the styles of a web browser email layout.
Good rule of thumb is to "code like it's 1996."
Here's a great resource: http://kb.mailchimp.com/article/how-to-code-html-emails/
Also, to solve your problem, use an img tag with an absolute path to an online hosted image.

- 1,355
- 15
- 25
-
Yes I know that we have to play with inline css and have to code the whole thing in tr td tags but what I want to know what are the security reasons for which these images get blocked? Changing the layout in the browser can be one of the reasons but what main security breach can a background image cause? Thanks – abhinav Jul 24 '14 at 07:38
Emailers do not display background images and this has always been a concern. At possible places you could use images. At the bottom of the emailer you can also give a link to access your emailer as a HTML page if the mail client has blocked images. Check this link also: http://backgrounds.cm/
In the above link there are solutions to display background images for the entire emailer body or for a particular table cell only. This will work to an extent.
Best thing would be to have background colors and a good typography for emailers.

- 7
- 1
Yes, most of the CSS style would be supported in mailer email client. All email clients have their own restriction and the way they support CSS property. Here is few golden rule
1) Always write inline CSS styles
2) Always use to construct the emailer
3) Try using attribute as much as possible.
4) Use HTML elements "attributes" like "title", "alt" so if images are block still user can see the description about image and allow image to download.
Here is CSS support info https://www.campaignmonitor.com/css/

- 693
- 7
- 22