Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 1 down vote favorite

The fonts that were allowed for use on the web are limited. But over the last few years, the fonts that could be safely used on a web page for styling elements have increased. In this day, which fonts can be used safely?

share|improve this question
This would probably be better asked on Graphic Design SE. – Andrew Leach Jul 15 '12 at 9:10
1  
This isn't really suitable for this site, answers would just consist of a whole list of examples with no correct answer. As per the FAQ "We prefer questions that elicit definitive answers or solutions rather than prolonged discussions. Remember, this a Q&A site, not a discussion board." If you can reword it so that it's a specific question then we can re-open this question for you. – JonW♦ Jul 15 '12 at 10:11
There's no longer such thing as "web safe" fonts. Though there are some fonts that Chrome on Windows doesn't render very well... – Ben Brocka♦ Jul 16 '12 at 1:36

closed as not constructive by JonW♦ Jul 15 '12 at 10:11

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or specific expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, see the FAQ for guidance.

1 Answer

up vote 5 down vote

With @font-face avaliable for you to embed fonts, the choices of avaliable fonts in ALL modern browsers are essentially unlimited.

Here's a list of browsers that support @font-face:

  • Google Chrome: version 4.249.4+
  • Mozilla Firefox: version: 3.5+
  • Apple Safari: version 3.1+
  • Opera: version 10.5+
  • Microsoft Internet Explorer: version 6+

I personally use Google Webfont for most of my new projects if I require a different font. The fonts are served over Google's CDN and contain the right headers and etags to prevent redownloads.

This is a good guide on how to make your own webfonts (from existing fonts).

As a backup, ensure that you have defined a font family incase the browser does not support @font-face:

font-family: 'PT Sans', sans-serif; //The default sans serif font will be used if PT Sans is not avaliable.
share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.