To properly understand how to typeset web fonts it is necessary to understand how the font fits with the other structures on the page.
The em square is a fundamental property of a web font, the square is a container for a two-dimensional coordinate system. Each unit of this grid is called a font unit, the greater the number of font units per em square the greater the resolution of the font.[1]
With the @font-face CSS declaration now supported cross browser it is possible to attach fonts to web documents. Implementation though is a maturing subject supporting a number of different formats. Some background and techniques are described in this article.
Font formats
TrueType
TrueType is a spline-based font standard originally developed by Apple.[1]
Supported by the latest versions of Firefox, Opera, Safari and Chrome.
OpenType
OpenType was developed by Microsoft with Adobe contributing and was intended to supersede TrueType.[2]
Supported by the latest versions of Firefox, Opera, Safari and Chrome.
Embedded OpenType
Designed by Microsoft to be embedded into a web document, the file is an encrypted OpenType or TrueType font that has a list of allowed host domains compiled into it, the font can also be subsetted when the EOT is generated. Since EOT is a propriety format it was rejected by the W3C.[3]