Image Tag vs Background Image

[Anonymous]

#MarketoNewbie here...

Can someone help me understand the difference between uploading an image tag vs a background image?

I'm having issues with images in emails becoming distorted in Outlook on a PC vs Outlook on a Mac/iOS device. It seems to be fine on a Mac/iOS. I found this Q&A and just need some extra clarification...

Q: Hi Marketo Nation I need some help. I've designed a branded email template using one of the 2.0 email templates. Everything looks fine in marketo and on any MAC os version of outlook but when it is opened in any version of the PC version of outlook the styles get stripped and more importantly the header image gets distorted and squished. It also strips the style on the template that has a round circle BG shape and turns it into a square.

A: You have to resize the image according to the email width for all the email clients. Example: If you have created the email having the width 600px. Then the image banner will also be in 600px. Also, for the best practice, we use the image in the image tag rather than the background image.

Thanks!

[Michael_White]

Hi Danyelle,

I think the point that answer is getting at is that with HTML Email, you're going to get more consistent results using an <img> tag than you would using a background-image property to set your image.  It's essentially the difference between this:

<img src="logo.gif" alt="Our Logo" height="50" width="50">

and this:

<td style="background-image: url('paper.gif');"></td>

The latter attribute is extremely common in webpage design, but has limited support in email clients.