Zach’s ugly mug (his face) Zach Leat­herman

An Unhealthy Obsession with Web Fonts & Type

A list of 61 posts and projects dealing with web fonts, web font loading, or typography.

  1. 2021 ×2 Sparkline representing frequency of posts written by month in 2021
  2. Uniclode: yet another demo of Eleventy Serverless 5
  3. Unicode Range Interchange 2k6
  4. 2020 ×1 Sparkline representing frequency of posts written by month in 2020
  5. Speaker Spotlight: a chat with Vitaly Friedman 19 min
  6. 2019 ×8 Sparkline representing frequency of posts written by month in 2019
  7. HTTP Archive’s Web Almanac 2019—Web Fonts Edition IndieWeb Avatar for https://almanac.httparchive.org/en/2019/fonts
  8. Developing a Robust Font Loading Strategy for CSS-Tricks #1923k88
  9. Smashing TV: The Five Whys of Web Font Loading Performance
  10. Spicy fonts and static sites 🌶️—JS Party #79 IndieWeb Avatar for https://changelog.com/jsparty/79 67 min
  11. font-display is Incompatible with Icon Fonts 9k40
  12. Web Engineering Düsseldorf IndieWeb Avatar for https://www.meetup.com/Web-Engineering-Duesseldorf/events/260995020/
  13. The Scoville Scale of Web Font Loading Opinions 1k3
  14. Google Fonts is Adding font-display 🎉 IndieWeb Avatar for https://fonts.google.com/#946k57
  15. 2018 ×11 Sparkline representing frequency of posts written by month in 2018
  16. Working Draft Podcast: On Tour @ #perfnow 5/6 IndieWeb Avatar for https://workingdraft.de/on-tour-perfnow-zach-leatherman/ 21 min
  17. Should I Use JavaScript to Load My Web Fonts? IndieWeb Avatar for https://www.filamentgroup.com/lab/js-web-fonts.html
  18. The Five Whys of Web Font Loading Performance 46 min4k4
  19. A Group of Web Font Repaints is called a Michael Serif
  20. The Problem with font-display and Reflow 5k23
  21. The Font Loading Checklist #2025k9
  22. Obnoxiously Readable Responsive Text with Viewport Units 5k1
  23. preload with font-display: optional is an Anti-pattern 4k27
  24. “The Compromise”—a Modern but Compatible Font Loading Strategy 4k26
  25. It’s Dangerous to Go Stallone. Take Glyphhanger 6k9
  26. Web Fonts are ▢▢▢ Rocket Science IndieWeb Avatar for https://www.filamentgroup.com/lab/rocket-science.html 47 min
  27. 2017 ×11 Sparkline representing frequency of posts written by month in 2017
  28. 23 Minutes of Work for Better Font Loading #1619k25
  29. Managing Font Loading CSS Was Painful—Not Anymore 5k
  30. A Collection of Web Font Loading Recipes 3k1
  31. FOIT vs. FOUT, a Side by Side Comparison 12k6
  32. A Historical Look at FOUT and FOIT 4k27
  33. Web Standards Podcast #85 86 min
  34. The Web Font Loading Glossary 15k3
  35. Font Aliasing, or How to Rename a Font in CSS 16k79
  36. Laissez-faire Font Smoothing and Anti-aliasing #2017k57
  37. CSS-Tricks Video Screencasts #152: Font Loading IndieWeb Avatar for https://css-tricks.com/video-screencasts/152-font-loading-zach-leatherman/ 57 min
  38. Shop Talk Show #247: The Performance Equation IndieWeb Avatar for http://shoptalkshow.com/episodes/247-performance-equation/ 72 min
  39. 2016 ×8 Sparkline representing frequency of posts written by month in 2016
  40. No @font-face Syntax will ever be Bulletproof, Nor Should It Be. 3k1
  41. faux-pas, Detecting Faux Web Font Rendering
  42. Lazy Loading Web Fonts Is Probably Not What You Want 6k5
  43. A Comprehensive Guide to Font Loading Strategies #2202k182
  44. Web Fonts for President 2016 #827k10
  45. The Web Fonts: Preloaded #729k10
  46. Web Font Anti-pattern: Data URIs 15k117
  47. Critical Web Fonts #1520k6
  48. 2015 ×9 Sparkline representing frequency of posts written by month in 2015
  49. Using Custom Fonts Responsibly, an Akamai Animated Short 5 min
  50. A Brief History of that Time You Used Web Fonts—SmashingConf Barcelona 48 min
  51. The Performance and Usability of Web Fonts—Velocity New York City 42 min1
  52. Smashing Book #5
  53. The Mitt Romney Web Font Problem 9k78
  54. The Performance and Usability of Font Loading—Velocity Santa Clara 39 min1k1
  55. Better @font-face with Font Load Events—SmashingConf Whistler 48 min
  56. Flash of Faux Text—still more on Font Loading #1222k2
  57. How we use web fonts responsibly, or, avoiding a @font-face-palm IndieWeb Avatar for http://www.filamentgroup.com/lab/font-loading.html
  58. 2014 ×6 Sparkline representing frequency of posts written by month in 2014
  59. The Making of Font Family Reunion 19 min
  60. WOFF2 See the Wizard, a Wonderful JavaScript Feature Test IndieWeb Avatar for http://www.filamentgroup.com/lab/woff2.html
  61. A Font Family Reunion 8k116
  62. Better @font-face with Font Load Events on Dev.Opera IndieWeb Avatar for https://dev.opera.com/articles/better-font-face/
  63. Bulletproof Icon Fonts—CSSConf 26 min
  64. Bulletproof Accessible Icon Fonts IndieWeb Avatar for http://www.filamentgroup.com/lab/bulletproof_icon_fonts.html
  65. 2011 ×2 Sparkline representing frequency of posts written by month in 2011
  66. FitText + BigText: A Tale of Two Plugins #631k6
  67. BigText Makes Text Big #7167k376
  68. 2010 ×3 Sparkline representing frequency of posts written by month in 2010
  69. Point, Charset, Match: Character Encoding in JavaScript 14k1
  70. CSS 3 Text: A Tale of writing-mode Woe #1720k3
  71. DIY Webdings—CSS Sprites using @font-face 10k026
Built