{"id":29196,"date":"2021-05-21T10:58:31","date_gmt":"2021-05-21T14:58:31","guid":{"rendered":"https:\/\/www.litmus.com\/?p=29196"},"modified":"2025-12-12T16:27:38","modified_gmt":"2025-12-12T21:27:38","slug":"email-design-with-html-tables","status":"publish","type":"post","link":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables","title":{"rendered":"Email marketing assumptions: Emails have to be designed with tables"},"content":{"rendered":"\n\n\t
\n
\n \t
\n \t\t
\n \t\t\t
\n \t\t\t\t

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

That\u2019s right, we\u2019re questioning one of the longest held beliefs in the industry:<\/p>\n

All emails have to be designed with tables.<\/em><\/p>\n

Why do emails use HTML tables?<\/h2>\n

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\u2014or emails.<\/p>\n

It all started on the web<\/h3>\n

Although tables weren\u2019t officially introduced into the HTML spec until 1997, they\u2019ve 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\u2014despite being originally designed for tabular data (imagine a spreadsheet).<\/p>\n

By 1996, table-based layouts were commonplace and became the de facto standard for designing web pages (and using web safe fonts<\/a>). Products like Microsoft Frontpage and Adobe Dreamweaver made creating table-based designs accessible (but hardly accessible<\/em>).<\/p>\n

\"kenra
Source: Justine Jordan<\/a><\/figcaption><\/figure>\n

It wasn\u2019t 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.<\/p>\n

CSS support for email was limited<\/h3>\n

However, tables are still predominant in email design<\/a>.<\/p>\n

This is due to the fact that, until recently, most email clients\u2014and the rendering engines they use to display emails\u2014had limited support for HTML and CSS. Most didn\u2019t respect the positioning tools CSS uses, so table-based layouts tended to look better in various email clients.<\/p>\n

Email clients have come a long way since the 90s, though, and email design tools<\/a> have as well. Today, it\u2019s not uncommon to see beautifully designed, accessible, interactive emails on both desktop and mobile. But back to our main question\u2026<\/p>\n

Do all emails have to be designed with tables?<\/h2>\n

This is where things get tricky. Back in 2015, we wrote about why web and email design are different<\/a> and concluded that tables were the only solution for coding emails. Today? The answer isn\u2019t a simple \u201cyes\u201d or \u201cno\u201d\u2014it\u2019s \u201ckind of.\u201d Let me explain:<\/p>\n

Email clients have evolved<\/h3>\n

A lot of email clients have evolved with the web and have excellent support for CSS\u2014including things like the sizing and positioning of elements on a screen. If you want to see which email clients support what, there\u2019s no better place to do it than CanIEmail.com<\/a>.<\/p>\n

In the last few years, we\u2019ve seen the rise of responsive design and hybrid email coding<\/a>. Hybrid coding, in particular, is a modern way of building emails that takes advantage of CSS\u2019s positioning and sizing tools and reduces the reliance on HTML tables.<\/p>\n

Except for Outlook (mostly)<\/h3>\n

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.<\/p>\n

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<\/a> for its rendering engine\u2014largely 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.<\/p>\n

Even with hybrid coding, designers need to use \u201cghost\u201d tables to get things working properly in Microsoft Outlook.<\/p>\n

Ghost tables are still HTML tables, but they\u2019re 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.<\/p>\n

The verdict is…<\/h3>\n

So, you can<\/em> code some of your emails using modern CSS. But if you need to support most versions of Microsoft Outlook, you\u2019ll need to use some form of tables, too, if you want your email to look reasonably good.<\/p>\n

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

So, until Outlook starts updating their HTML and CSS support (which, to be fair, they have been working on), emails will<\/em> have to be designed with tables\u2014at least to some extent.<\/p>\n

Test every email, tables or not<\/h2>\n

See how your emails render across 100+ different email clients and devices\u2014regardless of the coding techniques used\u2014with Litmus Email Previews<\/a>.<\/p>\n

Learn more today \u2192<\/a><\/p>\n \t\t\t<\/div>\n \t\t<\/div>\n \t<\/div>\n <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Coding emails with HTML tables has been the gold standard for a long time. But as email clients have evolved, are tables still the best way to build emails?<\/p>\n","protected":false},"author":1,"featured_media":29197,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"tags":[478,499,102],"blog_category":[57],"class_list":["post-29196","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-design","tag-email-coding","tag-html","blog_category-observations"],"yoast_head":"\nDo emails still have to be made with HTML tables? - Litmus<\/title>\n<meta name=\"description\" content=\"Coding emails with HTML tables has been the gold standard for a long time. But as email clients have evolved, are tables still the best way to build emails?\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Email marketing assumptions: Emails have to be designed with tables\" \/>\n<meta property=\"og:description\" content=\"Coding emails with HTML tables has been the gold standard for a long time. But as email clients have evolved, are tables still the best way to build emails?\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables\" \/>\n<meta property=\"og:site_name\" content=\"Litmus\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/litmusapp\" \/>\n<meta property=\"article:published_time\" content=\"2021-05-21T14:58:31+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-12T21:27:38+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/05\/email-html-tables.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1381\" \/>\n\t<meta property=\"og:image:height\" content=\"725\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@litmusapp\" \/>\n<meta name=\"twitter:site\" content=\"@litmusapp\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Do emails still have to be made with HTML tables? - Litmus","description":"Coding emails with HTML tables has been the gold standard for a long time. But as email clients have evolved, are tables still the best way to build emails?","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables","og_locale":"en_US","og_type":"article","og_title":"Email marketing assumptions: Emails have to be designed with tables","og_description":"Coding emails with HTML tables has been the gold standard for a long time. But as email clients have evolved, are tables still the best way to build emails?","og_url":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables","og_site_name":"Litmus","article_publisher":"https:\/\/www.facebook.com\/litmusapp","article_published_time":"2021-05-21T14:58:31+00:00","article_modified_time":"2025-12-12T21:27:38+00:00","og_image":[{"width":1381,"height":725,"url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/05\/email-html-tables.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_creator":"@litmusapp","twitter_site":"@litmusapp","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#article","isPartOf":{"@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables"},"author":{"name":"litmusadmin","@id":"https:\/\/www.litmus.com\/#\/schema\/person\/558abbd8f270d945597fe17cbc04e4f2"},"headline":"Email marketing assumptions: Emails have to be designed with tables","datePublished":"2021-05-21T14:58:31+00:00","dateModified":"2025-12-12T21:27:38+00:00","mainEntityOfPage":{"@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables"},"wordCount":10,"commentCount":0,"publisher":{"@id":"https:\/\/www.litmus.com\/#organization"},"image":{"@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#primaryimage"},"thumbnailUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/05\/email-html-tables.jpg","keywords":["Design","Email Coding","HTML"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables","url":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables","name":"Do emails still have to be made with HTML tables? - Litmus","isPartOf":{"@id":"https:\/\/www.litmus.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#primaryimage"},"image":{"@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#primaryimage"},"thumbnailUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/05\/email-html-tables.jpg","datePublished":"2021-05-21T14:58:31+00:00","dateModified":"2025-12-12T21:27:38+00:00","description":"Coding emails with HTML tables has been the gold standard for a long time. But as email clients have evolved, are tables still the best way to build emails?","breadcrumb":{"@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.litmus.com\/blog\/email-design-with-html-tables"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#primaryimage","url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/05\/email-html-tables.jpg","contentUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/05\/email-html-tables.jpg","width":1381,"height":725,"caption":"email designed and coded in html tables"},{"@type":"BreadcrumbList","@id":"https:\/\/www.litmus.com\/blog\/email-design-with-html-tables#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.litmus.com\/"},{"@type":"ListItem","position":2,"name":"Email marketing assumptions: Emails have to be designed with tables"}]},{"@type":"WebSite","@id":"https:\/\/www.litmus.com\/#website","url":"https:\/\/www.litmus.com\/","name":"Litmus","description":"Are you getting the most out of your email marketing?","publisher":{"@id":"https:\/\/www.litmus.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.litmus.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.litmus.com\/#organization","name":"Litmus Software","url":"https:\/\/www.litmus.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.litmus.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2025\/04\/featured-image.png","contentUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2025\/04\/featured-image.png","width":600,"height":314,"caption":"Litmus Software"},"image":{"@id":"https:\/\/www.litmus.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/litmusapp","https:\/\/x.com\/litmusapp"]},{"@type":"Person","@id":"https:\/\/www.litmus.com\/#\/schema\/person\/558abbd8f270d945597fe17cbc04e4f2","name":"litmusadmin"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/29196","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/comments?post=29196"}],"version-history":[{"count":6,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/29196\/revisions"}],"predecessor-version":[{"id":121648,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/29196\/revisions\/121648"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/media\/29197"}],"wp:attachment":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/media?parent=29196"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/tags?post=29196"},{"taxonomy":"blog_category","embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/blog_category?post=29196"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}