Industry News
The Google Font API and HTML Email
Industry News
Google, in conjunction with Typekit, just released a new Font API that allows designers to easily import non-standard OS fonts into their web pages. The API uses the CSS @font-face rule but relies on their CDN to provide the data bandwidth, which is probably much faster than the bandwidth allocated to your server. After hearing about this we wanted to investigate and find out the email client support for such an API.
Before we ran our test we knew a couple of clients would not display the API fonts. Understandably Gmail would not load the @font-face rule because it doesn’t support embedded or linked styles. With the little support that MS Word provides for HTML standards we had a good feeling that Outlook 2007 and Outlook 2010 would not display the Font API. We also knew that the IPhone would not display the custom fonts because Google’s Font API does not support SVG – Scalable Vector Graphics. With that said the Font API will also not be displayed on the iPad, iPod, or Andriod devices.
We found it very interesting, however, that there is little or no support for the CSS @font-face rule in most email clients. Only 1 client out of 17 supported Google’s Font API. This comes as a surprise to us because most email clients use browser based rendering engines to display HTML email. Due to Apple Mail’s HTML/CSS support track record we figured that it would surely support font embedding. Here is the list of clients we tested and their support for @font-face:
| Desktop Clients | Result |
| Apple Mail | |
| Entourage 2008 | |
| Entourage 2004 | |
| Outlook 2010 | |
| Outlook 2007 | |
| Outlook 2003 | |
| Outlook Express | |
| Live Mail | |
| Windows Mail | |
| Thunderbird 2 | |
| Thunderbird 3 |
| Web-based Clients | Result |
| AOL Web | |
| Gmail | |
| Hotmail | |
| Yahoo (New) | |
| Yahoo (Classic) |
| Mobile Clients | Result |
| iPhone |
Although Google’s Font API is a great resource and can make your job easier when designing web sites we highly recommend against using this API in HTML emails. Based on our test results there is almost no support and the one client that does support it has a very small share of the email client market. However, if you do decide to use this API we strongly suggest using a CSS font stack with the referencing API font.
