css - All about choosing the right font for a website

Question

I actually have right now two questions:

1) What font faces are preferred for a website? Right now I really like 'Segoe UI', but it's only available on newest Windows systems like Vista and 2008 Server. So I have defined a sequence:

font-family: 'Segoe UI', Tahoma, Arial, Helvetica, Sans-Serif;

I do not really like the look of all of them except for 'Segoe UI'. Any suggestions on what nice font could be used in addition to that? I also tried 'Trebuchet MS', it looks great on documents, but not really on a page.

2) Any way to specify with CSS different font sizes for each particular font-familiy? Like 'Segoe UI - 9px', Tahoma - 8px etc. This is probably not possible, but maybe there are some tricks?

I also know I will get lots of comments now to use relative font sizes, but I don't want that. I have some graphics in my design which are not stretchable. If the user or browser default lead to the font rendered with a varying size the design will quite soon fall apart. I prefer having design with font size limitations to not having design at all.

Answer 1

1) What font faces are preferred for a website?

See this page concerning safe web fonts.

2) Any way to specify different font sizes for each particular font-family through CSS?

Nope.

Soon, @font-face will be supported by all major browsers, and you'll be able to use any font you want on your website.

Until then, have a look at Cufón or sIFR.