SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Addict svcghost's Avatar
    Join Date
    Oct 2010
    Posts
    288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Font Thinning on Windows?

    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.

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    23,592
    Mentioned
    411 Post(s)
    Tagged
    6 Thread(s)
    Unfortunately, Windows is just plain ugly. But Windows users are used to that.

  3. #3
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,729
    Mentioned
    31 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    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

  4. #4
    SitePoint Addict svcghost's Avatar
    Join Date
    Oct 2010
    Posts
    288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,787
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    You can turn on Cleartype for (supposedly) better rendering of fonts in IE.

  6. #6
    SitePoint Zealot PatrickSamphire's Avatar
    Join Date
    Jul 2006
    Location
    UK
    Posts
    113
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

  7. #7
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    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.

  8. #8
    SitePoint Member
    Join Date
    May 2011
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •