Menu
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.
339
When choosing web fonts, you often have to weigh several considerations together. While the length of your text helps determine which font you select, the size at which you're setting type is another important factor. At relatively small sizes, up to 16pt, try sans serif options like Roboto, Montserrat and Raleway.
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.
162
Use the right typeface for your site. It's not as simple as saying "this is the best font for websites". Here are two quotes (read principles) from Robert Bringhurst's "The Elements of Typographic Style":
On another note, unless a serif face really suits the website, sans-serif faces are more appropriate for digital media.
With regards to your second point, Phil Oye has recently released FontUnstack, a jQuery plugin which will tell you what font is being used for a given element. The element will be given a class (i.e. "set_in_gill_sans") through which you can apply specific styles for different typefaces.
Also, check out the font matrix (1.5 years old) and these well thought-out font-stacks.
31
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
