Question

We haven’t found anything anywhere so far about that very strange effect.

For some time (don’t know since when exactly), the capital S letter renders in Windows browsers like it’s been moved by one or two pixels to the right. This happens on many browsers, not just on my system, so our customer wants it repaired. It’s not a question about local Windows configuration but about browser rendering.

It can be seen here: http://www.holcimfoundation.org/T154/holcim_awards.htm

Here are some facts:

• On Mac, Linux, Android and Windows with ClearType switched off the effect doesn’t occur
• If zoomed in (CTRL+ on Firefox), the effect gets smaller and then disappears
• It doesn’t happen on every website, just a few – I believe I’ve seen this elsewhere too (but didn’t keep the URLs)

We believe that this is a bug in the Windows font rendering engine. Does anyone have any idea why this happens? Or what kind of workaround we could use?

Answer 1

On Mac, Linux, Android and Windows with ClearType switched off the effect doesn’t

I’m not much of a ClearType wizard on Mac, Linux or Android but in Windows you can tune it.

If zoomed in (CTRL+ on Firefox), the effect gets smaller and then disappears

To me this indicates that the text path is being rendered correctly but at 100% with so few pixels to work with the “mapping” is wrong. Do you have a problem with this at 72pt?

We believe that this is a bug in the Windows font rendering engine

Do you have a reference rendering to compare this bug to? For all intents are purposes it could be by design, or your ClearType could be misconfigured.

EDIT:

I looked at this using the “Inspect Element” feature of Chrome. It seems you are trying to do too much with only 10 pixels of character real estate.

Observe the style and the rendering before:

Now take bold off:

Looks like it’s not a bug, ClearType is doing the best it can with only 10 pixels.