What are Web Fonts? (Best Practices for 2021)

Typography accounts for 95% of web design. Your font choice can be critical for branding, readability, and performance. Recommendations for using web fonts have changed as browsers adopted new standards. Now in 2021, this video shares the best practices for using web fonts for high-performance sites.

0:00 – Introduction
0:19 – Web Safe Fonts
1:08 – System Font Stack
1:42 – Why Web Fonts?
2:08 – Self-Hosting
3:17 – Caching
3:39 – Font Display
4:24 – Flash of Unstyled Text (FOUT)
4:37 – Flash of Invisible Text (FOUT)
5:13 — Pre-loading
7:01 — Variable Fonts & Subsetting
8:28 – Conclusion

Links
–––––
1: https://ia.net/topics/the-web-is-all-...
2: https://thehistoryoftheweb.com/web-fo...
3: https://developer.mozilla.org/en-US/d...
4: https://systemfontstack.com/
5: https://almanac.httparchive.org/en/20...
6: https://developers.google.com/web/upd...
7: https://developers.google.com/web/upd...
8: https://csswizardry.com/2020/05/the-f...
9: https://web.dev/preload-critical-assets/
10: https://web.dev/variable-fonts/
11: https://github.com/leerob/leerob.io
12:    • Beyond fast with new performance feat...  

–––––
Blog: https://leerob.io/
Twitter:   / leeerob  
GitHub: https://github.com/leerob
Course: https://react2025.com/