The advice so far has been to convert your font and serve four different file types, an EOT, a WOFF, a TTF and a SVG. So I decided to actually check if that really is necessary.
To make this mission I just went to caniuse.com and made some screenshots, so let’s compare those screenshots.
The support for TTF/OTF
Supported by almost all browsers, except IE and Opera Mini
The support for WOFF
IE supports this a bit better, but just for IE 9 & 10.
The support for EOT
Excellent support by IE, but only IE, but all the way back from IE 6!
The support for SVG
Supported by all browsers, except IE lower than 9, and I (and others) have experienced that the SVG looks wonky sometimes. Especially on Chrome on Windows.
So my advice would be to ditch the WOFF, and due to IE’s partial support for TTF it’s best to serve the EOT before the TTF. So, serve the font files in this order:
- EOT (IE)
- TTF (Chrome, Firefox and others)
- SVG (Opera Mini)
And there you should have covered all bases and your site should look fine and dandy (hopefully;-).
Any thoughts or comments, please write a comment =)