Click to See Complete Forum and Search --> : Backup Font?
Leonsbuddydave
05-14-2008, 04:50 PM
Hi, I have a certain font that fits my site very well, but it isn't a default font with either Windows or Mac. To back that up, I have a second font that doesn't fit as well as the first one, but that is a default font. I was wondering if there is any way I could use CSS to use that second one only if the first one isn't found, then have the first font available for download. I may end up having to use a different language, but I figured I might as well ask here first.
Errant
05-14-2008, 11:01 PM
The css font-family attribute is what you need to use. It's a prioritized list of font family names:
body { font-family:Arial, Helvetica, sans-serif; }
If the browser doesn't recognise the first font in the list it will move to the second and so on and so fourth.
If you're going to be fiddling with custom fonts for display on a website I'd make sure you do your research. There are a number of fonts commonly found with most browsers but unless you stick to the default fonts you aren't guaranteed uniform display for all of your users.
Choosing a particularly rare font is also not the best idea as the likelihood of people visiting your site and downloading and installing a font just so they can view it how you like is pretty much non-existent.
WebJoel
05-15-2008, 06:28 PM
Whatever your primary first-choise font is, there is probably a similar-looking second-choice that could be used:
in the case of "arial", "helvetica" is a similar-looking second choice.
in the case of "times", "times new roman" is a similar-looking second choice.
in the case of "verdana", "georgia" is a similar-looking second choice.
and always use a absolute-last-choice generic font, like "serif".
So a well attributed font-family list would maybe look like:
font-family {arial, helvetica, times, 'times new roman', verdana, georgia, serif}
and right there, you've pretty much nailed at least something common to every browser.
and then again, there is always (gulp!), WEFT... (Google "WEFT")...
ray326
05-15-2008, 10:19 PM
font-family {arial, helvetica, times, 'times new roman', verdana, georgia, serif}
and right there, you've pretty much nailed at least something common to every browser.Except of course the fact you're mixing serif and sans-serif fonts in kind of a helter-skelter way.
Leonsbuddydave
05-21-2008, 03:47 PM
Oops, I'd almost forgotten about this topic. And thanks for the help, I didn't know that's how the font-family property worked. I have found a similar font that is a default with all browsers, so I'll be using that one. Thanks again!
WebJoel
05-21-2008, 05:53 PM
Except of course the fact you're mixing serif and sans-serif fonts in kind of a helter-skelter way. True. My 'generic last-ditch' should probably have been sans-serif, which is easier to read on a monitor/screen than serif. I'm almost always getting that unweildily. :o
-How would you structure a good first-to-last font heirarchy? :)
The likelyhood that anyone would get that far into my fonts choices would probably also mean that they are missing other presentation as well but at least they would be served my textual content and not some wing-dings interpretation of a font not native to the user's local pc. :eek:
WebJoel
05-21-2008, 05:56 PM
My code never has bugs. It just develops random features. -Nice quote, btw.
I was thinking mine might be:
I never make mistakes! I thought I did once, -but I was wrong! :D
ray326
05-21-2008, 07:45 PM
-How would you structure a good first-to-last font heirarchy? At the very least they'd all either have serifs or not.