Responsive Email at The End of 2016

— November 17, 2016

So, during the mid 90s the web standards movement was started and W3C was formed. The World Wide Web Consortium (W3C) is the main international standards organisation for the World Wide Web. The web standards movement had a large influence on the internet of today from initially pushing the idea of using CSS to style web pages all the way to adding accessibility to web pages. Creating a widely accepted standard in the various web technologies – CSS, HMTL and JS – allowed the web to accelerate as well as ultimately bring the various available browsers to offer an almost uniform experience across the web. During this period email marketing remained largely unchanged. Email marketing emails were built much like the first graphical web pages with the content laid out in static fixed width tables.


Responsive design


Around 2005 and with the introduction of the first widely available smart phones responsive web design was invented. Web sites could be made to change in size and shape to fit the devices they were viewed on. This was a massive improvement over the other option in which a duplicate mobile-only site was built. This meant businesses would need to manage two duplicate sites concurrently. Email marketing was never able to send a separate email specifically to mobile devices because that web technology relied on javascript user agent sniffers. Responsive web pages offered great user experience for desktop and mobile. Email followed this trend a few years later. Email could now be coded to work or display differently on mobile devices with the aim of giving the reader a better user experience. Like the web, responsive email relied on media queries to change the email design to accommodate the mobile screen size. Unfortunately, this coding style didn’t work well with all mobile devices.


Proliferation of clients and devices


Since the beginning, email has always had to deal with many more email clients compared to the number of browsers that websites have had to deal with. With the meteoric rise of smartphones and their rapid adoption, the number of email clients has also increased. New services to check email rendering were started. Litmus and Email on Acid. By the late 2000s email code had truly come into its own right. While still reliant on tables many coding, tricks hacks and best practices had been adopted by the burgeoning email development world. Prior to the smart phone revolution email clients like Outlook and Lotus notes were regarded as the troublesome clients. As mobile email became popular, Gmail and Android were now viewed as the problematic email clients. They strip out the section of emails removing the media queries therefore making responsive email impossible in these environments.


Hybrid/Spongey/Fluid


New techniques were pioneered to solve problem of laying out content correctly or responsively in Gmail and Android. Unfortunately, with each new coding style email code has become increasingly complex. The amount of code needed to do fairly simple things has increased and with all these increases the amount of time to code emails also increases. Currently, Hybrid/Spongey/Fluid email coding is still the only way to get a responsive email to be responsive on the largest number of mobile devices, however this style of email coding also comes with quite strict limitations on the actual layout of the email design. Fairly simple, one or two column designs are the norm with this method.


Time for change


Early this October, however, Gmail rolled out support for the <style> tag within emails and with it support for a long list of CSS. Of course a much larger CSS tool box is a boon for email designers everywhere as Gmail & Android together have about 25% of the email market share. As Gmail alone are the second largest email client after iPhone this adoption of the CSS support in the header obviously will have a huge impact.



  • It means more emails can be coded in a similar way to web pages. A more standardised approach to coding email can only be a good thing for developers, clients and recipients.
  • Coding email responsively as opposed to Hybrid/Spongey/Fluid is slightly less time consuming.
  • It also signals a direction for email to not only adopt more standard CSS support but also a move to adopt new CSS. Email hacks might become less ‘hacky’ and closer to actual CSS techniques.

At the time of writing interactive emails, CSS animations and webfonts are not supported. Though I would guess these will be added soon. Other email client providers to have made an effort to adopt more web friendly approach to CSS and HTML including Yahoo and Outlook.


So, at the end of 2016 the email landscape has changed greatly in just a few years. The massive increase in the number of email clients as well as the massive switch to view on mobile over desktop has drastically changed the way emails are coded. Trends in design and globally increased access to faster and faster internet has also caused the accepted size of an email to balloon massively, however these changes have also been mirrored on the web.


Email has remained the most effective, in terms of ROI in the digital marketing channel. It’s personal, instant, tailored and allows businesses free reign over frequency, size, content and formatting. This almost limitless blank canvas and constant link to their customers makes it easy to see why email is such a powerful marketing channel, easily out performing all social media channels.

Digital & Social Articles on Business 2 Community

(28)