Technical stack: Work with actual build tools, subset utilities, and performance monitoring—not just design principles.
Typography on the web involves trade-offs between design quality and performance. Every font file adds weight to your page, every custom typeface risks invisible text during loading, and rendering differs wildly across browsers and operating systems.
You'll learn font loading strategies—FOUT versus FOIT, font-display properties, and preloading critical typefaces. We cover subsetting to reduce file sizes without losing the characters you need, and variable fonts as a solution for multiple weights without multiple files.
This isn't theoretical. You'll measure actual load times, layout shift scores, and rendering differences. We test fonts on throttled connections, older devices, and different operating systems to see where your choices cause problems.
The technical content includes WOFF2 compression, unicode-range subsetting, self-hosting versus CDN delivery, and fallback font matching to minimize layout shift. You'll also work with font-feature-settings for ligatures, alternate characters, and tabular figures—understanding which features are worth the complexity.