Hot Type, Always Fresh

Digital fonts seem pretty straightforward; go to a website or launch an app, a page will load, and text–in a variety of styles, weights, and sizes–appears almost instantaneously. In reality, there’s a lot happening behind the screens to bring that vast (and growing) range of typefaces to you, super quickly.

In the past, developers had to rely on a handful of common fonts that came bundled on most devices or “self-host” static fonts in their own source code. Today, they can turn to ever-expanding online resources like the Google Fonts API. Simple to use, reliable on both the back- and front-end, always up-to-date, and totally free: say hey to your new favorite digital typography tool.

Sounds cool! But what exactly is an API, anyway? And what does it have to do with web fonts?

An API, or “application programming interface,” is basically a web server that offers data on demand, and can cover anything and everything from maps to mobile banking. The Google Fonts API provides a free, public library of typefaces for web and mobile applications. Since launching at Google I/O in 2010, it’s been developing steadily, and currently serves billions of pages to billions of users every month on millions of websites all around the world.

How does it work?

All you have to do is add a link in your HTML that points to Google Fonts, and use CSS to style your content; your selected fonts will then be sent to your readers when they request them. By linking to the Google Fonts API, you get a reliable, working font served through Google’s global content delivery network.

Updates happen organically, so webmasters won’t have to manually upgrade to take advantage of improvements to the fonts they use. This also means that the fonts on your site may change very slightly over time as refinements are made by type designers and approved by Google, and when Google’s engineers make efficiency improvements using the latest technologies.

Whoa–I’m pretty particular about my typefaces. What’s actually happening on my site when a web font gets automatically updated?

Most of these updates are actually on the engineering side of things; seamless changes that will facilitate general functionality. The API does a bit of processing, and understands each reader’s digital environment; essentially, it can discern what kind of device, browser, and operating system it’s serving. This is a big deal, because Windows machines require fonts with “hinting” data–metadata that improves on-screen rendering–while mobile operating systems don’t. Hinting data can be up to half the file size, and therefore removing it can reduce latency by half. If you’re self-hosting, everyone’s getting the same files, which could have way more info than they actually need; if you’re using the Google Fonts API, the process is totally streamlined, and optimized for each unique system.

We’ve also added and expanded language support over time. For example, with CSS unicode-range, if the font family you use to style comments on your site has new support for the Cyrillic writing system, and a user posts a comment in Russian, their comment will be rendered in the font; the current versions of all browsers will only download the Cyrillic part when needed. You didn’t need to update your site to specify you’d like to accommodate Cyrillic (as you’d have to do when self-hosting)—and your homepage without any Russian text will load just as quickly as before.

And on the design side? Yes, there will be very occasional changes to the look of the fonts offered through the API. However, this is not a bleeding-edge service with daily churn; any given font might get minutely modified once a year (if that), and Google reviews and approves all the changes that type designers make to their projects before going live. For those keen to track, you can ‘watch’ the Github repo for emails about all update discussions, and/or follow us on Twitter for a more selective stream of announcements.

Got it. So, what are the main benefits of using the API?

Speed is a biggie. The Google Fonts API does optimizations to make single sites load quicker, but the most significant thing (that may not be obvious) is that it capitalizes on cross-site caching. This makes the whole web work more efficiently. Think of it like this: Sites A, B, C, and D all feature Roboto from the API. After visiting site A, Roboto is loaded and cached on your device; when you visit B, C, and D, the font then loads instantly from that cache. (If each of those sites were self-hosting, Roboto would have to load separately from every individual URL, which is predictably slower.) Over time and across the whole web, this adds up to a considerable performance gain, especially for sites with higher traffic.

You’re also benefiting from the latest improvements for different browsers. When Chrome or Firefox adds support for a font format like WOFF2–a new compression algorithm–the API will get to work on delivering it automatically. As soon as a browser adds support for CSS unicode-range–where the browser only selects the font info it needs based on what’s on your site–the API will improve latency (aka speed) without users having to do anything. (Check out our Korean fonts, which recently launched; typically they have very large file sizes, but by using WOFF2 and unicode-range our team was able to save bytes and reduce lag-time.)

Keeping everyone on the latest version means you always get the best fonts in real time.

How many fonts are available?

The Google Fonts catalog has over 800 Latin typefaces in a range of styles for almost every use case. The collection began with the Latin, Greek, and Cyrillic designs for languages commonly used in North America and Europe, and has expanded in recent years to languages of the Middle East (such as Arabic and Farsi), South Asia (such as Devanagari and other Indic scripts), and Asia (such as Thai, Vietnamese, and even Korean). Today we offer support for over 60 languages, and the list continues to grow.

Okay: I’m in. How do I get started?

Awesome. For a more detailed walkthrough, check out this guide to getting started with Google Fonts. If you’re an Android developer, check out this guide to using the Google Fonts API to improve the typography of your app. Happy typesetting!