Education

What is WOFF?

May 24, 2016 by
Yves Peters
Yves Peters

In his recent article Paring down webfonts in FF Subsetter, David Sudweeks mentions WOFF. No, this is not the bark of an adorable puppy, but the abbreviation for Web Open Font Format. Developed by Mozilla® in concert with Type Supply, LettError, and other organizations, it uses a compressed version of the same table-based SFNT structure used by TrueType, OpenType, and Open Font Format, but adds metadata and private-use data structures, including predefined fields allowing foundries and vendors to provide license information if desired. Sounds as complicated to you as it did to me? I will to try to explain what this all means.

A Font Format Specifically for The Web

The distinction between a typeface and a font has often been discussed. It was the topic of the first entry on The FontFeed after I took over back in September 2008. Researching WOFF gave me a renewed insight on how to differentiate the two, because we are focusing on technology this time. A typeface is independent of technology – it is the design, the appearance of a collection of alphanumerical and other signs. However as soon as technology comes into play, we are talking about fonts. If you want to reproduce your typeface with a certain technology, you need a font that is compatible with that technology. A recent example that illustrates this is FF Real™: the typeface can be licensed as a digital font, but can also be purchased as a wood type font.

Within the digital font formats there are different types for specific uses. The current OpenType fonts have many advantages. They potentially support literally thousands of glyphs, work on different platforms and operating systems, and can be programmed with features for advanced typography. Yet they can create some issues when used online. This is where the Web Open Font Format or WOFF comes in.

WOFF compresses font data so sites using WOFF need less bandwidth and load faster than if they used equivalent uncompressed TrueType or OpenType files.
WOFF compresses font data so sites using WOFF need less bandwidth and load faster than if they used equivalent uncompressed TrueType or OpenType files.

Compression for Faster Loading of Web Pages

WOFF fonts are basically structured like other digital fonts, but with two important distinctions. The first is that they are compressed. OpenType or TrueType font files are comparatively big and slow down websites due to longer load times. WOFF uses a lossless compression – meaning it doesn’t affect the quality of the fonts in any way. That compression shaves off up to 20% of the file size. Websites using WOFF fonts use less bandwidth and load faster than if they used OpenType or TrueType fonts.

Better Protection for Creators of Digital Type

Hosting TrueType or OpenType fonts on the web can be difficult choice for type designers and foundries, as it makes their work vulnerable to piracy. The second difference with ‘regular’ fonts is that WOFF fonts are packaged in a byte-for-byte wrapper, a digital “box” around the font that offers the possibility to add metadata and private-use data structures. One of the types of metadata that can be added to the fonts is license information that tracks their provenance and defines permissions, thus helping to combat unauthorised use.

Metadata in the wrapper around WOFF fonts can include license information, and specify they are only for use on the web.
Metadata in the wrapper around WOFF fonts can include license information, and specify they are only for use on the web.

All You Need Is WOFF

The overview on Can I use… shows that WOFF is supported by all current browsers (except Opera Mini™). But what about other options? Since Microsoft announced it only supports the latest version of Internet Explorer® for supported versions of MS Windows®, the already deprecated EOT (Embedded OpenType) has become obsolete. SVG fonts (SVG stands for Scalable Vector Graphics) became disused years ago because the files were a lot bigger than real fonts and lacked typographic features. And OpenType and TrueType fonts are also too large because they need to support features that sometimes don’t really matter if you are simply rendering a web page on screen. However OT feature support in browsers is now the same, if not better, than in for example Adobe Creative Cloud, so the main advantage of WOFF remains the compression.

Trademark attribution notice
Real is a trademark of Monotype GmbH and may be registered in certain jurisdictions. FF is a trademark of Monotype GmbH registered in the U.S. Patent and Trademark Office and may be registered in certain other jurisdictions. Mozilla is a registered trademark of the Mozilla Foundation. Opera Mini is a trademark of Opera Software AS. Windows and Internet Explorer are either registered trademarks or trademarks of Microsoft Corporation in the United States and/or other countries. All other trademarks are property of their respective owners.

FontShop Letternews

Subscribe to our newsletter to receive amazing offers, useful type tips and information about the latest font releases.