Hey guys,
My site looks great while browsing on my Mac. But when on a Windows machine, the fonts look thinner and ugly. Why is this? Can this be fixed using CSS / HTML? Thanks guys.
Unfortunately, Windows is just plain ugly. But Windows users are used to that.
LOL. I’m with Ralph.
But am I to understand you didnt use CSS to design the site in the first place? Hopefully you didn’t rely on the FONT tag. That would be the first thing to get rid of, not just because of the “thinning fonts” but because it’s just bad code.
The next thing to know is that fonts MUST be present in the local machine. so even if you had used a css as such: p { font: 14px “Thick mac”, Arial,Helvetica, san-serif; } when you viewed it on a machine that didnt have the “Thick mac” font installed it would display using the next available font in the list ( in my example, Arial) thus appearing like your fonts got thinner… you need to design around fonts that you are relatively certain would be present in both mac and PCs )
Other than that you can also add CSS3 @font rules, but then you need to host a copy of the font on your site and know that older browser would still see the tinner font as they may not support CSS3
No, I am certainly not using <font> tags. I am using CSS with a font that is web-safe (Arial). I guess there is nothing you can do then, because Windows just thins that font anyway. So annoying.
Basically, the older the version of Windows and the older the version of IE, the worse fonts will look. No matter what you do, older Windows/IE will always make you cry. 
It’s funny because I find OSX’s font rendering to be a blurry illegible mess, and would hold cleartype up against it for on-screen legibility any day.
But that all hinges on what you’re used to looking at more than anything else. Just be glad it’s not fre e typ e wi th it s re tar ded ker ni ng of tex t.
Both freetype and the apple renderer claim to be closer to print in appearance - I don’t find blurry and illegible where two instances of the same word don’t even render the same on screen to be consistent with print. YMMV.
It also may simply depend on what fonts you’re declaring… OSX and Windows typically have different base fonts, and if the font you are declaring doesn’t exist on the windows machine, you’re **** out of luck.
Expecting ANY form of consistent font appearance, even using webfonts, across platforms is unrealistic at the best of times, nonsensical at the worst.
It’s really a tired old argument that comes up time and time again. Basically Apple’s renderer is more concerned about preserving glyph shape than with legibility – Windows is more concerned about legibility by hammering lines into pixel boundaries, to hell with “glyph shape”. It’s hard to say who’s actually “right”, I just know I personally prefer Window’s improved legibility.
I’ve come across these great article about text legibility on uxbooth.
One of it is to using transparent text-shadow ( css3 ), not sure if ie support it, but i guess you could try using IE’s special css filter, check it here.
I haven’t tried those method, so i would love to see how’s your experiment going 