CSS @font-face and IE 7 & 8 404 errors
|
08-13-2010, 05:40 PM
Post: #1
|
|||
|
|||
CSS @font-face and IE 7 & 8 404 errors
Whats the best way to handle embedded hosted fonts? IE requires an .eot font and doesn't know how to handle .woff and .otf so it eventually throws a 404 after the .eot loads.
You can see the issue in my test results: http://www.webpagetest.org/result/100813_2VR8/ Chrome, Firefox and Safari will load the .woff and skip over the .eot without making a request. I have been contemplating serving a specific ie style sheet with only the .eot fonts but I hate the idea of browser specific style sheets. I guess I shouldn't be complaining with first load times under 1 sec on WordPress but I am a performance junkie. |
|||
08-18-2010, 12:11 AM
Post: #2
|
|||
|
|||
RE: CSS @font-face and IE 7 & 8 404 errors
Chris,
you should use the Font Squirrel @font-face generator. It's awesome! These guys are on the ball, closely follow developments (e.g. IE9) and make sure their @font-face code works cross-browser. For several fonts, they have @font-face kits ready to go. Start here: http://www.fontsquirrel.com/fontface Download a kit for a font and open the demo HTML and CSS files to see the working syntax. Generator is here: http://www.fontsquirrel.com/fontface/generator |
|||
08-18-2010, 02:04 PM
(This post was last modified: 08-18-2010 02:34 PM by Chris_Olbekson.)
Post: #3
|
|||
|
|||
RE: CSS @font-face and IE 7 & 8 404 errors
I am currently using the fontsquirrel css (bulletproof) method. The problem is that IE makes unnecessary HTTP requests resulting in a 404 as it attempts to parse the rules for the “other browsers.
I went back to fontsquirrel and realized they are now recommending the mo better bulletproof method which uses a smiley face for the local declaration which causes IE to skip the extra http requests. Here is how the preferred method looks: Code: @font-face { |
|||
08-21-2010, 10:03 PM
Post: #4
|
|||
|
|||
RE: CSS @font-face and IE 7 & 8 404 errors
Yep, you gotta keep an eye on new developments & insight for @font-face.
Follow @paul_irish or @fontsquirrel on Twitter. |
|||
« Next Oldest | Next Newest »
|
User(s) browsing this thread: 1 Guest(s)