CODEWITHSUNDEEP
cssfonts
jchwebdev
jchwebdev

Reputation: 5460

Strategy For Font Family Availability

I'm looking for a strategy for dealing with font-family availability.

I have sites using OTFs EOTs but for one reason or another, the font won't load for various devices/platforms and the font falls back to the 2nd or 3rd choice. Unfortunately, the fallback rarely has the same line-height or margins. I've used jQuery to adjust the CSS accordingly, but that's a lot of effort for anything but a very small style sheet. I'm wondering if there isn't a better strategy.

Or... if there's a way to troubleshoot -why- a Google Font or EOT or OTF won't load and perhaps cut down on those cases?

I realise one can use Google fonts and so on, but those are IMHO... forgive me... mostly -dreadful- looking.

Upvotes: 0

Views: 123

Answers (1)

Conqueror
Conqueror

Reputation: 4433

Different browsers use different formats for fonts. For example, IE uses .eot files where as other browsers use .otf, .ttf, or even svg. Your best bet is to store multiple types of a font that would want to use and then declare them all in the @font-face block.

A good article about this can be found: http://www.paulirish.com/2009/bulletproof-font-face-implementation-syntax/

Upvotes: 3

Related Questions