"Web performance is an intricate topic but well worth the effort. Cutting down initial network requests through progressive enhancement and lazy loading is useful to make initial rendering as fast as possible. Showing basic content first, and then loading enhancements like fonts, media, and scripts later, brings the user experience in harmony with aesthetic designs and business goals."

Web fonts are awesome. They make your sans-serifs slabby, your headers special and your website look gorgeous. But fonts are a resource, and downloading resources always comes as a cost — if you don’t load web fonts efficiently, what you get instead are phantom underlines, blank pages, and user rage. Let’s talk about ways to avoid this, and what new platform features are here to help us deliver pretty (but also!) fast experiences to everyone.

Web fonts are difficult to get right. An often overlooked and disruptive piece of web performance, web fonts can slow down your site and leave your visitors confused and agitated. No one wants agitated visitors. In this talk we’ll discuss useful methods to render web fonts quickly and without disruption so that visitors can do what should be a simple task—read the text. After all, web fonts are not rocket science.

subfont – a command line tool to statically analyse your page in order to generate the most optimal web font subsets, then inject them into your page. Now listed on Perf Tooling.

So which method should you use to load your webfonts? Unfortunately the answer is it depends:

• If you’re looking for a quick and simple method you can have working within an hour, use Amazon’s method
• If you want something a bit more thorough and are alright with the limited browser support for now, try using font-display: optional
• And if you really want to make an effort to optimize your webfont loading, take the dive and look into the localStorage technique

Utility to automatically subset fonts for serving on the web.

The above steps can serve as a shortlist of things you can quickly do to make an improvement to your site. It doesn’t have to be the best—just make it better!

Les polices de caractères comme amélioration progressive : il ne sert à rien d'avoir la déclaration @font-face la plus verbeuse et tolérante possible. Au contraire : pour une maintenance de qualité, il faut envisager la simplicité… et délaisser certains utilisateurs.

"BLOKK fontBLOKK is a font for quick mock-ups and wireframing for clients who do not understand latin. BLOKK gives you a nice fill text for mock-ups and wireframing without the lorem ipsum. The new and better wireframing font."

"This method builds on the Flash of Faux Text (FOFT) using a two stages loading process (sounds like, but is not actually rocket science), but instead of a full Roman web font in the first stage, it loads a small subset of the Roman web font"

"stop using icon fonts for people with screen readers, people with dyslexia, people with browsers that don’t support @font-face or people who randomly didn’t load the icon font once for some reason"

A deep dive into @font-face

Un excellent cas concret pour expliquer la problématique du chargement asynchrone des polices d'écriture.