Gmail Finally Supports Responsive Design

Gmail Finally Supports Responsive Design pixelwork

Gmail Finally Supports Responsive Design

Google has started supporting responsive email design in its different Gmail clients.

gmail began to endure CSS queries via their email clients around midnight on September 13, followed by an announcement on September 14 that it would support responsive design later in the month. With this, email designers will be able to specify different display styles based on things like width, screen resolution and rotation.

We'll talk about the ramifications of this move in a second, but we should take a moment to acknowledge how wonderfully strange the initial announcement was.

It's not just about supporting these types of queries, a lifelong desire of email marketers. It wasn't just that we were told ahead of time, as service providers rarely announce changes in advance. If not, it was because they also supply development documentation, which is common practice in the web world but completely strange in the email world.

Supporting responsive design is impressive, but taking these two extra steps into account, this is frankly, beyond incredible. And with this Gmail news coming less than a month after Microsoft announced a partnership with Litmus to improve rendering in outlook, it feels like there is a sea change in the email industry.

Now that Gmail has implemented support for CSS queries and we've had a chance to dig into it, let's address the four big questions that many marketers are probably asking:

Do marketers need to use a hybrid email design?

Maybe, depending on your audience.

Hybrid email design uses specific email clients with progressive enhancements to mimic responsive design, but is not based on queries, which allow traditional responsive design.

Now that Gmail is supporting queries, 75% of email opens happen in email clients that support responsive design. It's worth checking which devices your emails are being opened on. If you have a ton of emails opening in the Outlook desktop apps, Microsoft Windows Phone, Microsoft Surface, and Yahoo Mail mobile app – none of which support responsive design – hybrid email design becomes in the most attractive option.

It's worth noting that even those using hybrid design must make changes in the short term due to the change in Gmail. The portion of hybrid code that handled Gmail specifically should be replaced with responsive code that will be on top of the hybrid code, which will essentially be a replacement when emails are viewed in email clients that do not support queries.

The positive part is that the hybrid code, which has been heavy and difficult to understand, will be light and easy.

Do marketers need to continue using inline CSS in their emails?

No, more is probably not needed.

Because broke the code del de los correos electrónicos, Gmail fue la razón principal por la que los vendedores tenían que usar CSS inline. En los EE.UU., hay algunos clientes de correo electrónico de uso reducido por ahí que todavía requieren estilos inline, pero representan una pequeña fracción – menos del uno por ciento del correo electrónico.

Abroad, it's also probably safe to stop inline, although you may need to reconsider if you have a significant number of subscribers using, Yandex, Libero, or some other regionally popular email clients that don't support The embedded CSS styles.

So instead of applying styles to each table row and cell, you can now centralize all the styles in the , which removes a lot of inefficiency and code from emails.

For marketers, this change means that emails will be much easier and faster to code. For subscribers, it means emails load faster.

Marketers can take those savings in terms of lighter code and faster loading times and spend that time on other email elements, such as:

  • Larger image files, such as retina display optimized images and animated gifs, which 46.9% of marketers never use.
  • Heavier coding elements, such as interactive email elements such as hamburger menus and email carousels.

Just be sure to continue keeping your email code weight below 102 kB to avoid Gmail clipping and slow loading times in general.

Can marketers now use interactive email elements in Gmail?

No not yet. But there are reasons to be hopeful.

While Gmail's CSS support is extensive and includes support for :hover (which is not mentioned in the developer documentation), the company's rendering engine does not support any CSS that uses classes or IDs – which is necessary if you are going to use elements such as check boxes, radio buttons, labels, etc. These are all key code elements for interactive email functions.

For years, Gmail has cited security issues citing responsive design as the reason for this. Since Gmail was able to overcome those concerns with responsive design, it's conceivable that it will be able to overcome them with interactivity as well.

So for now, Apple's email clients, which have 51 percent market share, remain the best places for interactivity. Especially for B2C sellers. That's reason enough to start testing interactive elements today.

What is driving these changes to email providers?

In the wake of the Microsoft-Litmus partnership announcement, a series of changes over the past seven years had caused Microsoft to view email vendors more as an ally than an adversary, as they had in the past:

  • Leadership in senior management has changed in recent years.
  • Email product leadership has delivered a response.
  • Consumer behavior is different, with people accessing personal and business emails on the same platform.
  • Email providers are consolidating the email rendering engines they use to gain efficiency.

These forces are also at work in the Gmail play. Additionally, there is another factor at work that was not initially evident:

Email marketers are no strangers to Google and Microsoft. They are privileged, thanks to B2C companies and acquisitions in recent years.

Yes, Google sends tons of email and has many consumer facing companies now like YouTube, Google Plus, Goggle Photos and Nest. It's no coincidence that YouTube uses Gmail emails to demonstrate how responsive design works.

And Microsoft has many consumer-facing businesses, including Xbox, Skype, and LinkedIn now, which is a big sophisticated user of email marketing.

It's easy to imagine these brands approaching their coworkers on Gmail and Outlook teams, saying how much they enjoy designing email messages for Apple email clients, and asking, “Why do our email clients Do they not support HTML and CSS as well as their email clients? ”

Regardless of the combination of factors that led to these changes, the jobs of email designers and developers are clearly going to be a little easier from now on.