Universal Typography

Tim Brown  •  @nicewebtype

Quite a bold claim. Can typography be universal? Can it work for everyone and still look good? How can we practice? What should we study? Which fonts and tools work best? Should designers and developers work together on this?

Chris Coyier and Dave Rupert invited Tim to be a guest on Shop Talk Show! Hear episode 172 →

Typesetting demo

Debuted at An Event Apart Atlanta in 2015, this simple tool demonstrates the multidimensional nature of typesetting for the web, and shows how font metrics can power recommendations for better typography. (special thanks to Greg Veen, Bram Stein)

Watch the talk on Vimeo · Demo · GitHub

Adobe Typekit

Typekit is the easiest way to get, manage, and use fonts. Built and used by some of the smartest developers and designers alive, trusted by agencies, publishers, and brands around the globe, it’s been my tool of choice since I started designing with web fonts in 2009. I was thrilled to join the team in 2010.

Typekit.com · Typekit Practice

Modular Scale

Modular Scale is a calculator for ratio-based measurement in web design. By basing the dimensions of our compositions on values from modular scales, we can achieve a visual harmony not found in layouts that use arbitrary, conventional, or easily divisible numbers. (with Scott Kellum)

Modular Scale · ALA #327 · Build talk

Molten Leading

Compositions grow and shrink, type reflows and resizes, and whitespace should flex too. Molten Leading is an appeal for fluid, proportionally-aware whitespace on the web. It began as a formula, then small scripts. It belongs in CSS. (with Viljami Salminen, Mat Marquis, and others)

Molten Leading · Original blog post

Type Rendering Mix

Type rendering on the web is the result of many layers of complex technology. Type Rendering Mix is a script that adds classes to the HTML element so that CSS can be tailored to the specific rendering engine and antialiasing settings of any given reader. (with Bram Stein)

Type Rendering Mix · GitHub

Web Font Specimen

Web Font Specimen is a handy, free resource web designers and type designers can use to see how typefaces will look on the web. Debuted in a special issue of A List Apart, Web Font Specimen is now in its second iteration, and is being built into other tools and websites.

Web Font Specimen · ALA #296

”You managed to turn a back end developer seriously passionate about typography in all of 45 minutes. What a brilliant talk.” — Mark Bridgett

Universal Typography

The web is universal and, in this talk, Tim Brown shows us how to practice typography in a way that is equally universal. Focusing on traditional typographic principles, while also embracing progressive enhancement, Tim explains how fonts, CSS, web-enabled devices, and user contexts coexist. Together, we will reevaluate what it means to successfully set type — and inform our routine decisions about typefaces, font sizes, and white space.

”Getting a crash course in typography. This talk is incredible.” — Dave Hicking

”Five minutes into Tim’s talk, and I’m hooked.” — Ethan Marcotte

Typesetting Body Text

Typesetting body text for the web is an enormous challenge. It's a complicated, expensive process, and it contradicts tenets of typography that are widely considered fundamental to good design. But doing it well fortifies your brand, lends authenticity to what you say, and clarifies your messages. And body text can act as an anchor, making other design decisions easier. In this talk, Tim Brown welcomes you to hone productive typesetting practices — with many specific tips, as well as a solid overview of the scope, dependencies, and effects of our typographic decisions.

”One of the best talks I’ve ever heard.” — Liz Lara

”If you ever have the chance to see Tim Brown speak, do it!” — Samantha Warren

Where & when

  • 2018

Previously