Outlook 2007 stationeries and image spacing

by Christoph Herold 14. Dezember 2008 23:50

Today, I had to make a template for a mailing. I decided to create it as a stationery for Outlook, since this was the desired way of sending the mails. Not much to it, one might think. I created the HTML for the template (of course using the dreaded layout tables, since OL2007 went back to the stone age with its rendering engine), and copied it and the required images to the stationery folder. Having done that, the stationery showed in my list and I was able to create a mail using the template.

But what's this?! Were do the gaps in between the images come from?! And why are my shadows not aligned anymore?! Outlook simply went on and pratically destroyed my layout. I basically tried everything that came to my mind, trying to fix the gaps: modified paddings and margins using css, html attributes, added fixed widths and heights, nothing seemed to work. I even removed all the tables and simply placed two images after one another, no white space in between. Still, I got my gaps.

When everything seemed hopeless, I decided to simply send the mail the way it was. Guess what: everything is in perfect shape, when the mail arrives. No gaps, everything is aligned perfectly. I can even simply forward this mail, and it looks great in the editor. So the gaps only show, when you first create the mail using the stationery. Afterwards, everything is as it should be.

<rant>Now that's what I call a consistent user experience! Great job from the folks at Microsoft. I wasted a whole day trying to work around this bug.</rant>

And by the way, using stationery is probably not the best solution, since Outlook completely reformats your code and places all those unneccessary MSO* css styles in your mail's code. So if something goes wrong with your mail, you might consider NOT using Outlook to send it in the first place.

Tags: , , ,

Design

Outlook 2007 HTML-Mail Guidance

by Christoph Herold 25. Juli 2007 11:12

Microsoft changed the rendering engine in Outlook 2007 to Word's HTML-engine, and it really sucks concerning modern design habits (css-positioning, etc.). So you have to look out for some pitfalls. I found a nice guide for designing HTML-Mails for use in Outlook 2007, which can be found at http://www.duoconsulting.com/downloads/contribute/SevenDesignTipsforOutlook2007.pdf.

Also, Microsoft offers tools to validate HTML files for the Word rendering engine. These can be found at http://www.microsoft.com/downloads/details.aspx?familyid=0b764c08-0f86-431e-8bd5-ef0e9ce26a3a.

So, good luck with your e-mail marketing ;-)

Tags: ,

Development | Design

Month List

Impressum (for the Germans)

Christoph Herold

Dieses Weblog wird bereitgestellt und verwaltet durch

Christoph Herold
Ignaz-Semmelweis-Str. 37
41540 Dormagen
Deutschland

Sie erreichen mich unter christoph.herold@coeamyd.net.