Email marketing assumptions: Emails have to be designed with tables

Over the last few weeks, we’ve been revisiting some common email marketing assumptions to see if they still hold true in 2021. We’ve discussed single vs. double opt-in and the existence (and importance) of the fold. But today, we’re digging deeper into something so foundational to email marketing that it, quite literally, is used to build virtually every email in existence.

That’s right, we’re questioning one of the longest held beliefs in the industry:

All emails have to be designed with tables.

Why do emails use HTML tables?

For anyone not familiar with the basics of coding emails, nearly every marketing or transactional email is coded using HTML tables. Tables are a feature of HTML that allow designers and developers to code tabular data into web documents—or emails.

It all started on the web

Although tables weren’t officially introduced into the HTML spec until 1997, they’ve been implemented since the early 90s. An early version of Mosaic (which later became Firefox) allowed designers to code tables in 1993. As the World Wide Web became more popular, tables were commonly used as a way to lay out pages of content—despite being originally designed for tabular data (imagine a spreadsheet).

By 1996, table-based layouts were commonplace and became the de facto standard for designing web pages. Products like Microsoft Frontpage and Adobe Dreamweaver made creating table-based designs accessible (but hardly accessible).

It wasn’t until the web standards movement and the introduction of Cascading Style Sheets (CSS) in the early 2000s that tableless layouts became more popular. Today, with the massive power of CSS, modern designers and developers have (rightly) moved away from using HTML tables to build web pages.

CSS support for email was limited

However, tables are still predominant in email design.

This is due to the fact that, until recently, most email clients—and the rendering engines they use to display emails—had limited support for HTML and CSS. Most didn’t respect the positioning tools CSS uses, so table-based layouts tended to look better in various email clients.

Email clients have come a long way since the 90s, though, and email design techniques have as well. Today, it’s not uncommon to see beautifully designed, accessible, interactive emails on both desktop and mobile. But back to our main question…

Do all emails have to be designed with tables?

This is where things get tricky. Back in 2015, we wrote about why web and email design are different and concluded that tables were the only solution for coding emails. Today? The answer isn’t a simple “yes” or “no”—it’s “kind of.” Let me explain:

Email clients have evolved

A lot of email clients have evolved with the web and have excellent support for CSS—including things like the sizing and positioning of elements on a screen. If you want to see which email clients support what, there’s no better place to do it than CanIEmail.com.

In the last few years, we’ve seen the rise of responsive design and hybrid email coding. Hybrid coding, in particular, is a modern way of building emails that takes advantage of CSS’s positioning and sizing tools and reduces the reliance on HTML tables.

Except for Outlook (mostly)

Unfortunately, some email clients have been slower to evolve. And some organizations have been even slower to update their software, meaning older, out-of-date versions of email clients are still widely used.

The main culprit here is Microsoft Outlook. Ironically, older versions of Microsoft Outlook had decent support for HTML and CSS, since they used Internet Explorer to render emails. But, starting in 2007, Microsoft switched to Word for its rendering engine—largely to unify authoring of content across its Office products. That move meant poorer support for HTML and CSS in emails. And email marketers have been cursing the product ever since.

Even with hybrid coding, designers need to use “ghost” tables to get things working properly in Microsoft Outlook.

Ghost tables are still HTML tables, but they’re hidden from other email clients through the use of HTML conditional comments. By using conditional comments, designers can code a ghost layout for Outlook using tables, while everyone else gets the more modern, div-based design.

The verdict is…

So, you can code some of your emails using modern CSS. But if you need to support most versions of Microsoft Outlook, you’ll need to use some form of tables, too, if you want your email to look reasonably good.

The one exception to this rule is if you’re using plain text emails, which don’t use HTML and CSS at all. There are a lot of good reasons to send plain text emails, but they’re usually only used for very specific purposes. And the lack of branding, customization, and tracking means that most brands won’t pursue a plain text-only approach to email marketing.

So, until Outlook starts updating their HTML and CSS support (which, to be fair, they have been working on), emails will have to be designed with tables—at least to some extent.

Test every email, tables or not

See how your emails render across 100+ different email clients and devices—regardless of the coding techniques used—with Litmus Email Previews. Try Litmus free for 7 days.

Start testing today →