Pages load with different fonts

(Juraj Masiar) #1

I’ve noticed for past few weeks (months?) that sometimes MDN page loads with strange looking font:

Refreshing page loads correct font:

Sounds like a bug, right? Or is this a feature where page loads faster first time because it doesn’t wait for the font to download?

Also where should I report this kind of bugs? There is a lot of repositories (79!) on github:

(Janet Swisher) #2

Maybe @Schalk_Neethling can answer your core question. I know he’s been making changes to fonts on MDN.

Also where should I report this kind of bugs?

Issues for the MDN platform are tracked in Bugzilla. You can submit a bug report there.

(Schalk Neethling) #3

Hey @juraj.masiar

Thanks for reporting. This looks to working as designed. We use the font-display css property with the value of fallback for these fonts for performance reasons. That could sometimes mean that the loading of a specific font is abandoned if it takes to long to load. It might swap in later, or the browser can simply decide to abandon it altogether.

The reason it then loads on a refresh, is most likely because the font is cached, and thus loads almost instantly.

You can see the code here:

And read more about the property here:

(Juraj Masiar) #4

I was afraid of that :frowning:

But even if it works as designed, something else is not well designed as I’m on MDN almost every day so these fonts should be well cached.

Also if someone asks me to name 3 pages that can be loaded with different font, I’m pretty sure I can name only one.

Maybe it’s just me but I find this inconsistency very annoying.

(Sphinx Knight) #5

I’ve also found that I get the fallback font on a slow/old machine much more. I didn’t analyze/report yet but I concur that I had inconsistencies between some pages for the same session :confused:

(Eric Shepherd) #6

I think it would be nice if at least similar common fonts were used as the backup font; for instance, it seems obvious that the fallback for Zilla should be Courier or Courier New since they are similar typewriter-style faces. This at least would be a less jarring difference.