Although web typography has come on leaps and bounds since the introduction of web fonts, it’s still in the Stone Age compared to print typography. At the recent, ATypI conference in Warsaw, a group of industry heavyweights announced OpenType Variable Fonts, a new specification that could substantially enhance the flexibility of typefaces on the web while reducing the bandwidth needed to download them.
Print typographers and type designers have tools to extend, compress, shorten, lengthen, thicken, and otherwise modify typefaces. The web has none of that flexibility. When type designers complete their design, they’re forced to “flatten” typefaces so they’re available in the limited set of weights and variations that browser type-rendering engines can understand.
Each of those variations takes a chunk of bandwidth to download, so web designers have to choose: do I want this particular weight for my headers even though it increases my font payload, or do I compromise and use a weight that I’ve already included?
OpenType Variable Fonts — a new OpenType specification from Apple, Microsoft, Adobe, and Google — gives designers much greater creative freedom. OpenType Variable Fonts are, as the name suggests, variable along thousands of axes of variation. Type designers can create fonts that are suitable for a far greater range of applications than is currently possible. As Adobe’s Typekit blog puts it:
“Imagine condensing or extending glyph widths ever so slightly, to accommodate narrow and wide viewports. Imagine raising your favorite font’s x-height just a touch at small sizes. Imagine sharpening or rounding your brand typeface in ways its type designer intended, for the purposes of art direction. Imagine shortening descenders imperceptibly so that headings can be set nice and tight without letters crashing into one another. Imagine this all happening live on the web, as a natural part of responsive design.”
Even better, Variable Fonts don’t necessarily add substantially to the size of font downloads. Currently, designers have to be careful about the font variants they include on a page because for each variant, every glyph has to be downloaded.
OpenType Variable fonts are different. Variations are stored as a delta of a baseline version: to add a new font weight to the font stack, you don’t have to download a whole new variation, just the differences between the variation and the base typeface. It’s a more elegant and bandwidth efficient solution.
Before you get too excited, it’s worth noting that no browsers support the new technology, and nor do any other type renderers or type design applications. It’ll be a while before we can use variant fonts in production. First, the specification will have to be implemented in typeface applications and browsers and then type designers will have to create typefaces that use the specification.
However, with Google, Microsoft, and Apple — developers of Chrome, Edge, and Safari — as the authors of the OpenType Variable Fonts specification, it stands more chance of making it into production than past attempts at variable font specifications.