Email tip – Gmail announces support of media queries and CSS

Welcome Dan Caro, Whereoware’s Director of Marketing Operations. Dan specializes in behavior-based marketing automation strategy, e-commerce marketing, and conversion optimization. He’s psyched to share today’s news…

Welcome to the 21st century, Gmail!

In case you missed it, Gmail announced the support of  <style>  tags and media queries. Start celebrating #emailgeeks!

leo

Recap

Before yesterday,  email designers had to rely on inline CSS to style their emails. Lack of support for media queries led to the spongy/fluid/hybrid design revolution in email.

Now, Gmail says they’ll finally support media queries and responsive email. This gives email designers more flexibility and fewer hoops to jump through, saving stress and time.

You can find Gmail’s official documentation here.

Soon, Gmail will support:
• Embedded styles
• Classes and IDs
• Media queries
• Background-position and background-size
• *Animations, transitions, and transforms will still not be supported

What do we think?

Senior Digital Marketing Manager Shauna PlesmidSenior Digital Marketing Manager Shauna is pumped:

“From a B2C perspective, the majority of our audiences are reading emails and browsing websites on their mobile devices. Previously, creating a good mobile experience on the Gmail and Inbox platforms required us to adapt different development techniques – sometimes sacrificing a better experience on another client. I’m glad to see Google putting its customers’ experience on their platforms at the forefront of their priority list… Finally :)”

Digital Graphic Designer Breanne BradyDigital Graphic Designer Breanne’s initial reaction?

OMG. SPEECHLESS. This is a HUGE reason to encourage clients to try new development ideas. Before, it was hard to make the case for something cool that would take a lot of work, but wouldn’t be seen by a chunk of their customers.” 

Whereoware’s Senior Graphic Designer Jason is still skeptical.

My range of emotions: 

Gmail to support media queries

skeptical cat is skeptical

Elf You're sitting on a throne of lies

What’s Gmail’s change mean for you?

More than 75% of email clients will support responsive design. Although Outlook is still an outlier (excluding Outlook App for Android), go ahead and design using media queries. This latest release should also allow more support for specialized, web-based fonts, like Google Fonts.

The world is your oyster. Go out there and start designing better emails (except on Outlook, but Litmus is working on it).