Responsive Mailings mit Gmail

Seitdem Google endlich die Unterstützung von u.a. media queries ausgerollt hat habe ich mich wochenlang mit dem Testtemplate herumgeschlagen, nur um irgendwann zu realisieren, dass das Gmail Update geo based ausgerollt wird und Deutschland schlicht und ergreifend noch gar keinen entsprechenden Support erhielt.

Jetzt meinte ein Kollege zu Weihnachten, dass media queries definitiv hierzulande in Gmail (Android) schon funktionieren, also ein responsives Template rausgeschickt via Mailchimp: erfolglos. Also das o.g. Testtemplate nochmal rausgeschickt, das funktioniert tatsächlich jetzt.

Wo lag der Fehler?

Gmail verabscheut (derzeit noch)

  • Attributsselektoren (also statt „body .bla“ lieber nur „.bla“)
  • und den type bei media queries (also text/css rausnehmen und einfach nur <style> um die separierten media queries)
  • media query klassen, deren attribute nicht !important sind.

Das muss man erst einmal wissen. Alternativ kann man auch mit mehreren media queries arbeiten und einfach pro break point stylen. Das Testtemplate von Litmus/Google funktioniert hierzulande (noch) nicht!

Hier sind mal drei Beispiele, die in Gmail Android/Web funktionieren (Stand 4.1.2017):

  • http://pastebin.com/5VUtryyy
  • http://pastebin.com/9LUa03Bs
  • http://pastebin.com/W3ryPEK9

Leave a Comment