tags:

views:

315

answers:

7

Note: I've made a few edits here as I didn't get my question across very well the first time around.


Update: After doing some of my own research on this subject, I've come up with a perfect example of why I'm searching out the perfect list of font-family with fall-backs: http://www.brownbatterystudios.com/sixthings/2007/03/14/lucida-hybrid-the-grande-alternative/

body {
font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; 
}
strong, em, b, i {
font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
}

I'm suspecting that someone else has done a detailed list like this and rather than my doing it all again, I'd love to make use of someone elses hard work. If no one else has done this, then I'll go ahead and start my own?


I know how to search for web safe fonts, and how to include fall-backs for the different browser types to get close to my desired font and we've all done this many times before. However, I once saw an example of where someone had saved a list of all the fall-backs in a style sheet and all you needed to do was comment out the ones you weren't using.

The list appeared to contain most of the fonts that anyone would ever want to use, and rather than continuously scouring around the web every time to create my own list, I'm wondering if anyone else knows of this or any other list of fonts with fall-backs?

Example:

body {
font-family:Arial,Helvetica,"Bitstream Vera Sans",sans-serif;
/* 
font-family:"Trebuchet MS","Bitstream Vera Sans",Verdana,Arial,Helvetica,sans-serif;
font-family:Consolas,Monaco,Liberation Mono,Lucida Console;
...
*/
}

In my example above, you'll see font-family:Consolas,Monaco,Liberation Mono,Lucida Console; (snagged from SO's style sheet) and none of the resources listed so far would result in my building that fall-back family. Is Monaco similar to Consolas? Is this a good fall-back list for someone who primarily wants Consolas? If it is, then I want this added to my list of acceptable font-families...

Cheers,
Steve

+1  A: 

A good term to search for is web-safe fonts:

http://dustinbrewer.com/fonts-on-the-web-and-a-list-of-web-safe-fonts/

davebug
there're some wrong definitions there, like Andale Mono and Courier, but is a good source
Julio Greff
it's a good resource, but I've amended my question to state that I'm after the degrading more than the web-safe.
Steve Perks
+2  A: 

I use fonttester to test and try web safe fonts combinations

EDIT: in fonttester if you ask "Trebuchet" you'll get:

font-family: 'Trebuchet MS', Helvetica, sans-serif;
Luis Melgratti
Thanks Luis, I missed that. I'll have to build my own list, so not 100% the right answer :) but definitely the right track.
Steve Perks
+1  A: 

I've always used this one:

Default Mac and Windows XP fonts

Diodeus
+1  A: 

I use Common fonts to all versions of Windows & Mac equivalents (Browser safe fonts), which seems oddly similar to Diodeus's answer...

strager
A: 

TypeTester is a tool to compare font settings and breaks out fonts into Safe List, Win Default, Mac Default, and Vista fonts. You can also use it to test leading, alignment, word spacing, etc, set your base font size, and export the CSS.

Nathan Long
+3  A: 

I just bookmarked SitePoint's 8 Definitive Font Stacks today, and plan to incorporate these into future projects.

Carl Camera
+2  A: 

Here is another blog post on font stacks, it's a good one too.

dylanfm
Very well written. This is the kind of depth I was after. Thanks.
Steve Perks