views:

54

answers:

2

When I design in Photoshop, my fonts are thin and crisp, but when I declare fonts in CSS -- even when using font-weight: lighter -- the fonts always appear bolder.

Maybe this is just how the browser renders the font (In IE fonts stay thin), but I was wondering if there were any tricks or tips for achieving the same thin, crisp looks.

+1  A: 

This might be because your image in Photoshop is a higher resolution than what eventually gets used in IE.

Also, Photoshop is a graphics editing tool and the browser is more focused on speed.

Also, You can use cufon to use custom fonts on your website. In my opinion, the fonts used with cufon look better/crisper and you don't have to worry about the fonts being web safe.

Robert Greiner
A: 

You are right, it is a difference in rendering. How the text renders depends on your OS, your settings, and your browser (Safari, for example, renders bolder than IE). So there is no way to make this rendering match your photoshop comp.

A bit more info here:

Browser Choice vs Font Rendering | Phinney on Fonts

spiral