Web Font Anti-Patterns

A series of articles by Bram Stein on typography, performance and modern day best-practices for using fonts. I particularly like what Bram has to say on overusing web fonts:

An­other re­cent trend is us­ing web fonts where they’re not ap­pro­pri­ate. Don’t use web fonts if you don’t need them. They’re not the right an­swer for every­thing. If you find your­self wrap­ping each let­ter or word in a span el­e­ment in or­der to style them — stop. Use SVG.

Most of the times when you’re wrap­ping words and char­ac­ters in span el­e­ments you are ac­tu­ally at­tempt­ing to do let­ter­ing in HTML and CSS. There is a fine line be­tween type and let­ter­ing, and web browsers are not great at the lat­ter. SVG on the other hand is a great fit for let­ter­ing. It’ll give you ab­solute con­trol over kern­ing, track­ing, po­si­tion, gra­di­ents, mask­ing, and colour. As an added bonus, the re­sult­ing SVG file size will be smaller than load­ing sev­eral fonts.

Anselm Hannemann also has a take on webfont loading best practices.

Direct Link →