Ask DN: How are you avoiding the flickering effect on web fonts?

over 6 years ago from Askar Hussain, Chief Everything Officer - ARSHTec

  • Gavin AnthonyGavin Anthony, over 6 years ago
    • Font preloading can really increase load times: <link rel="preload" href="font.woff2">
    • Host the font file on your own site if you can. If it's hosted on your own server, you can leverage the browser cache with far future expire headers.
    • Gzip your css/font files. I'd recommend doing this on all text-based assets, too.
    2 points
    • Askar HussainAskar Hussain, over 6 years ago

      I thought about font preloading but that would require purchasing those fonts to be self hosted (which could add up if you have multiple variations). If you are on a budget (bootstrapped) Typekit comes in handy in terms of price but not in terms of UX (with those ugly flickerings).

      0 points