It'll Never Fly

Clever… not good, but clever.

At work last week, it became necessary to develop our own custom message boxes. I wanted the message box to auto-size to its content: an optional image on the left, any number of custom labeled buttons along the bottom, and a label that auto-sizes itself vertically. The message box sizing to fit its content, and the first two criteria were fairly straightforward. The only real challenge was creating a label control that will auto-size itself vertically. It turns out it's actually quite easy, once you realize you have to manually take control of its drawing routine. Looking at examples from the web, it was a simple matter of setting up a region that defines the label's maximum dimensions and then making use of the Graphics.MeasureString and Graphics.DrawString routines in .NET.

But I noticed something amiss between our message boxes and the built-in message boxes. Even with the same font at the same size, our message boxes looked like crap. The text looked like it had been run through some fun house mirror filter. Without getting too technical, it's apparently a difference between Windows' different graphics interfaces, GDI and GDI+, and resolution-independence. This was something Microsoft noticed with .NET 2.0 and thus came out with a TextRenderer object with methods MeasureText and DrawText which accomplish roughly the same effect.

All this examination of fonts lead me to start looking at ClearType, Microsoft's name for sub-pixel rendering technology that attempts to make text more legible at small sizes on a discreet display medium like the computer monitor. It's not a new idea, but it's only become become prevalent in recent history because of the advent of LCD monitors. Any major desktop operating system will have some form of it built-in or at the very least have the ability to turn it on. Having said that though, there's no one right way to accomplish it, because different people perceive things differently. It's actually quite a polarizing topic. There are several different ways to do it, but basically they fall into one of two camps, and it's all about the pixel grid.

Microsoft's theory is essentially a kind of "snap to grid" approach; adjust the font so that it mainly fits along discreet points of the pixel grid. The idea being that this increases the "crispness" of the text, thus making it more legible. In theory, this is good, but in practice there's really one big caveat: unless a font is designed with this in mind, you can end up with some quite jarring results (the fun house mirror effect I alluded to earlier). This is now why you see a whole new rash of fonts coming out of Microsoft, especially designed for ClearType, and quietly replacing their old tried and true fonts with every new Office or Windows product. They themselves know how poorly fonts look with ClearType turned on if they weren't designed for it (and vice versa, I should point out).

Apple's approach is more benign. Rather than cram the font into a box, they elect to display it as best they can keeping the font in tact, potentially at the cost of crispness of display. The net effect is fonts rendered in OS X tend to look "smoother" and more appealing to the eye, but also "blurry" to some people. The upside is you don't need fonts designed especially to work with OS X's rendering technology. It "just works".

So it all boils down to personal preference. Frankly, I find fonts rendered with ClearType to look broken, faint, and/or fuzzy (with multihued outlines) and really distracting as I read (though it's better than turning it off completely). I don't find fonts rendered in OS X to be blurry at all. They look more natural and "intact" to me. Now perhaps it's my monitor at home, which is the new 27" iMac, because when I tried XP with ClearType through VirtualBox it looked way better than it did at work with the same settings (though I could still detect the fuzziness I see, but not as bad). This is even after using the ClearType Tuner, which helped greatly, but I was still never able to find the perfect setting. Though, if you’re going to stick with ClearType on XP, I highly recommend it .

Regardless, I'm stuck using XP at work with aliased fonts, or broken/multi-hued fonts in ClearType. This became even more noticeable when I installed Safari 4 and turned on its built-in "Medium" font-smoothing. It really made me want to find a way to turn that on system-wide. Luckily, some Japanese programmers also came to the conclusion that ClearType sucks for displaying their ligatures and decide to do something about it. GDI++ is a tool that uses the FreeType open source font engine for rendering fonts in Windows, and you can customize it (albeit in a very non-user-friendly way) to your own preference.

Now I'd only advocate using GDI++ if you're like me, and stuck in an XP world. If you're on Vista or Windows 7, their latest advances in DirectWrite and Direct2D appear to me to be a vast improvement over anything you can accomplish in XP, either built-in or through a third-party (mind you, I'm basing that strictly on screenshots I've seen, having never used Vista nor Windows 7). Unfortunately, Microsoft has decided no to support XP at this time with either of those technologies. But if you're up for a little tinkering, GDI++ is the way to go. I'll attach my settings, which attempt to mimc my Mac, once I get back in to work.