Fonts not displayed correctly - prints unreadable jibberish
Hi all, I'm having an issue that I've seen mentioned over several years and without a workable solution - I'm at the point of having to transfer all my browser usage to chrome and abandon my beloved firefox. The issue has been 'answered' by advanced users to tell people to 'inspect' which font is the issue then check local systems font book for corrupted/duplicate fonts: however this is not a satisfactory response. Context: see screen shot attached for what the jibberish looks like, and a point in the 'inspect' view that I believe (guessing) is involved. System: Firefox 112.0.2 (64-bit), MacOS 13.3.1 (a) (22E772610a) on Macbook Pro (13-inch, 2020, 2 GHz Quad-Core Intel Core i5). This same websites do not have any issue on the same computer viewed on Chrome or Safari. Nor is there any problem on my iPhone on the iOS firefox browser.
Firstly this is not a user-friendly solution for most people, I'm afraid. Opening the inspect viewer is mindboggling for anyone who doesn't code and even for people who do some programming but not for websites (like me), it isn't exactly self-explanatory. I think I've managing to find examples that indicate 'Roboto' seems to be consistently involved in the display issue. Secondly, the step for 'fixing' the font that is the culprit - my local system indicates that all fonts are valid and there are no duplicates. I haven't installed manually Roboto as I'm uncertain where to 'safely' get the font from and my computer is owned and managed by my workplace - with overly strict administration/security rules so if I f-up a download of something dodgy my IT service will blacklist me and revoke my admin access... ** which would mean I'd be unable to do my job!**. I wondered if perhaps there is some security setting due to that, which stops website from loading the fonts they choose? From previous 'solutions' it said that having Firefox preference set to "allow websites to choose their own fonts..." should mean the websites can load as needed. If indeed I must manually download fonts for each and every instance that Firefox fails to display text legibly that is equivalent to Firefox being unusable. I'm clearly frustrated and it's because I love FIrefox and the ethos behind it all so leaving for Chrome would be very sad indeed! Help and a solution for normal users would be so very much appreciated. Also where can I properly lodge this issue with peeps who fix things? There are issues of this kind going back years and for both Windows and Mac Systems so it's not a one-off problem but a recurring one! Please pretty please, people who do the magic that makes Firefox - fix this issue... Thanks for reading my rant and for any helpful responses. Cheers, Megan
All Replies (8)
Issues with a weird looking font can be caused by a problem with a specific font and you need to identify this font and fix this. You may find that it can be resolved by finding and removing duplicate fonts installed in the local ~/Library/Fonts folder, that are conflicting with standard system fonts.
You can check in Font Book for font issues like corrupted and duplicate fonts. Note that you shouldn't disable "Allow pages to choose their own fonts, instead of your selections above" as this will cause issues with iconic fonts used by webpages to display small icons (you may see text labels instead of icons).
You can right-click and select "Inspect" to open the built-in Inspector with this element selected.
You can check in the Rules tab in the right panel in the Inspector what font-family is used for selected text. You can check in the Fonts tab in the right panel in the Inspector what font is actually used because Firefox might be using a different font than specified by the website.
Thanks for promptly responding Cor-El and I note that you've offered this response multiple times in the past. While I'm sure that what you advise may be generally applicable. I'm afraid you've copy pasted this response without address half the point of my original query: this solution is not viable for most users! If this issue occurs so often and across different platforms there's a deeper problem then a local system having a bad font. In this instance my font book categorically indicates there is not issue with any fonts: screenshots report says all fonts valid and no duplicates found.
Please take a min before you copy-paste this response to this issue again because for most users you aren't offering a solution. I don't mean to dismiss that you are trying to be helpful and that you are no doubt offering something that is a workaround for people who can delve into 'devtools' and 'inspect' but a work around is not a solve... know what I mean? Thanks again for your prompt response!
The last part in that reply about identifying the font that Firefox uses is usually what matters in case you missed this.
- 1815502#c2 - Some text getting garbled/corrupted
(please do not comment in bug reports
Cheers. These steps to resolve a font issue still don't explain why it only occurs for firefox and not any other browser on the same system - so it's a firefox issue not a system font book issue, right?
If fonts are not displayed correctly and print as unreadable gibberish in Firefox, it may be caused by several factors. Here are some steps you can take to troubleshoot and fix the issue:
Check for missing fonts: Make sure that the fonts used on the web page are installed on your computer. If a font is missing, Firefox may substitute it with a default font, which can cause text to appear garbled or unreadable. Check if the missing font issue is specific to one website or if it occurs on multiple sites.
Clear cache and cookies: Clearing your browser's cache and cookies can sometimes fix issues with font display. To do this, go to the Firefox menu and select Options > Privacy & Security > Cookies and Site Data > Clear Data.
I'm with Megan on this one. Ever since I switched to a new PC about 8 weeks ago, a moderate number of websites are showing gibberish font. I'm now on Win 11, using the IDENTICAL font set that used on my prior Win 10 PC which had no gibberish font issues, ever. I checked in Corel Font Manager, and all fonts show proper installation. For example, this website https://cenacolovinciano.vivaticket.it/ looks like this (see attached).
I would say this is happening on 1 of every 50 websites I browse.
Hi Megan, I assume this is a complicated issue to fix or else it would have been fixed by now. cor-el's link leads to numerous bugs on file, in various stages of redress, related to font issues on Mac. Hopefully these will make Firefox more tolerant of situations that have caused it problems in the past.
For immediate troubleshooting purposes, if you are still using Firefox, the Font Inspector is part of the Inspector section of the developer tools. After you right-click a problem paragraph in the page and click Inspect, Firefox should focus that element in the HTML tree. On the right side, you typically see Rules. Along the line with Layout Computed ... click Font to show the font name and file name being applied to the text:
If it says that Firefox is actually using Roboto -- a downloadable font file that usually is not installed locally -- then the substitution of a serif font is very odd.
Hi jl11, it looks like your Firefox is okay with the "Cormorant Garamond" font but chokes on the MontSerrat fonts. For me, these are both unfamiliar and would be downloaded on demand from the site. Do you have either of those installed locally?