Is Garamond really a web safe font?

Question

Is Garamond really web safe? Should I go ahead and use it? I know its not there in XP(Georgia is the fallback), however, what about other operating systems? Is it present in ma

Answer 1

1) No, Garamond is not a web safe font.

2) Garamond is not recommended for usage on the web. See this article: Why you don't use Garamond on the Web

3) Recommendation: use Georgia for headings and Verdana for body text. They are both web safe and are tried and proven to work very well together.

If you want to stick with EB Garamond, Google Fonts recommends pairing it with Lobster.

Writing the code:

@import url('https://fonts.googleapis.com/css?family=Lobster|EB+Garamond');
h1, h2, h3, h4, h5, h6 {font-family: Lobster, cursive; }
p {font-family: 'EB Garamond', serif; }

Answer 2

I don't believe it is a safe font to use on all computers. You can use the font and use another as a backup by using font family. Such as this:

font-family:Garamond, Georgia, serif;

See here for more reading on web safe fonts -> http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html

Answer 3

No, Garamond is not “web safe” in the sense of being available on all computers. No font is. Garamond has been estimated, in CodeStyle.org surveys, to have about 85% coverage on Windows. It is probably quite rare on other systems.

Using Georgia as fallback for Garamond sounds odd, because they are very different fonts, as you can see by just looking at texts containing them (remember to include digits, they are very different).

Georgia is close to 99% on Windows and Mac but somewhere around 70% on Linux, so it would not be really browser-safe either. The main point however is that it is a font with special characteristics and generally not a good fallback font. Even the generic sans-serif font name is probably a better guess.

Answer 4

Other than a very short list, you should not rely on everyone having the various font families on their computers.

Instead, try out Google WebFonts. In fact, use the search box on the left to find their Garamond equivalent. Works in all browsers (including older IE!) and looks great everywhere.

EDIT

Regarding your additional question, yes, the browser will look for the fonts in the order that you specify them, so putting "Garamond" before "EB Garamond" will show Garamond if available in the user's computer.

Answer 5

For a font to look consistently good across platforms at small sizes it must be hinted well - otherwise it will only look good on those platforms which default to very soft, lightly hinted font smoothing for everything, like Mac - and it'll look terrible on Windows, which will apply strongest hinting and try to make them look really crisp, which really needs the hinting built into the font to be good to work well.

EB Garamond is a free reproduction of Garamond which has an impressive range of glyphs but pays virtually no attention to on-screen rendering - consequently its lack of decent hinting will ensure it looks terrible at small sizes on certain platforms, particularly Windows. While Vista/7/8 improves font rendering somewhat, it only does so in some applications - others, particularly Google Chrome, uses the old font rendering. Edit August 2015 - this is no longer true of Google Chrome.

There are other versions of Garamond out there, probably the best IMHO being Adobe Garamond. Being a commercial font you would need a special license to be allowed to embed it in a web page. Some font foundries sell these, some don't - you just need to read their license :) But if you get that, you may find that they are much better hinted. I can't guarantee it though (but some font stores will allow you to see a preview of a browser-rendered font in certain browsers).

But if you are limiting yourself to free fonts available from Google web fonts, I'd count EB Garamond out for body text, mainly just because of these issues.

Maybe specify "Adobe Garamond" as first, as a few people may have that, but then fall back to fonts like Constantia, then Georgia, then just "serif". Note that Garamond and Constantia have a light stroke and a small x-height so will look a lot more "feint" than something like Georgia.

Answer 6

What's your definition of web safe font?

If you consider a font being web safe when it is rendered on all the computers the same way, the answer is no - Garamond is not, and no other font is.

You can embed Garamond using various techniques (eg. javascript font API), but it will never be the same on all of the computers.

You can try to create a web safe font stack, considering font parameters, e.g. x-height. Something like this should work fine:

Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", Times, serif;

Anything you choose, remember that Garamond has very small x-height, so it is ok for print, but not very legible on screen. If you decide to use it, use bigger font-size.

Edit

Saying JavaScript API I mean importing fonts using APIs like Google Font API, TypeKit or other solutions that do not work when JS is off. Then you still need font stack, so importing won't help in this case.