Is it true that newsletters in HTML should have a “table-based” layouts?

Question

I read somewhere that when creating a HTML email, you should use the table-based layout. You should not care about creating tableless css based layout. Is that true? I have

Answer 1

We've been doing some tests with customers on how newsletters look on their computer and found that a majority is using a layout in Outlook or in Mail that shows a width of only about 45 characters. They don't bother to double-click to open the email in a new window or scroll around. The emails with some content other than a logo and text that appeared somewhat better were the ones with only one big GIF...

Answer 2

There's certainly no standard that mandates it, and in fact, best practices dictate that tables should not be used for layout (except in the case of laying out tabular data).

There is an argument to be made for using tables in presentation, as there's no guarantee the plethora of desktop and web-based email clients will render CSS-based presentation properly... However, I wouldn't say that's an argument in-and-of itself.

Answer 3

I found outlook having problem with div based layouts.

Answer 4

This is probably more based on the reality of email client rendering (which is terrible) than anything else. Technically it's almost certainly wrong, but pragmatically it might be the best advice. Truppo touches on this.

Answer 5

I would love a world where no one expected HTML to be used where plain text would do, but that is not the situation. If your job is to come up with HTML that will not embarrass you when your subscribers try to view it in their favorite email clients (applications or web based email), it is hard to stick with semantic markup and CSS.

Take what I am saying with a grain of salt because I have only done this as a learning exercise and not professionally. Based on an article I had bookmarked and further links I found in that article, the following pages seem to have a good discussion of the real issues involved in sending HTML email.

http://www.sitepoint.com/article/code-html-email-newsletters/

http://www.sitepoint.com/article/principles-beautiful-html-email/

http://www.sitepoint.com/article/designers-guide-html-email/

Given the issues involved, using tables for layout makes practical sense.

Answer 6

The reason tables are used is two-fold:

1. HTML e-mail can be rendered in a vast array of clients with widely differing abilities. It's like trying to design a website for every browser, then multiply it by 10.
2. Quite a few web e-mail clients play havoc with CSS layout.