One of the factors in whether font smoothing is done with whether Firefox is able to use hardware acceleration. If you compare your systems, can you see whether it is in use? Normally, this data appears on the support information page, either:

• "3-bar" menu button > "?" button > Troubleshooting Information
• (menu bar) Help > Troubleshooting Information
• type or paste about:support in the address bar and press Enter

If you scroll down to the Graphics section, one of the lines should indicate:

GPU Accelerated Windows

If the numerator of the fraction is zero, then hardware acceleration is not being used.

The value for "GPU Accelerated Windows" here in Windows 7 is:

1/1 Direct3D 11 (OMTC)

I would guess that the value would be the same in Firefox in my Windows XP installation, since it is the exact same hardware (single machine, dual boot), but I can't check it right now because Windows 7 is currently doing a pile of Windows updates, which I don't want to interrupt. I can check later though.

The OMTC indicates that your Firefox is using "off main thread composition." That is the default, but creates odd display issues on some systems. If you want to experiment with disabling it:

(1) In a new tab, type or paste about:config in the address bar and press Enter. Click the button promising to be careful.

(2) In the search box above the list, type or paste layers and pause while the list is filtered

(3) Double-click the layers.offmainthreadcomposition.enabled preference to switch it from true to false

Any difference?

Note: I read in a bug report a while back that this change could cause problems with the HTML5 player on YouTube, if hardware acceleration also is disabled. If you end up disabling hardware acceleration, you might need to force Flash on YouTube; you can use an add-on for that: https://addons.mozilla.org/firefox/addon/youtube-flash-video-player/

I switched "layers.offmainthreadcomposition.enabled" from true to false, restarted Firefox, and the value for "GPU Accelerated Windows" here in Windows 7 is now:

0/1 Basic

However, there is no change.

You can check if Firefox uses the same font on both computers.

You can check the font used for selected text in the Font tab in the right pane of the Inspector.

• https://developer.mozilla.org/Tools/Page_Inspector

Try to create a new Boolean pref on the about:config page via the right-click context menu with the name layout.paint_rects_separately and set the value to true and leave hardware acceleration and Direct2D enabled.

• about:config page: layout.paint_rects_separately = true

Try to disable Direct2D and leave hardware acceleration enabled

• about:config page: gfx.direct2d.disabled = true

Open Sans font is being used in both cases.

I tried adding the new Boolean preference with hardware acceleration enabled, both with and without Direct2D enabled, as per your instructions, and there was no change.

I am on XP right now, and this page looks perfect. It looks horrible on Windows 7. Somehow Firefox in XP is able to selectively smooth certain fonts (i.e., only the ones which need it), while Firefox in Windows 7 isn't able to do that.

I could enable font smoothing in Windows 7 to make the fonts on this page look correct, but that makes it apply the smoothing effect to all fonts, including the ones I don't want it done to (e.g., Windows dialog box and menu fonts, along with standard small-point fonts on sites like Wikipedia and Craigslist).

If you look at my XP Firefox screenshot, you'll see that the Windows fonts aren't being smoothed at all, which is the way I want it (if you were to zoom in on them using a basic "Nearest Neighbor" type zoom [such as the "Magnifier" function in MS Paint] you would see that they are comprised of just solid black pixels, no anti-aliasing whatsoever, while the fonts being rendered by Firefox on the web page have an anti-aliasing effect. However, if I went to e.g., Wikipedia, there would be no anti-aliasing effect on the web page fonts, because those particular fonts don't need it; like so - http://i.imgur.com/aeMeJNg.png

I would like to know how Firefox in XP knows the difference between fonts which need smoothing and fonts which don't, and by extension, I'd like to know why Firefox in 7 doesn't know the difference.

So no one knows why Firefox in Windows XP was able to selectively apply a smoothing effect to fonts, i.e., only apply smoothing to fonts which need it? Here's another screenshot from Firefox in XP showing what I mean:

http://i.imgur.com/Pmyz77P.png

In that screenshot, I have two instances of Firefox open at the same time; one of them is on this Mozilla Support forum page, and the other is on a Wikipedia page. I also superimposed zoomed-in views of the text to show clearly that the font on this page is being anti-aliased by Firefox (which is good, because it needs it), while the font on Wikipedia isn't being anti-aliased at all (which is also good, because it doesn't need it). This is perfect behavior, and rather ingenious, by why can't Firefox do it in Windows 7?

Also, I just checked the behavior of the two other browsers I have on XP: Google Chrome has the same perfect font-rendering behavior as Firefox does, while Internet Explorer 8 does not (it doesn't apply anti-aliasing to any fonts at all, so fonts that need it like on this forum page look horrible).

In Windows 7, Firefox and Chrome have the same poor behavior (they don't apply anti-aliasing to any fonts at all), while IE11 has poor behavior as well, but in the opposite direction (it applies anti-aliasing to all fonts).

To sum up:

Windows XP

Firefox & Chrome - only smooths fonts which need it (good) Internet Explorer 8 - doesn't smooth any fonts (bad)

Windows 7

Firefox & Chrome - doesn't smooth any fonts (bad) Internet Explorer 11 - smooths all fonts (worse)

Hi Gtks, the recommended link for old versions of Firefox is in this article: Install an older version of Firefox.

For quick version A/version B testing, it often is simplest to use "portable" builds of Firefox that run out of a folder with their own settings, an don't disturb the main installation. Those are available on Sourceforge: Portable Fx 38.0.5.

There is no difference using version 38.0.5 in Windows 7.

Ideally I'd like Firefox in 7 to render fonts exactly like it does in XP (I bet that anyone who has access to both 7 and XP can duplicate this problem by the way; just turn "Smooth edges of screen fonts" off in both XP and 7 [System Properties > Advanced tab > Performance Settings button > Visual Effects tab]), but I'd also be happy if I could just get it to treat fonts like on this forum as "normal fonts" instead of royally screwing them up. There is obviously something somewhere telling Firefox to treat certain fonts differently than it treats e.g., Arial, Times New Roman, etc.

One thing that works is to uncheck the box for Allow pages to choose their own fonts, instead of my selections above in the Firefox options, which makes every webpage use e.g., Arial (or whatever font you select), but always seeing the same font on every page kind of sucks, plus one of the pages I frequent the most uses Verdana, which is a somewhat wide font, and it becomes tiny when swapped with Arial.

I'm not sure I have any old XP systems that still run acceptably...

I have read about a technique for pointing font name "Font1" to the physical font file for "Font2" as a way of substituting fonts. This blog post describes the general principle and one way to create and apply such a custom style rule:

Helvetica on Firefox: Overriding Fonts with CSS | Keyvan Minoukadeh

I haven't tried it myself.

Unfortunately, it's not an out-of-the-box solution: You would need to build up a set of these rules over time to cover most of the popular ones as you discover them.

Or maybe someone has posted a set of rules somewhere on the web? I saw one which isn't for you that someone posted on userstyles.org to substitute Chinese fonts: https://userstyles.org/styles/116511/font-substitute (if you click the "Show CSS" link next to the Created date, you can see how it is set up).

I'm getting more to the root of the problem. Firefox isn't screwing up the rendering of Open Sans, it just isn't antialiasing it, and Open Sans appears to have been designed with the expectation that it would always be antialiased when rendered. If you look at it in its raw state (i.e., type it in an old version of MS Paint and zoom in), it looks exactly like it does in Windows 7 Firefox or Chrome with Windows font smoothing turned off. Here's a zoomed in view of it in its raw state:

http://i.imgur.com/thmObcO.png

Look at the letter "k" for example, half of it is bold and the other half isn't. All of the letter "l"s are bold, as are the "i"s and "t"s. Then look at the symmetry of the letters; the letter "o" for example. There are different pixel structures for 3 of the 4 corners, and only the lower left pixel structure is correct. This makes the letters look crude/jagged (and randomly bold) when viewed at normal size.

On the other hand, here is what a normal font (Arial) looks like in its raw state, zoomed in:

http://i.imgur.com/DIWsfQl.png

Note that there are no random bold letters or parts of letters and they are all symmetrical where they are supposed to be. This allows it to look clean/good at normal size; no antialiasing needed.

Firefox and Chrome both have a function to selectively antialias only the fonts which absolutely need it, such as Open Sans. When installed in XP, this function works perfectly (though people who have always left the default Windows font smoothing on would never notice, because all fonts get antialiased in that case, even normal ones which don't need it). On the other hand, when Firefox or Chrome is installed on Windows 7, this function gets broken, resulting in no fonts being antialiased, ever. And once again, most people have never noticed this because most people leave the default Windows font smoothing on, which smooths all fonts regardless of what the browser is doing. But surely the main Firefox developers know about this?

Open Sans seems to be the main offender, but Roboto is also an offender (which YouTube recently started using), both of which are products of Google. Maybe Google should leave font development to real type foundries such as Monotype if they can't make a font that looks okay without antialiasing.

I'll look into the automatic font substitution that you mentioned. If there aren't many offending fonts out there, it may be worthwhile. Automatically substituting Open Sans and Roboto with Helvetica or Arial would probably take care of a lot of it on the web.

By the way, I've confirmed that this is a Windows 7 issue, rather than being an issue related to my setup. I had a friend who uses Windows 7 and Firefox turn off font smoothing, go to one of the bad font pages, and take a screenshot and send it to me. Her screenshot showed the same crude / randomly bold text that I see in Windows 7.

For now I think I've found a livable solution. At first I tried automatic font replacement using a userContent.css file, which was somewhat successful, but the problem was, just replacing Open Sans with Arial wasn't enough, because there is also Open Sans Light, Open Sans Semibold, and so on. It would have been a never-ending hassle.

I noticed that Open Sans, Roboto, and so on, are not fonts I have installed on my system, so they must be being downloaded and cached by Firefox for use with pages that call for them. So I did a Google search about how to prevent Firefox from downloading fonts, and to do this, you set gfx.downloadable_fonts.enabled to false.

Doing that solved all the problems on this Mozilla forums page that I'm typing on right now, as well as on YouTube, and on the example page I used for the screenshot in the OP, because it automatically replaces Open Sans and other fonts I don't have installed, with a substitute that I do have installed. In the case of this forum page, Open Sans got substituted with Arial, and Open Sans Semibold got substituted with Arial Bold. Since Arial doesn't require antialiasing to look good/clean, there is no more eyesore here, and hopefully there won't be anywhere else either.

So I still don't know why Windows 7 broke the selective antialiasing function of Firefox and Chrome which still works perfectly in XP, but this workaround makes things way better.