Sean McBride: A Renaissance in Web Typography

Typekit’s Sean McBride had come over from San Francisco to give us an introduction to web typography. The jam-packed Drama Studio room made clear that there is still a demand for talks on the possibilities of typography on the web.

Sean McBride – Photo © Jason Wen

Webfonts ‘exploded on the scene’ three to four years ago. Web-designers realized they could do web-typography as all modern browsers, by then, had support for webfonts in some way or another..

Designers, all of a sudden, could use other fonts than the default Georgia, Arial, Verdana. Default because these are the fonts installed on most computers. Before webfonts you could only use fonts installed locally on the computer of your visitor. With webfonts, you send the font along with the website.

After this short introduction to webfonts McBride went into the differences between typography on the web and in print.

First there is the issue of licensing. Since you are actually sending the font-file to your visitors, and the old licensing models did not allow that, (re)sellers had to come up with different licensing models.

Then there are different formats than the rtf & otf files we were used to. There’s woff, eot & svg. Formats that are more efficient for the web.

A big difference to print is the rendering. Since all browsers and operating systems handle rendering differently, your type is going to look different on different platforms. Each computer has to try to figure out how to display small type on low resolution screens (most screens are generally around 75 pixels per inch). This has the effect that, for example, the type looks more fuzzy on OS X’s coretext and crisper on Windows’ directwrite. It’s a problem which will hopefully someday go away when higher resolution screens become more ubiquitous.

With webfonts it’s a good idea to keep page size in mind, as each webfont adds kb’s to be sent to the visitor.

And finally there’s fallback fonts to consider. You should define a stack of fonts to be used if your webfont somehow doesn’t load, and how this will affect your design.


Sean McBride

Sean is an engineer and product designer working at Adobe on Typekit in San Francisco. He joined Typekit in July 2010, where he has worked on improving browsing for fonts on the site, using fonts with third-party tools, and optimizing the delivery of fonts to browsers. He's happiest looking for opportunities at the intersection between user experience constraints and technical constraints. Before Typekit, Sean worked at Google in Mountain View as a user experience designer and web developer. He built prototypes for the Google Apps control panel, in-product help, Buzz, and finally Google+. He enjoys exploring San Francisco restaurants and cocktails.
McBride went on to cover the different rules and possibilities the web brings, which we must respond to. While we must not start with the old form and try to cram it into a new form. Instead, he mentioned an method Jonathan Hoefler talked about on Pivot: AIGA Design Conference: you start with an idea and through a design system you create the form. So for instance the content of a newspaper would be the idea, which would go through different design systems resulting in a newspaper and a website.

After this there was sadly not enough time left for McBride to go into detail on fluid or responsive layouts on the web. But luckily he had given us a good introduction to the possibilities of typography on the web by then.

The slides of the presentation are available here, including the inspirational good practice examples with which McBride started his talk.

By Jerry den Ambtman