HTML and CSS Reference
In-Depth Information
Font Formats
Like the HTML5 video wars (
http://diveintohtml5.org/video.html
),
those
attempting to implement embeddable web fonts have to untangle a
mess of file format support among the various browsers. And like the
video format landscape, browser vendors have chosen to support differ-
ent font formats because of a mix of licensing and protection issues, plat-
form norms, and legacy behavior. Possible formats include the following:
■
“truetype”
: TrueType fonts (TTF); supported in Safari 3.1+, Chrome 4+,
Firefox 3.5+, Opera 10+
■
“opentype”
: OpenType fonts (OTF); supported in Safari 3.1+, Chrome 4+,
Firefox 3.5+, Opera 10+
■
“embedded-opentype”
: Embedded Open Type (EOT) embeddable fonts;
supported in IE 4+
■
“svg”
: SVG-based font definition; supported in Opera 10+, Mobile
Safari
■
“woff”
: Web Open Font Format embeddable fonts (WOFF); supported
in Firefox 3.6+, IE 9+
From IE4 to IE8, Microsoft supported only the proprietary EOT format out
of concern that embedding TTF or OTF fonts required the raw font files to
be posted to a web server for the world to download and because doing
so would break the licensing agreements covering most fonts. The WOFF
was established in 2010 as a standard format for embeddable fonts that
addresses the piracy issues.
Until WOFF is widely supported, to embed custom fonts in IE and the rest
of the browsers, you must provide the font in at least two formats and
define them similar to the following example.
