58

Spent more than an hour on client's computer trying to figure out why it was rendering a font in bold, while every other device I tried (even with same browser/OS/screen DPI) rendered it in normal weight. Google Fonts were loading fine. After banging my head into TeamViewer window for the Nth time, I found the problem. The font was installed on client's computer locally, so it was overriding remotely loaded Google Fonts. What's the problem then? The local version only had bold version.

Deleting the local font fixed it.

Comments
  • 14
    Good investigative work there! Custom fonts are great but this shows there are some issues. It is a shame that you are unable to load in a custom font and pass a parameter that tells the browser to ignore the local font.
  • 5
    Welcome to DevRant 😉
  • 3
    You won't be able to delete every computer with only Raleway Bold installed though. Do you think defining font weight will help for this kind of issue?

    My css skills are bootstrap and Google level. I wish I can help out better 😁

    Edit : Googling result is to remove local() line or use different name like local(Raleway Raleway).
  • 2
    @laceytech font overrides are important for accessibility options. In the end the user should decide, even if it turns into this kind of bug report once in a while
  • 1
    @mrlinnth that would require not using Google Fonts. I could, of course, download and host the font among my other assets, but I think this is too much of an edge case. I guess Google knows better than me when deciding whether to use local().
  • 1
    @doompling yes technically you won't be using the up-to-date google font of your choice. But you can always embed the Google font css by yourself and it will be fine. And yes this is also another duct-tape fix.
  • 0
    I'm starting to despise that fucking font. It's everywhere!
Add Comment