Font rendering issues!

Discussion in 'Web Design and Development' started by elephant, May 19, 2010.

  1. elephant macrumors newbie

    elephant

    Joined:
    Feb 5, 2009
    Location:
    London, UK
    #1
    I have a weird problem with getting Arial to render properly on some sites I've made, and I don't know if this is an OS X-related issue or not?

    I have a MacBook Pro 13" that I use as a laptop, and then a MacBook Pro 15" i7 that is hooked up to a 24" external display.

    On the 24", the sites look normal, meaning Arial in 'font-weight: normal' looks as it should. But on the 13", all fonts have a 'bold' applied to them.

    This doesn't happen everywhere though, Google renders in normal Arial without the 'bold' applied. So far I've only experienced it on my own sites, but I haven't done an extensive search.

    I'm guessing it has something to do with how OS X renders fonts when the resolutions get smaller (to increase readability), but how do Google and other sites bypass this behaviour?

    Comparison (24" first, then 13"):

    [​IMG]

    [​IMG]

    Anyone had this problem before? Tried googling the issue, but didn't really know what to look for.
     
  2. unid macrumors regular

    Joined:
    Feb 24, 2009
    Location:
    Traffic_island_bay
  3. elephant thread starter macrumors newbie

    elephant

    Joined:
    Feb 5, 2009
    Location:
    London, UK
    #3
    It shows up as Helvetica on my 24", but as Comic Sans on my 13". Reason is i uninstalled Comic Sans from the i7.

    Oh and also: when I unplug the i7 from the external monitor and use it a s a laptop, it displays fonts like the 13", with a bold applied to it.
     
  4. elephant thread starter macrumors newbie

    elephant

    Joined:
    Feb 5, 2009
    Location:
    London, UK
    #4
    After some more testing:

    So the problem here seems to be that OS X is trying to increase readability when things are displayed on a smaller resolution laptop screen, by adding bold on top of all text, even if the text is already bold.

    Some sites bypass it just fine though, like Google or MySpace.

    I tried reducing my external monitor to "laptop resolutions" (1280x800), but my external monitor still rendered the fonts correctly.

    Something happens when I unplug my external monitor, that makes both my MBP's add bold on top of text on certain websites.

    My head is spinning.
     

Share This Page