Giters

hteumeuleu / email-bugs

Email quirks and bugs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Yahoo! Mail app for Android strips styles from the first <head> tag

jkupczak opened this issue · comments

commented 
<html>
  <head><!-- Yahoo App Android will strip this --></head>
  <head>
    <meta ... >
    <style>
      your styles
    </style>
  </head>
  <body>
    your content
  </body>
</html>

Using an empty <head> tag first will prevent Yahoo! Mail app for Android from stripping out your styles.

Use this with caution. Some ESPs will process your code before sending it. In many cases this involves accepting the first <head> tag and deleting the rest. MailChimp for example will do exactly this, leaving you with no <style> tag.

commented

Ha-ha, nice abuse. Really, impressive. What about other email clients? We can get some unpredictable problems with using this method. Targeting email client with @yahoo in email address isn't safe

commented

I only just learned about this today. I found the Pine Email Framework which mentions it under their Meta tags section here: https://thememountain.github.io/pine/index.html#meta-tags

They don't go into a lot of detail about it, but I managed to track down this page that explains it further: https://mosaico.io/email-client-tricks/double-head-trick-yahoo-app-android/

I've tested that it works in the Yahoo! Mail app, but not whether or not it breaks other clients. They claim that it didn't break anything in other clients.

commented

Thanks for links.

I'll do the test in most popular email clients in Russia:

  • mail.ru
  • mail.yandex.ru
  • mail.rambler.ru

I'm interesting for result in yandex mail client. It's still strips styles from <head> on all platforms

commented

Method not useful with Mailchimp. We losing the second <head> element in different clients includes Gmail

commented

@dudeonthehorse

Which clients are you losing the <head> in? I use MailChimp as well and it works fine for me on the Gmail website in Google Chrome as well as the official Gmail app on Android. This was done by sending test emails as well as running the full campaign.

I tested again using MailChimp's Inbox Preview powered by Litmus. The styles I placed in the second <head> element worked fine in Apple Mail 9, 10, Outlook 2000/02/03/07/10/11/13/15, AOL (Chrome), Gmail (Chrome), Google Apps (Chrome & IE), Office365 (IE), outlook.com (IE), and Yahoo! (IE).

commented

As of July 2018 MailChimp now processes your code with what they call a "purifier" prior to sending. You cannot use this trick with MailChimp.