Aliased: How fonts look on my computer when rendered through a browser.

I ended up getting into an interesting discussion with a couple of folks at last week’s Portland Wordpress User Group. The conversation started with me thanking Devin Price for re-tweeting the link to my Custom Header Interface Screencast. Shortly after that, our table talked a bit about how it works and I was explaining how it creates .png images for the blog name and tag-line of the site, when I was asked something like “Why don’t you let the browser render the text”. I tried to explain that browsers will show aliased text instead of the smooth, anti-aliased text which looks much nicer and is easier to read.

Shockingly, I was meet with questioning eyes… So a few websites were loaded up – on two separate operating systems + multiple browsers and to my surprise, all browser-rendered text was anti-aliased…

The conversation ended with me saying something like, I’ll have to show you a screenshot sometime. Here is that screenshot, taken from this very post:

A Screenshot of this post taken from Firefox 3.5.3 running on Windows XP

Please compare the screenshot’s title with the actual, browser-rendered title at the top of the page. Notice how in the screenshot, all text is aliased. Your browser may or may not be anti-aliasing the text.

So this leaves me a bit confused. What controls this? Why do I see aliased text while others see anti-aliased?

Is it my machine…

The operating system…

The Browser…

If you have any input, please post below.