Navigation Fallback Font

Hi,

We’re having a slight issue with the font initially loading when the website is loading up. It will do a slight ‘flicker’ and load a fallback font before loading the actual menu font.

I checked the console and it shows a ton of ‘Slow network is detected. Fallback font will be used’ errors. It happened on both my dev server and the clients server.

The errors reduce if I disable plugins etc, but do not completely disappear, and the issue still happens.

Will attach link privately so you can see for yourselves - thanks!

Hi there,

Actually, that is a normal behavior of the fonts as it takes time to load the font in the browser. One way around this is to have a faster server or using the cache plugins.

The cache plugin, caches the font for you and you see the flicker only once and after that, you will not see as the font is already in the visitor’s browser cache and it will load fast.

For more information about cache plugins:

Thank you.

Thanks - appreciate the speedy response.

We have W3 setup so that’s what puzzled me most, as it’s seemingly cached for myself, but not for the client, or my partners laptop, or others that have tested it - though we have no other caching issues (that I’m aware of).

On my partners laptop, for example, it’s almost as if the font starts out larger, then after about 0.5s, goes into it’s normal state, rather than very quickly ‘flickering’ as happens for myself when in an incognito tab.

Hey @Jord,

What you’re seeing is called a FOUT and caching is only one of the ways to make your fonts load faster. There are still a lot of things you should do depending on your setup. But, the bottom line is, you need to optimize your site and that includes careful selection of the fonts whether it loads fast or not. Server selection is also important.

Thanks.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.