WOFF 2.0 and the rise of web fonts

Introduced in 2009, the Web Open Font Format (WOFF) was a milestone that marked the beginning of the web fonts era. Now, with progress being made on the WOFF 2.0 working draft, our Senior Technology Strategist Vladimir Levantovsky discusses its development, the benefits it will bring for online type, and a focus on increased quality and reduced data size.

If you read text on any major website these days, you’re more than likely viewing web fonts: type crafted specifically for the web that’s served to your browser without the need for you to have it installed on your computer. It’s a format that enables a host of benefits, from better resolution and brand consistency, to searchability.

It was an entirely different experience back in the late 2000s. With no font format universally accepted by browsers, web fonts weren’t widely adopted and the proposal to standardize an Embedded OpenType (EOT) technology for web typography was causing heated arguments in the industry. While a few alternative solutions were considered, it took until the end of 2009 for a compromise proposal to be settled upon: the Web Open Font Format, or WOFF 1.0.

Vladimir has been involved with WOFF from the beginning, becoming chair of the W3C Web Fonts Working Group along the way. “Our primary goal was to make the adoption of web fonts easy,” he explains. “WOFF 1.0 was a significant development, it enabled a functionality that had not been seen on the web before. We knew it wouldn’t satisfy every technical need and requirement, but it was something that everyone could agree on—a unified, single format that all browsers support—and wouldn’t take much time to implement.”

The W3C Web Fonts Working Group, consisting of representatives from major browser vendors such as Apple, Google, Mozilla and Microsoft; member companies such as Adobe and Monotype; and many individual experts, was chartered to develop the new specification. The result was a huge step, successfully seeding the market and enabling web fonts as we know them today.

But one issue remained unsolved—the lack of efficient compression for font data. Developers, realizing they had a tool in their possession that gave them full control over their typography, began to migrate from using standard core web fonts to custom type selections. As the popularity of web fonts increased, so did the traffic generated from transferring font data between servers, clients and multiple devices.

 “Web fonts take time to load and user experience can suffer as a result,” Vladimir explains. “WOFF 1.0 was based on a generic compression technology that doesn’t provide the most efficient compression for font data, so more bytes need to be transferred to make fonts available to browsers. It’s not necessarily something that a regular user would notice, but for large companies serving thousands of web fonts the extra data load definitely creates a significant demand for added bandwidth.”

The need for something designed specifically to target reducing web font data became clear. The group picked up where they’d left off, and work began on an update: WOFF 2.0.

Improved compression

At the core of WOFF 2.0 is a two-step process that results in significantly better font data compression rates. The first, a pre-processing step, is a derivative of Monotype’s widely known MicroType® Express (MTX), a font compression technology patented in the late 90s. Monotype contributed the IP rights and released the patent, making it available to the general public free of any limitations and licensing costs.

“We designed MTX for font data,” Vladimir explains. “We know fonts have a very specific structure, and we know the tables that comprise the font file have redundant information. Knowing the data structure and the built-in redundancy, we can take a two-step approach: We can first eliminate the redundancy by knowing what we’re working with, and then secondly we can apply a highly efficient compression to further reduce the file size.”

That second step is now known as ‘Brotli’, a completely new compression algorithm created by a dedicated development team at Google. It takes the slimmed-down version of the font data and looks for repeated patterns, then abbreviates them to further reduce the data size. Brotli is, as Vladimir puts it, “a very significant contribution” that’s already proven to produce much better compression rates for fonts.

User experience and economic benefits

By reducing the amount of data that needs to be transferred, WOFF 2.0 will increase the quality of user experience. For the average web user on a fast connection, a font that used to require 1/10th of a second to download now taking half the time probably won’t be too noticeable, but for those on slower or mobile networks the difference between a two-second and one-second wait makes a huge difference. For companies serving the data, the impact could be huge.

“Imagine a company serving thousands of fonts to billions of users. That data is duplicated on multiple servers. If you have the opportunity to reduce the data size by half, and the data transmission times by half, that’s a huge money-saving opportunity,” Vladimir adds. “So it’s not just user experience that benefits, it’s a significant economical advantage for anyone who hosts web content and serves data over the web. It allows the whole web infrastructure to work more efficiently.”

WOFF 2.0 will also bring one new feature in the form of font collection support, a way of packaging multiple font file variations into a single file.

“Font collections have become much more desirable these days because of digital typography, and specifically because publishing is increasingly digital. Magazines, e-books; they all use web font technology,” explains Vladimir.

“Say you want to use a family of fonts that has multiple weights and design styles. Instead of having to download 11 font files, where some portion of the data is repeated, a font collection allows you to package all 11 fonts in a single file. In the same way, many fonts are now developed with subtle variations in design to account for variation in optical sizes. These can also now be easily encapsulated as a collection. It’s an incremental improvement that we believe will make many developers happy.”

The road to recommendation

The path to the final W3C Recommendation involves a comprehensive approval process. Developing the technology and writing the draft specification is just the first step; the W3C group also needs to provide a mechanism to prove the implementations are compliant with the specification. To do this, a unified way of testing needs to be created—a core set of different tests that, if passed, prove the implementation was successful. Only then can the specification be considered final. 

“Promoting the specification to W3C Recommendation status requires at least two successful implementations—two or more completely independent browser teams have to implement the technology using your specification and pass every test,” he explains. “This provides an assurance that the final text is sufficiently clear and satisfies all the W3C requirements.”

Vladimir puts the group as being between the first and second stages of the specification development process: (“We believe we’ve finalized the technical development, and we’ve started developing tests.”) and the Public Working Draft was recently published, but timings for further developments depend on many factors such as technology adoption, contributors’ availability, and waiting on the implementations.

“Because this work is being conducted openly with access to all the drafts and working group communications, it’s not just members of the group that contribute, it’s the general public too,” he adds. “People don’t wait for everything to be finalized before they start implementing. If something isn’t sufficiently clear or if they find a problem, they send us comments that could be a significant contribution to the spec development. That’s one of the benefits of the W3C process, from the beginning it’s very public-oriented.”

With plenty of work still ahead, Vladimir is positive about the potential impact WOFF 2.0 will have. “It’s a much better technical solution compared to WOFF 1.0, it has definite usability benefits, and it enables certain features that are not supported by the existing technology. It’s a quality improvement in many different ways.”