html emails – css+divs or tables?

I’ve just been reading David Greiner’s HTML Emails – Taming the Beast article on the Vitamin website. Its a great article and makes some good points, especially for those who are just about to torture themselves for the first time by creating a html email campaign!

In the article, David makes a case for using css within html emails (although to be fair, he does discourage using css positioning for layout), drawing an analogy to the tipping point in the browser market a few years ago where it “sort of” became acceptable to live the style/substance dream of separating presentation (css) from content (html) around the time that Netscape was on a life support machine. He links to a list of css properties that are currently supported by the major email clients and suggests “coding to your target audience” in other words, if you can guarantee that every single recipient will read your message in Outlook Express then go ahead and use css to the max.

Ok, in the real world, how can you possibly know what mail environment your customers will read your message in? You can’t do it by analyzing the recipient list, my mail address for example just goes to an ordinary domain name, but (by means of mail forwarding), I read my mail in GMail, there’s no programatic way to discover what mail client somebody uses. Its also not practical (or possible) to “send” different versions of the message for different environments as was often done in the early days of css for browsers. I really don’t think its practical or possible to “know your audience” in the same level of detail that can be achieved with web analytics and web pages.

Its my belief that the only way to achieve a successful mail campaign that will work across the board is by using tables and the bare minimum of inline css. Don’t get me wrong – I’m a big advocate of css and xhtml strict for web pages (view source on this if you don’t believe me) but I really don’t think the time has come to use these “cutting edge” technologies on something as frail and unpredictable as html email messages.

Oh, and one other thing learned from experience. When you’re building your emails using html tables, don’t put your inline styles into the <table>, <tr> or <td> tags as most webmail clients will remove style=”" attributes from these tags. I don’t know why – but they do!

This entry was posted on Monday, June 26th, 2006 at 1:06 pm and is filed under xhtml. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.