- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Wed, 5 Aug 2009 11:32:45 -0500
- To: Sylvain Galineau <sylvaing@microsoft.com>
- Cc: Jonathan Kew <jonathan@jfkew.plus.com>, John Daggett <jdaggett@mozilla.com>, www-font <www-font@w3.org>
On Wed, Aug 5, 2009 at 11:10 AM, Sylvain Galineau<sylvaing@microsoft.com> wrote: >>I'm not convinced that the issue of backward compatibility with the >>legacy IE installed base is as valuable or crucial as some seem to >>think. For one thing, there are the rumored "quirks" in existing IE >>@font-face support, which may require custom CSS support anyway, in >>which case authors might as well be serving a separate format as well >>(i.e., EOT for legacy IE, new web fonts for others). At least in the >>case of IE6, which is said to be widely deployed among the slow-to- >>upgrade user base, the limitation of one font per family name is >>pretty damning. > > First, I'd like to see web authors agree with that sentiment. I can oblige: it's not that big of a deal. I haven't done testing myself, and I can't find good information about the limitations online, but from what I recall that has been mentioned here on the list, IE6 (and possibly 7 and 8) have a slightly broken @font-face implementation, in that it ignores the descriptors (font-weight, font-style, etc.) used to layer multiple font files into a single CSS font. I'm not sure if "ignores" in this context means that it ignores the descriptors or the entire block. Either way I can work around this (I think just putting the plain face last will work with either). Now I have basically two approaches I can take: screw IE or hack IE. Screw IE ======== In this approach, I just ignore IE's lack of support. I might make small concessions to it in my plain CSS (like ordering my @font-face rules properly), but that's it. This means that I don't get to compose multiple font files into a single font. Instead, IE is forced to synthesize the bold, italic, small-caps, and combinations thereof. I don't think any of the other descriptors get synthesized, but I could be wrong - in any case, they're relatively rare. The synthesized versions are usually good enough - they convey the feel that I want, even if it's not quite faithful to the creator's vision. Overall result: I expend no additional effort, and get something that's good enough for 90% of the cases. Hack IE ======= In this approach, I employ hacks to get IE as close to the conforming browsers as possible. This is relatively easy. I can't layer multiple files into a single font, but I can still link multiple files as *different* fonts. I do this by adding additional @font-face rules in a conditional comment, then manually target elements that should be bold/italic/etc and change their font-family to use one of the new fonts. Overall result: More typing, and a bit cumbersome, but I end up with a display identical to the conformant browsers. As far as I can tell, these approaches will work just fine when I start deploying @font-face in my designs, and they're not bad relative to other hacks I've had to employ. The "screw IE" approach is surprisingly usable, and I've had worse "Hack IE" approaches for other problems. ~TJ
Received on Wednesday, 5 August 2009 16:40:37 UTC