Read Time: 4 min

Email Design Podcast #95: Litmus Community Q&A Rapid Fire

In the 95th episode of The Email Design Podcast, Kevin Mandeville and Jason Rodriguez answer recent questions from the Litmus Community in a rapid fire format, including topics on CSS inlining, email client market share tracking, iOS 11 scaling, and more. Be sure to follow along and join in the discussion on Twitter using #EmailDesignPodcast.

Download the MP3

In this episode:

  • (0:37) Not including closing </td>’s and </tr>’s in HTML? Believe it or not, you don’t necessarily need to write closing tags as most browsers or email clients will process your markup into semantic tags in the end. However, we both feel it would be weird to not do so in writing HTML, unless you were using a preprocessing language like Haml or set up a minification process to remove them (which should only ever be needed in rare cases of getting under Gmail’s 102KB HTML file size limit).
  • (4:37) Do you inline CSS? About 99% of the email client market share now supports embedded CSS, so odds are that you don’t *need* to inline CSS anymore for your audience. We at Litmus still inline CSS as we use CSS inlining a minification process of our CSS partials to avoid Gmail clipping. If it wasn’t a workflow issue (and had minification built in separately into Litmus Builder), we would stop inlining CSS as it’s not needed for our audience anymore. We talked more about questioning the need for CSS inlining in episode #69.
  • (9:11) The 2017 Email Client Market Share—Question About Terminology: Gmail caches their images, which is why we can’t detect a difference between webmail and mobile opens for that client. With iOS Mail opens, we can so we are able to segment between iPhone and iPad for instance. Check out the 2017 Email Client Market Share infographic here.
  • (14:54) Featured Jobs: Freelance Newsletter Designer at Nemuk AG | Campaign Developer at Digital Additive | Front End Developer, Email at The Telegraph | Assistant Email Developer at Burberry | Email Marketing Manager at Sittercity
  • (17:25) How can I force Outlook to use desktop version on mobile phones? Unfortunately, there is no unique way to target Outlook apps without affecting other email clients. In order to force a desktop version, it will have to be the desktop version served by default.
  • (20:09) How is on mobile different? Using in a browser is different than using an account via the Outlook app as they use separate rendering engines. in a browser does not support media queries whereas Outlook apps do. You can target in a browser by using [owa] .foo { /*Insert CSS Here */ }. Additionally, Outlook accounts using Exchange servers have even separate rendering and are notoriously bad, so you may run into issues there if that is the root cause.
  • (24:30) iOS 11 making html email appear differently: To avoid any scaling issues in iOS Mail, simply use the reset meta tag <meta name=”x-apple-disable-message-reformatting” /> in your <head>.
  • (22:36) Creating a poll interactive email: You can create static polls using HTML and CSS, but if you want any data to be passed to your system, you’ll need one of two implementations: 1) tracking pixels fired off of each click event that pings your database to read or 2) build a URL parameter off of actions taken within the email that users visit with a final click event to a landing page, wherein your website can read such parameters to return your desired result.
  • (27:50) Help with Gmail App CSS targeting: To target Gmail App on mobile only, simply use this targeting technique.

Follow the Email Design Podcast


Want to get more tips and advice like this? Subscribe to our weekly newsletter and get the latest content for email design pros delivered straight to your inbox. Every week.