2

The problem

How it should look (Chrome 16 on a Mac).


(source: ddesign.si)


How it looks (Chrome 16 on Windows 7)

(source: ddesign.si)


How it looks with bigger font-size
(source: ddesign.si)

Description

I'm using Font Squirrel's generator for my css code.

font-family: 'Conv_Gotham-Light';
  src: url('fonts1/Gotham-Light.eot');
  src: local('☺'), 
       url('fonts1/Gotham-Light.woff') format('woff'),
       url('fonts1/Gotham-Light.ttf') format('truetype'),
       url('fonts1/Gotham-Light.svg') format('svg');

Tried solutions

I tried many solutions (replacing font order (svg on top), adding text shadow, adding -webkit-text-stroke, -webkit-font-smoothing, etc.), but none of them worked.

What files are requested?

It works correctly on IE 9 on Windows 7. I've searched through apache logs and found out that IE on Windows requests the .woff file, but Chrome 16 on Windows 7 requests .ttf file and after the "svg fix" requests .svg and .ttf.

What now?

So what is going on and how can I fix this?

Glorfindel
  • 21,988
  • 13
  • 81
  • 109
duality_
  • 17,738
  • 23
  • 77
  • 95

2 Answers2

2

The font is missing hinting. When fonts in Windows have chunks missing or added, you can usually blame the TTF hinting. Run the font through the Font Squirrel Generator and it should fix your problem.

Font Squirrel
  • 1,571
  • 11
  • 13
  • The font (Gotham) is aparently black-listed in the Font Squirrel Generator, so I don't know that I can fix this through the Generator, even though my client has the licence. Is this somehow possible anyway (or with another program)? – duality_ Feb 28 '12 at 08:59
  • 1
    H&FJ does not license their fonts for @font-face. You will have to find another font to use. Perhaps Proxima Nova would be a good alternative? http://www.fontspring.com/fonts/mark-simonson-studio/proxima-nova – Font Squirrel Feb 28 '12 at 14:14
2

It's because the font is missing hinting, as already noted. Mac OS always strips away the hinting data anyway, as its rasterizer "auto-hints" the font itself.

However, there is a great little software which uses the automatic hinting of FreeType and embeds the data into the file, i.e. it auto-hints the font for you.

See here: http://www.freetype.org/ttfautohint/

Ecir Hana
  • 10,864
  • 13
  • 67
  • 117
  • Although this is not perfect (the font still looks a little weird at certain bigger font sizes), it is very close. This worked! – duality_ Mar 01 '12 at 12:01