Grow your CSS skills. Land your dream job.

Will Font Embedding Ever Become A Reality?

Published by Chris Coyier

I have to admit I don't have my head fully wrapped around this whole font-embedding controversy. At it's root, it comes from us web designers being frustrated by the lack of options font options for our web pages. We want more, the "core 10" are just too limiting. Ideally, we'd like to use any font we want without resorting to alternative methods like sIFR, FLIR, or simply just using images.

This where the @font-face CSS attribute comes into play. It's actually a CSS2 recommendation, but no two browser supported it in the same way making it kind of useless. (It's gone in 2.1) Here is the theory:

@font-face {
  font-family: "SuperSweetFont";
  src: url(http://www.yourdomain.com/fonts/sweet/supersweetfont.ttf) format("truetype");
}
h1 { font-family: "SuperSweetFont", sans-serif }

I believe this is where the controversy starts. In order for this to work, that font file needs to be hosted in a publically-accessible directory. This means that fonts will be just as easy to "steal" as a CSS file or an image is. Just figure out the path, pop it in a web browser and save it. We've gotten used to this when it comes to the code we write and the images we create. Entire web pages can be saved directory off the web with almost no effort whatsoever. But when it comes to fonts, it gets a little trickier. Font foundries charge big money for their fonts, and they don't want them to be so easy to steal.

Major type foundry Hoefler & Frere-Jones straight up forbids it in their EULA:

The emerging @font-face tag within Cascading Style Sheets (CSS) will hopefully lead to a secure technology that allows fonts to be used in web pages. But at this time, no such security measures exist, so the use of this tag with our fonts constitutes the illegal distribution of the font software. This type of use is therefore specifically prohibited under our End-User License Agreement.

The controversy heightens even more when ways to protect these font files are discussed. It makes sense on some levels to use some form of DRM (Digital Rights Management) to protected them. Of couse, that acronym makes the hairs on a lot of folks neck stand up. Microsoft was on-board with a company named Ascender Corporation who can supposedly provide font-licensing servers that would work on the external internet. I can't tell you much more, as I don't know much more, but I've read some positive things that this kind of technology, while technically DRM, could really be a good solution.

More controversy yet comes from some designers calling for the big dogs to just release a number of high quality fonts free for public use.

Please consider releasing eight to twelve core fonts into the public domain. The amount of revenue lost from a small core set of fonts surely can’t have a significant impact on Adobe’s bottom line. And the gesture of releasing such a set into the public domain would have many positive ripple effects for years to come.

I’m sure many designers have a different list of what those eight might be. I know my list would include the likes of Adobe Caslon Pro, Adobe Jenson Pro, Franklin Gothic, Frutiger, Futura, Gill Sans, Helvetica Neue, Univers and your new namesake, Warnock Pro.

Personally I think begging for fonts isn't quite the long-term solution we need. Even if that dream were to come true, it would take quite a while for major operating system creators to start shipping them by default and there is certainly no guarantee of that. We could embed them in the short-term, but I'm not sure that's the idea here. Imagine how many duplicate cached copies of Futura you would accumulate in a day.

If the @font-face thing does solidify itself as the way we'll be handling embeddable fonts in the future, more problems await. Perhaps most significantly, IE will only be supporting this "EOT" format, while all the other browsers are using TrueType. Right there we are back to the "bad old days", having to (at best) have two different CSS statements to support different browsers. Not good. I am actually a little unclear here if this is still the current state of affairs, so please feel free to enlighten me.

So when we boil it all down, these are the hurdles as I see it:

  • If the spec for @font-face stays the way it is, it's still going to take time for enough browsers to support it that it will be worth using.
  • Most great fonts that you would actually want to use this way are illegal to embed under current EULAs. Most fonts that are legal to use suck.
  • There needs to be a push (featuring some kind of compelling reason) to get all browsers to support the same font format.
  • This may lead to a proliferation of poor taste in fonts the likes of which we've never seen. Of course we "can't blame the poor carpentry on the nails", but it's still worth thinking about.

Regarding the DRM, there has been some murmurs that there has to be a better way. I agree wholeheartedly. This comment from Jon Hicks on this article I think has the right idea:

To get around the piracy issue, I imagined a system similar to Google Maps. You get a unique key from a type foundry that only works on certain domains, and hides the actual location of the font file.

I think the foundry that gets on to this first will be a winner.

Seriously, there has to be some kind of licensing system that only will serve up a font file with the correct combination of base URL and key. I this would be a killer solution for serving up high quality font while staying legal. However, this solution doesn't prevent other illegal use, just enables good legal use.

So after all this, I'm still left a little confused. Will font embedding become a reality? In some ways it already is, and seeing limited browser support. In other ways, it's a long way off.

More information

Jon Tan calls for a grassroots organization to handle universal web type.

A List Apart: CSS @ Ten: The Next Big Thing

"Embedded" Web Fonts Return. Uh-oh.

Comments

  1. Permalink to comment#

    I’ve been praying for this for quite a while. Unfortunately, like everything else with CSS, it’s taken far too long.

  2. Anon
    Permalink to comment#

    I don’t see the problem here. It’s fairly easy to restrict hotlinking of images with a .htaccess file, could it possibly be any harder with fonts?

  3. Permalink to comment#

    Maybe they should develop a new font format specifically for web use, meaning it can only be used on the web and can only be read by web browsers. It would be a big job but its the best logical way of preventing font thieving and allow web designers to use great typography, visible to search engines on the web. The only problem is that people could possibly thieve it and use it on their own site. Its a nice idea but the chances of it working with pay fonts are 1 in 1,000,000. I think this method would be great for free font though.

  4. The controversy makes my head hurt too. As you stated, most GOOD fonts specifically say you cannot embed them in the license, I don’t see that changing. I guess the situation will be how many people will fight against that and use it anyway, and how ardent foundries want to be about cracking down on piracy. They are already generally pretty hardcore anyway, but a @font-face embed does make their job 1000x more difficult.

    While I respect foundries and the work they do to provide typefaces (I am a total font junkie, like I have a huge collection — legal, Adobe offers a killer deal on Font Folio to students that I got via my University and I’ve purchased other big foundry packs too), I hope they realize that DRM just won’t work. Even the best technical DRM scheme will be broken and its mere existence will piss off paying customers.

    And historically, proprietary formats DON’T work. Let us not forget that TrueType (and subsequently, OTF) was only created because Adobe guarded the technology behind PostScript Type1 (they only released it after Apple and Microsoft announced TrueType) and charged insane amounts of money for the its use. I can’t even remember the last time I ran across a PostScript Type 1 font anywhere that was not ancient as all get-out. Plus, didn’t we just have a long protracted debate about what open font format to use? OpenType won.

    But I digress. Frankly, at this point we should just have some font thieves whip up some lookalikes that CAN be used on the web. Hey, if Bitstream and Monotype can do it and then charge money for the rip-offs, surely some aspiring font artist can (anonymously if they want) contribute some glyphs to the community.

  5. Permalink to comment#

    We don’t seem to be getting any closer to being able to use a wider range of fonts on the internet -sIFR and FLIR are both far from ideal and both have their limitations. Amazing that this has been pretty much ignored for such a lengthy period of time.

  6. Gustavo
    Permalink to comment#

    If musicians, writers, filmmakers, photographers should be victims of “free of charge content” web philosophy, why not font foundries?
    It’s a new era. A shitty era, but it’s no possible to avoid it.

  7. Daniel K.
    Permalink to comment#

    This is the third time I’m starting this. I would love to see browsers, and even coders starting to use @font-face, it goes off into that gray area of copyright. Several free fonts have stated that you can not distribute fonts yourself, others don’t care as long as you credit them. I’ve seen one author do a safari test site that uses a pay font from Blambot.com. While it’s wonderful that he showed us how safari handles the @font-face issue, I wish he could have chosen another free font.

    Ok, enough I’m going to start rambling here in a minute if I haven’t already.

  8. Permalink to comment#

    I’m not sure if I really understand the issue here. There are a number of public domain fonts and in most cases, they are rather simple but time consuming to create. Instead of relying on commercially available fonts, I can see a movement of people creating fonts for public use if this was to become a standard. And there are a lot of talented font designers out there to be able to create a large enough base of fonts that are unique and engaging that it may not be necessary to use commercial ones. I’d say the fight should be to settle on the standard and figure out the logistics of where those fonts will come from later — that seems to be more of the challenge.

  9. Aaron B
    Permalink to comment#

    Just thinking (typing?) out loud here. What if fonts were tied to the browsers? For instance, when you buy the Creative Suite, you end up getting fonts bundled with it. Couldn’t the browsers have fonts as part of their packages? They would have to be public release fonts of course, and I don’t know who would decide on what fonts to add or how many, but could be a way for at least some more typefaces without trying to have all OSes adopt something when browsers adopt things a little faster. But then look where we are with standards, so maybe not a great idea.:(

    A much better idea is to somehow figure out how to use fonts you own and have them viewable but not downloadable. Who knows if that will ever happen.

  10. Permalink to comment#

    There are numerous sites available providing Free Fonts
    then why need to waste time for creating one. Don’t sure but embedding the font through css may affect the rendering speed of a web page so are used rarely.

  11. Permalink to comment#

    Well, actually, if you are willing to use fonts that are made as free fonts and enabled to be used with @font-face you can do a lot for browers like Safari, Firefox 3 and Opera. If IE does not support it, i don’t care.
    Here is a live example: worddesign. I use this font: Fertigo. It can be used freely, also with @font-face. One might ague that this is a bad example for reading text, but since i intend the page to be experimental (in fonts and content) I like it.
    IE users get what they deserve, so if you want to use fonts there, its possible.
    I hope for a better future of cause, but for now, i am cool!! ^-^

  12. We’ll see in the future how it goes. But I hope to see font embedding soon ;)

  13. Permalink to comment#

    Commercial fonts, feh!

    The number of free fonts is growing and many are more innovative and just as nice as the commercial ones. I see no point in paying $200+ for a font face when I can just as easily get a free one.

    And if IE does not support @font, so be it. I could care less. As long as the site is usable in IE, then it does not matter. Just another functionality that IE users lose.

Leave a Comment

Current day month ye@r *

*May or may not contain any actual "CSS" or "Tricks".