For full functionality of this site it is necessary to enable JavaScript. Here are the instructions how to enable JavaScript in your web browser.

Ask Logan: What should designers know about Gmail’s updates?

You may have recently seen an announcement from Gmail promising better emails tailored for all your devices. Here’s what that means:

Gmail has long been one of email’s more problematic clients, as any email developer worth their salt (assuming you still pay in salt, Roman-style) would tell you. We have to code just to appease its finickiness, and there are a couple of issues in particular that have held us back as an industry.

Embedded CSS

While virtually all other mail clients support embedded CSS – which allow us to create a single style (like a link style) as a class and then assign that class to multiple elements – Gmail requires that styles be typed out inline. This bloats the amount of code and increases the data size of the email, but they also clip an email over 102KB, so it’s like they’re force-feeding us and then telling us we have to fit into skinny jeans.

Media queries

Media queries are how we enable mobile design for email; they allow us to create a separate set of CSS style instructions that only come into play when, say, a device screen is 480px wide or less. Then, when an email is opened on a device that size (*cough* smartphone *cough*), these alternate instructions come into play, telling some image elements to scale down, some to hide, font sizes to increase, etc. Gmail, however, hasn’t supported media queries at all, which means that emails on their mobile app have displayed in a range from “unfortunate” to “illegible.”

We in the email design and development community have been petitioning Gmail for years to make these changes without hearing much back. So when they finally made an announcement that they will start supporting embedded style sheets, media queries, and a small host of other code the day before Litmus’ Email Design Conference in San Francisco (not a coincidence) AND sent their product owner and software engineer to attend the conference, it was a really big deal.

• It means that the mobile experience of email in Gmail’s app will be greatly improved.

• It means that we inch a bit further towards a common code standard for email and that we as designers and developers will be able to focus more on pushing the limits of what’s possible rather than addressing these deficits.

• It means that Gmail is finally in dialogue with our community, which bodes well for our requesting further changes to be made, such as, say, supporting the use of their own Google Fonts.

And that, email design gentles, is a win for us all. 

Email geek, inspirational potty mouth, and design services lead for Emma.