Share this:

Gmail supports Media Queries

Responsive Design in Gmail

October 26, 2016 - Insights

On September 14th, Gmail made an announcement that shocked the email design community. Just like a ripple that spreads out after a pebble hits the water, this update will, sooner rather than later, influence your target audience.

So, what is happening and what should you do?
Gmail announced they would start the roll-out of Media Query support over all their services late September. What this means is that emails can now be made responsive – basically they will now adapt to the device the email is displayed on! This is a major breakthrough because Gmail has been at the back of the line for years when it came to supporting responsive design.

Why do you need to take action?
Email client market share reports show, time and time again, that Gmail holds a rather large share of the market. To be more precise, as of September 2016 Gmail is in 2nd place, accounting for 16%, calculated on 1.29 billion opens tracked by Litmus. Apple iPhone topped the list with a staggering 33%, and Outlook came in 6th position with 7%.

While delving through your own database you might not find such a high percentage of Gmail domains. However, that does not mean your audience isn’t using Gmail as their email client to access your mailings. Given these recent shifts in the email market, we highly recommend a check-up to be your top priority.

Request an urgent check-up on all of your Marketing Automation email templates now, and as a good rule of thumb - review them every three to six months!





Technical insights
In the past Gmail has not supported classes or id’s in the of an email, which forced email designers to use inline CSS to style their emails. Times change and with their Media Query support comes embedded CSS support with classes and id’s, which removes the need for inline CSS in Gmail.

With this roll-out you’ll get support for CSS types / queries / keywords and properties such as:

  • All
  • Screen
  • Min-width
  • Max-width
  • And
  • Only
  • Background-position
  • Font
  • Margin
  • Etc.

For a complete list, and the latest updates, please view the Google Developer Documentation.





Request a check-up
Currently the update is not yet visible on every Gmail client and it is dependent on your setup – whether you’re using a native Gmail domain or loading in a separate one. We will update you once the roll-out has been fully completed by Google.

If you are not sure of the current state of your email templates then do reach out to us, we are happy to review them for you and perform any future checks.

Thank you for requesting a check-up!

Our team has been informed and we will be in touch with you shortly. In the mean time check out our social media channels for more modern marketing news and updates.

Follow us on Twitter

Connect on LinkedIn

Ian Graus

Designer and all-round consultant at Engagement Factory




Share this: