« Return to Blog

Do Google Web Fonts Work [Well] In HTML Email?

Posted on September 10th, 2010 by Jeff

I’d seen a few tests on (especially on Campaign Monitor) about CSS (mainly interested in CSS3) and support across email programs. Due to the lack of standards, there isn’t great support outside of the Apple realm. However, I wanted to test to see how well we could use some of the new Google Web Fonts (as using Typekit is not really an option yet).

Using our trusty tester Litmusapp, I created a super simple email and dropped some ‘Droid Serif‘ action in there. After a few minutes, here’s what I saw:

google-fonts-litmus-test

Not too surprising, only 5 clients supported this feature. However, what was more surprising was which clients supported them:

Apple Mail (3 & 4):

apple-mail-works

Entourage 2008:

entourage-2008-works

Thunderbird 3:

thunderbird-3-works

Postbox:

postbox-works

Lotus Notes 8 (but not 8.5):

lotus-notes-8-works

I found it very interesting, surprising, and a tad disheartening that the iPhone, iPad, and Mobile.me all failed this test, while their desktop cousins passed. Why does Lotus Notes 8 work, and not 8.5? And how does Gmail not pass this test when it’s using Google code? Oh well, for now, we’re still not where we (or maybe just me) want to be, but as you can see progress is as progress does.

As usual, the takeaway is declare similar, web-safe fall back fonts for each web font and test, test, test. I’d suggest using Litmus, but even just creating a few free accounts can help save you some embarrassment (in terms of design looking clunky or completely wrong) and possible SPAM complaints.

Tags: , , ,

Want to join our email list?

Our quarterly email provides some great design + communications-related news and info. You can expect to hear from us once every month or so, but never more than that.


Our Recent Twitter-ness

  •  

Follow Thinkdesign

One Response to “Do Google Web Fonts Work [Well] In HTML Email?”

|
  1. Jeff Miller says:

    Nice work. Thanks for looking into this.

    Couple of questions.
    1. Are you using in-line style sheets?
    2. Did you try moving the link to the font (this thing: ) out of the and into the ? I tried a quick test and it worked in a browser.

|

Leave a Reply