Web font test cases: file linking vs. data URI embedding, CSS font stack subsets

Guys,

I have created a few test cases for various techniques used to link or
embed web fonts in HTML pages:

 1. linked as one external file (EOT and TTF)
 2. linked as external subsets (EOT and TTF)
 3. embedded as one internal data URI (TTF)
 4. embedded as internal data URI subsets (EOT and TTF)

The test cases are available at:
http://www.twardoch.com/webfonts/

Findings so far:

1. Safari 4 performs well on Mac and Windows with all four test cases.

2. Firefox 3.5 performs fine on Mac and Windows with all four test
cases. However, initially, my test font had a "name" table that was
larger than (I don't remember what...) -- then Firefox on Windows did
not load the font.

3. Internet Explorer 8 on Windows performs fine on cases 1 and 2 but
does not permit data URI embedding even if the subsets are <32 KB (i.e.
test case 4).

4. Opera 10 on Mac and Windows performs fine with test 3, but performs
erratically (sometimes renders, sometimes does not render, sometimes
crashes) on tests 1 and 2, and only renders the first subset from the
CSS font stack in test 4.

I hope you guys will find it useful.

Best,
Adam


-- 

Adam Twardoch
| Language Typography Unicode Fonts OpenType
| twardoch.com | silesian.com | fontlab.net

Reporter: "So what will your trip to Ireland look like?"
Lech Wałęsa: "I get into a car, then onto a plane, and then the other
way around."

Received on Monday, 12 October 2009 09:22:44 UTC