Fonts for the web

How do you choose fonts for you website? How can ensure consistent experience across browsers and OS? Which fonts are safe?

Unit Verse offers an answer to our every day questions on fonts:

http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/

They list the most widely used fonts for the web and how to apply them in CSS.

There is a lot more that you can do for you fonts. Make sure to style your “&” (http://simplebits.com/notebook/2008/08/14/ampersands-2/) and embed fonts for extra wow effect (http://www.fontsquirrel.com/).

It’s best to not use “pixel” as the font-size unit. Use “em” instead, as it allow for better font scaling scaling. First, set default font size to 62.5%, which is equal to 10px on most browsers:

body { font-size: 62.5%; }

Then, you can use 1em to mean 10px, 1.2em – 12px, etc. This should translate well to small devices and to devices with large DPI value. Fonts will be readable there too!

If you don’t care about precise font-size, just use xx-small, x-small, small, medium, large, x-large, and xx-large.