Testing IE9 font rendering with side by side screenshots

OK. I just did some side by side testing of IE9 with and without compatibility view on to compare the font AA and kerning.

1 - I like the new kerning allot. Compatibility View looks clumsy to me now but I discovered that white text on a dark background actually looks bad in both IE9 AND IE8 mode ON MY IPS panel. On my cheap Acer TN LCD it looks fine no matter what mode I'm running in.
Here's an example of white text with a black background that looks awful on my Dell 2209WA IPS panel but fine on my 19" Acer.

IE9 on the left and IE8 mode on the right
http://www.box.net/shared/hgtf31cs5n

2 - I like the look of plain old black text on a white background with the new system because of the better kerning but when you start adding grey in either the background or the text it all falls apart and looks quite blurry on ANY type of LCD and clarity is more important to me than kerning. This is very noticeable on Facebook which uses tiny grey text

IE9 on the left and IE8 mode on the right
Look at the text on the right of the webpage on these screenshots of Long Zheng's site which is grey or on a grey background
http://www.box.net/shared/06sss2rp4o
Total blur on the right (everything under LATEST TWEETS)  but the main body is acceptable but still not as crisp as the old way of course.

3 - Another thing...
Why is the font so different where it says "this is NOT the Microsoft logo"? That's very strange to me that it could change that much. It doesn't even look like the same font.

4 - Do any of you have IPS panels that you can do these test on and compare them to a regular cheap TN panel?

8 minutes ago, dentaku wrote

OK. I just did some side by side testing of IE9 with and without compatibility view on to compare the font AA and kerning.

1 - I like the new kerning allot. Compatibility View looks clumsy to me now but I discovered that white text on a dark background actually looks bad in both IE9 AND IE8 mode ON MY IPS panel. On my cheap Acer TN LCD it looks fine no matter what mode I'm running in.
Here's an example of white text with a black background that looks awful on my Dell 2209WA IPS panel but fine on my 19" Acer.

IE9 on the left and IE8 mode on the right
http://www.box.net/shared/hgtf31cs5n

IE8 mode's text has green fringes on my IPS displays. I'm going to put this down to suboptical ClearType configuration. I'm guessing your TN and IPS displays have different subpixel properties (even if they both share the same pattern). I'm afraid you'll have to ensure all of your monitors are the same panel and re-run ClearType Configuration 

Do any of you have IPS panels that you can do these test on and compare them to a regular cheap TN panel?

Any comparisons we would make wouldn't help, each panel has its own optimal sub-pixel rendering settings. What looks great on one IPS display might look awful on another IPS display.

@W3bbo:Yup, it's green in IE8 mode on my IPS panel too.

I've used the Cleartype Tuner to adjust just my IPS panel (I don't really care about monitor #2) and it only shows you black text on a white background so I'm assuming if I could make white text on black look good it would then mess up black text on a white.

lol @ the Microsoft logo post, what a ridiculous thing to get upset about.

6 minutes ago, contextfree` wrote

lol @ the Microsoft logo post, what a ridiculous thing to get upset about.

Bloggers need to manufacture controversy if it's a slow-news day.

Long Zheng is not just a blogger, he's into marketing and product design so it annoys him more than some people 

1 hour ago, contextfree` wrote

lol @ the Microsoft logo post, what a ridiculous thing to get upset about.

@dentaku:Yeah, that post was something that he'd normally post about anyway.

Looks the same for me, but, I am using regular LCD.

@dentaku:

1) There's something wrong with the IE9's IE8 mode as seen here. I have IE8 here on computer with no IE9 ever installed, and everything looks fine on that page. On a CRT. If the IE8 mode was working as some claimed ("fixes the font issue") then it would look identical to what I get here unless you have adjusted ClearType. However in this case, even if you did not adjust ClearType, there is something broken about the IE8 mode: The letters in the text are widely spaced apart in your IE8 compat mode screenshot (aka kerning I believe). Either it should look like real IE8 or it's not really compatible mode but some kind of "frankenstein mode" since kerning wise it appears to be worse than the IE9 mode and worse than real IE8.

2) On this page the IE8 mode looks 1:1 to real IE8, and is fine from my perspective. This is what commenters already noted in IE blog, that the compatibility view matches real IE8 on some but not all pages.

So as far as I'm concerned, IE9 is step back to "vista age". If its IE8 compatibility mode worked 100% reliably text rendering wise performing like actual IE8 I might try it out on more permanent basis but I'm not upgrading to "IE-Vista" where things work half-arsedly, like Vista's explorer still does to this date. Good thing I can have IE9 Preview 8 around until they either fix it or there's a side by side install.

3 hours ago, androidi wrote

@dentaku:

1) There's something wrong with the IE9's IE8 mode as seen here. I have IE8 here on computer with no IE9 ever installed, and everything looks fine on that page. On a CRT. If the IE8 mode was working as some claimed ("fixes the font issue") then it would look identical to what I get here unless you have adjusted ClearType.

Well no, because IE8's font rendering is even more dependent upon screen resolutions than IE9, which is a result of not using sub-pixel positioning.

@AndyC: Interesting theory but not true atleast on my computer with real IE8. (I'm certain with IE9's buggy compat-mode anything can and will happen, as proven by many comments on IE blog - so any comparisons should be performed against IE8 on a computer with IE9 never installed - since also comments were made that uninstalling IE9 doesn't necessarily change everything back as it was - however if someone can bother they can refute this with system registry and file comparison before install of IE9 onto clean system and after uninstall to see if anything was left behind from IE9)

To test this I took screenshots at 3 different resolutions and they all rendered the text identically in IE8, so comparison of IE9 to screenshots from IE8 is valid regardless of resolution. Whether comparison of IE9 screenshots is as valid when IE9 is in IE8 mode, uncertain. However in the OP's example shots the IE9 image was 1:1 to my IE9 Preview 8. (ie8-mode was not)

The only conclusion here is that a release date was set for IE9 and when that date came, there were major issues unresolved (atleast with the compatibility view, assuming it was specd to render text like real IE8) and now we have "IE Vista".

8 hours ago, androidi wrote

@AndyC:

To test this I took screenshots at 3 different resolutions and they all rendered the text identically in IE8, so comparison of IE9 to screenshots from IE8 is valid regardless of resolution

Change the DPI and it becomes very apparent very quickly how text layout changes drastically depending upon screen resolution when using the old-style forced to pixel positioning. Even zooming on IE8 tends to mess with layout.

Alright but lets not confuse / lets keep in mind that people who had Windows 7 clean install with IE8 rendering things perfectly on their system have IE9 rendering things fuzzily and no setting to force it to render like IE8 has surfaced yet. (Compatibility view does the trick for some sites but not all but really I want to use the IE9 document mode except have text render like best suits for my hardware/eyes - however I would be satisfied if the compat view rendered text like IE8 does on all sites without exception)