Webfonts are a tricky thing to get right — the usual formula is: attractive visuals, good performance & reliable functionality (pick two). This episode is about how you can get all three by properly employing a fallback font while the webfont loads.

This episode comes in two parts: loading Webfonts properly & tuning the fallback font's CSS. This second part is an often-overlooked part of the process, and leads a lot of projects to conclude that the best way to use Webfonts is to hide the text until the font has loaded. And, as anyone who has stared at a blank screen on their mobile for 10+ seconds will tell you, that's not ideal.

Learn how you can cater for the unpredictable circumstances of your users without compromising the visual quality of your build.