Introducing the WebFont Loader in Collaboration with Typekit
Moments ago we
introduced
the Google Font API and Google Font Directory. In addition to Google’s support of
web fonts, we’re excited to announce a second launch: a collaboration with
Typekit to open source the
WebFont
Loader, a JavaScript library for improving the web font experience..
Google and Typekit believe that web fonts, in conjunction with the richer
text styling offered by CSS3 and HTML5, provide the visual richness and high fidelity control
of print typography while remaining accessible to machines and devices.
There are still some challenges when using web fonts, and the launch of an open source
WebFont Loader addresses one of these difficulties: different browsers treat the download of
web fonts differently. For example, Firefox will initially render a website’s text in the
site’s fallback font until the web font is downloaded, and then the text will be re-rendered
and re-flowed using the downloaded web font. Chrome and Safari won’t display the text until
the web font is fully downloaded, and Internet Explorer sometimes won’t render any content at
all until the web font is available.
The WebFont Loader puts the
developer in control of how web fonts are handled by various browsers. The API fires
JavaScript events at certain points, for example when the web font completes downloading. With
these events, developers can control how web fonts behave on a site so that they download
consistently across all browsers. In addition, developers can set the fallback font's size to
more closely match the web font, so content doesn't reflow after loading.
Furthermore, the WebFont Loader is designed to make it easy to switch between different
providers of web fonts, including Google, Typekit, and others. The code is modular, and we
expect to add modules for other major web font providers in coming weeks.
Google is excited to work with Typekit to further web font technology. We look forward to
working with others as well to continue to advance typography on the web.
By Jeremie
Lenfant-Engelmann, Google Font API team
