Feb 16, 2022

Say hello to Roboto Serif

The newest member of the Roboto superfamily is designed to make reading more comfortable at any size, in any format.

Posted by


Get it on Google Fonts and check out the specimen: Getting Comfortable With Roboto Serif.

It's been almost 20 years since the introduction of Matthew Carter’s Georgia—one of the first serif typefaces designed to make reading easier on the low-resolution screens of the time. That year (1993), Americans with Internet access spent fewer than 30 minutes a month surfing the Web. Now we spend almost seven hours a day.

Thankfully, reading on-screen has gotten a lot more comfortable since the 90’s. For one thing, you can pick up your device and move over to the sofa. Letterforms are also crisper, smoother, and more legible on today’s screens/devices—and they render more quickly. But another huge (though perhaps less obvious) factor in all of this is the advancement of font technology. Georgia was one of the first eleven “Core Fonts for the Web” that paved the way for OpenType and, eventually, variable fonts. Today, a well-designed, OpenType serif can be just as readable on-screen as it is in print. And a well-designed variable serif can give readers additional benefits on-screen. Enter: Roboto Serif.

“Our aim has been to make a typeface that you could use for long-form journalism or a novel—something very long and involved; an immersive piece of text that you read on your phone—without wanting to complain about it.”
—Greg Gazdowicz, Commercial Type

Roboto Serif joins the functional Roboto superfamily alongside Roboto (sans serif), Mono, Slab, and Condensed. But unlike Roboto Slab, the design of which was derived directly from Roboto, this newest serif brings its own identity to the collection. “We wanted it to feel comfortable next to a sans-serif, and not to feel cluttered. It doesn't need to have serifs everywhere to drive home the point that, ‘I am a serif and have serifs in all the places serifs go,” said Rob Giampietro (formerly of Google Fonts, now a UX manager at Google). Giampietro initiated and guided the early development of the typeface with Greg Gazdowicz of Commercial Type. With their extensive experience in developing typefaces for longform publications (The Guardian, Vanity Fair, Helsingin Sanomat et al.), Commercial Type was a natural fit for the Google Fonts project.

Roboto Serif is a minimal workhorse for comfortable reading by Commercial Type and Google Fonts.

Gazdowicz and his team took an unconventional approach to type design with Roboto Serif. Instead of building off of an existing or historical typeface, they “atomized” the letterforms, breaking down the serif typeface to its elemental parts. Then they built them back up by experimenting with various proportions, contrast types, terminal shapes, and serif shapes to find out what was most legible for each character. “It was really a matter of stripping out subtleties to find very deliberate shapes—and make deliberate decisions,” said Gazdowicz.

Roboto Serif was created by experimenting with different shapes and proportions to find out what was most readable.

Challenging the basic assumptions about the elements of type design, he asked, “Do ball terminals need to be balls? Do serifs need to be serifs? Which shapes could work well here, brackets or not? What level of contrast works well? We’re not just looking at the highest quality screens, or developing for lower quality ones, but asking, ‘what is native to reading on screen?’”

Each letterform was drawn from scratch to create a typeface that “thinks about Roboto, but is a new and original design,” said Giampietro.

“Often, when a type designer talks about doing something experimental, they mean doing something weird or distressed, or a funny letter form. But this was experimental in the sense of coming up with thesis statements—and then testing them.”
—Greg Gazdowicz, Commercial Type

The resulting aesthetic harmonizes with the rest of the Roboto superfamily instead of duplicating it in serif form. With curves anchored to decisive terminals, it’s minimal with just a “whisper” of a serif. This minimalism separates it from other variable serif fonts made for on-screen reading (e.g. another favorite, Literata by TypeTogether, which has a slightly more intricate design) and makes it more versatile. In fact, Gazdowicz wanted to create a serif for contexts where they usually don’t work at all. “If you pick Roboto Serif for a project, you can use it ‘on the side’ of your UI for infographics, or even menus,” he said.

In addition to its minimal design that works well at any scale, Roboto Serif was created as a variable font with weight, width, grade, and optical size axes.

Roboto Serif automatically optimizes to be most legible for the point size you choose.

Roboto Serif’s Optical Size axis is especially noteworthy. Optical sizes are different versions of a typeface optimized for use at specific sizes or size ranges. In order to include an optical size axis in a variable font, type designers draw the typeface at least twice—once for small applications (e.g. body text) and another for large applications (e.g. display text). Then the user can designate any point in between those two extremes to optimize the design for the size of their text.

144pt Roboto Serif set in 144pt optical size (left) and 8pt optical size (right)

Small optical sizes tend to have lower stroke contrast, more open spacing, taller x-heights, and exaggerated details in comparison their display counterparts, but these transformations aren't necessarily linear from micro to text and from text to display. For Roboto Serif, Commercial included six optical sizes (micro, small text, text, deck, display, and poster). This level of refinement across such a wide range of optical sizes makes it a perfect workhorse; a go-to typeface for almost anything at any size. And, with the CSS property “font-optical-sizing” that’s now on by default in every major browser, type displayed with a variable font like Roboto Serif optimizes automatically for on-screen readability.

“In some ways, this is a proof of concept in the world for variable fonts. We wanted to make a showpiece of a vanilla text typeface for comfortable reading that can be finely adjusted.”
—Greg Gazdowicz, Commercial Type

Roboto Serif is Open source and available now from Google Fonts. Try it out and let us know what you think!

Illustrations by Kyle Platts, Art direction by Elana Schlenker, Animations by Q Choi

link
Copy link Link copied

About the type designer

Greg Gazdowicz (b. 1988) hails from the suburbs of Gaithersburg, Maryland. He studied graphic design at the Maryland Institute College of Art, then completed the Type@Cooper Extended program in 2014, months after joining the design staff of Commercial Type. Greg has designed custom typefaces for Mailchimp, La Repubblica, Google, and New York magazine, and has released several families through Commercial Type, including Robinson and the ambitious Terza family.

link
Copy link Link copied

About the type foundry

Based in New York and London, Commercial Type is a joint venture between Paul Barnes and Christian Schwartz, who have collaborated since 2004 on various typeface projects, beginning with the award winning Guardian Egyptian, through to typefaces for clients worldwide including Vanity Fair; Helsingin Sanomat; T, The New York Times Style Magazine; MoMA; Visa; and Chobani. Commercial Type has also published typefaces that have helped to define the look of the last 10 years, including Graphik, Druk, and Dala Floda.