Can you use PNG’s in HTML emails?

{title}A brief post by Laura Atkins on the Word to the Wise blog today reminded me that some versions of Lotus Notes still didn’t support the display of PNG image files in HTML emails. I remember this coming up in our tests a while back, and always wanted to follow it up but never did.

Today I created a quick test email that included both an 8-bit and 24-bit PNG image and ran it through multiple versions of Lotus Notes using our design and spam testing tool. The results weren’t pretty. Turns out that both 8-bit and 24-bit PNG’s are displayed as nothing more than broken images in Notes 6.5.4 and Notes 7. Thankfully, Notes 8 did offer full support.

So, should you use PNG images in your email campaigns? Up until now, that was probably a big no because you never knew how many of your subscribers might be using Notes 6 or 7. Thankfully, our new email client usage reports make that a thing of the past. So, if you’ve checked your most recent campaign and can see little to no Notes 6 or 7 usage, then you’re free to use the often superior PNG format for any images in your campaigns.

Posted by David Greiner

5 Comments

  • Jon Livingston
    5th March

    Nice reminder. Was developing a new newsletter, using the PNG format, and got your tweet. Perfect timing.

  • Jake Holman
    6th March

    Even PNG-8 with Transparency is pretty well supported - it uses one colour as the transparency just like GIF does, and often yields better quality.

    Be careful with PNG-24 with Alpha Transparency. If you’re sending out to a lot of businesses with Outlook then it’s likely they’ll not only be using a pre-Outlook 2007 but probably Internet Explorer 6. The problem here is that anything below Outlook 2007 will use the Internet Explorer render engine (which ever version you have on your PC) and because IE6 has NO support for Alpha Transparency at all, you’re going to find that some very odd things start happening when it displays in your emails.

    My advice would still be to try and avoid alpha transparency with PNG as much as possible.

  • David Greiner
    6th March

    Great comments Jake, and that’s a very good point about older versions of Outlook using IE6 for the rendering engine (like Outlook 2000), so if you see a percentage f them in your list perhaps 24-bit PNG’s should be avoided altogether.

  • kephri
    6th March

    My advices after my background, would be the following ones :
    - PNG, GIF, JPEG are standards compatible with 100% browsers; still, avoid if possible transparent ones that does not fit fit into this category, and for old-school clients like Internet Explorer, don’t use png (this high-end format is still too new for MS$ after 4 years of GPL :p)

  • Adil Baig
    7th March

    Thats very useful Jake. Thanks.

    Having worked with CSS issues (and issues and issues ..) with IE 6 i can say that it DOES support alpha transparency for PNGs. But you will need to enable the PNG Active X control. Something like so :

    _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=‘path/file.png’,sizingMethod=‘scale’);
    _background:none;

    24 bit PNGs are supported too.

Sign up for free.
Then send campaigns for as little as $9/month

Create an account