@font-face reliability
- Started
- Last post
- 19 Responses
- Continuity
Is it worth starting to use this? Or are the majority of people still using non-compliant browsers? I'm asking because I want to make tweaks to my own site that involve getting rid of Neue Helvetica and Georgia in the copy.
- ukit0
What would you replace them with just out of curiosity?
- Continuity0
Obviously fonts that are licensed to be embedded. I'm not happy with my choice of type in general, so I'm looking at a bunch of different options.
- ukit0
I haven't seen any sites that use it for body copy. Search and you'll find more exact info on compatibility issues but I think mainstream use is still a little ways off.
- 3030
Check new www.wrc.com for the @font-face implementation. They use custom font WRC for headings/headlines and for main navigation. Works really nice.
Also check the resources below:
http://bit.ly/cyhIW2http://www.fontshop.com/blog/new…
Font squirrel has nice @font-face generator:
http://www.fontsquirrel.com/font…
- raf0
Browser compatibility is not a problem, even IE 6 supports font embedding. System support is the issue: Windows sucks when it comes to display those fonts, in all browsers: no antialiasing is applied. Very few faces look acceptable in Windows, I've seen none that look as good as on the Mac. Perhaps bitmap fonts will look ok.
- See this is _probably_ the main reason I've been hesitant to try. :(Continuity
- lukus_W0
I think the major problem involves the font files. Different browsers require different formats, so you end up needing to include about three different formats. WOFF is probably going to become the standard though, and afaik all browsers are moving to support it.
- Continuity0
I think raf makes the best point; although the vast majority of people who've visited my site run on Mac OS, there are still some people among my target audience who run Windows. If the rendering isn't the same cross-platform, then in my mind there's no sense in doing it.
- ukit0
I don't think it should be a stumbling block in your design. You can easily use Cufon (JS based font replacement) as a stopgap measure, and it works great cross browser.
http://cufon.shoqolate.com/gener…
I wouldn't consider custom fonts for body copy - no one's really doing it right now, so it would give people kind of a weird impression for a regular, commercial type of site.
- Yeah, I've been thinking of toying with sIFR and CufonContinuity
- lukus_W0
this might help: http://www.emblematiq.com/blog/t…
- Continuity0
You know, in a way it comes back to Flash's value. It's not that I want to start another Flash flame thingy, but we have to admit that it gives us a lot more flexibility in terms of things like layout and type, over the current HTML/CSS/JS solutions.
- true, but webfonts are in their infancy ..it'll get betterlukus_W
- TheBlueOne0
I think the AOL corporate site makes great use of DIN rounded via @fontface for headings, etc.
- First time I have seen that AOL site, is it wrong to say it really nice design.pillhead
- 3030
In terms of font aliasing on Windows it should not be a problem on Vista/7. I haven't checked that on XP but that was that first the Windows with clear-type.
- raf0
OK, somebody please post Vista/Windows7 screenshots of
http://typekit.com/
http://corp.aol.com/products-ser…
http://webfonts.info/wiki/index.…...and someone else please tell me why oh-so-Typekit-supporting http://www.fontshop.com/ is still set in gifs
- 3030
Screenshots from Windows 7 and IE8
Surprisingly, IE8 in compatibility mode (as IE7) renders fonts much better than IE8 in standard mode.
- They still render pretty chunky compared to Mac OS, though.Continuity
- raf0
Thanks for that. I hoped this text would prove me wrong.
As for IE compatibility mode, I started to force it always. One clunky browser for testing less.
- Stugoo0
Besides the whole legal thing the only issue I really have with it is smoothing.
You use font replacement for nice smooth looking headers and fonts right? If the user has smooth fonts turned off then the render is going to be pixelated.
Otherwise the only browser in the pack that really doesn't support it is Firefox 2.0 and mobile devices.
and lets face it if your building for mobile then you don't really want to load in font replacement anyway.
- 3030
Stugoo, most users have no idea about the anti-aliasing and how switch it off.
For font embedding you can use html conditional comments and you can target specific browsers. Here is more:
http://www.impressivewebs.com/co…
- detritus0
Windows 7 & Firefox..
Aliased where they should be, antialiased everywhere else...
- i stand correctedStugoo
- Nice, detritus. It just goes to show how IE is bollocks (again). Think I'll stick to PNGs, Flash, sIFR or Cufon for the time being.Continuity
- 3030
In my next project I am going to use @font-face. I think this is a good time to push it. So far, I stick to the fonts that are available with @font-face kit at fontsquirrel.com.
I see more problems with the font license as not every font comes with web format.