Tired of Arial and Verdana? Add some sizzle to your Web pages with a new open source project that can render any font in a page. (Flash not required.)
If you’re single, male, and work with computers, I know a gal you have to meet. She’s worldly, well-educated, talented, and ambitious. Her looks? Wellâ€¦ let’s just say she has a great personality.
Who’s the gal?
Fellas, meet HTML.
While HTML has many virtues, what it produces isn’t very attractive. Text flow is restricted to a sole rectangle; bounding boxes are rectilinear; and text effects are practically non-existent. Worseâ€”at least given the current state of Web browsers and associated standardsâ€”the entirety of human emotion, intellect, and creativity must be rendered in ten (or less) vanilla fonts (Arial, Courier New, Georgia, Lucida Console, Symbol, Tahoma, Times New Roman, Trebuchet, Verdana, and Zapf Dingbats). Ugh.
Somewhere, Giambatista Bodoni is spinning is his grave.
And, alas, due to technical and legal complications, the Web is likely to remain a typographically monotonous place for the foreseeable future. It’s a catch-22. While CSS2 supports Web fonts, the feature remains largely untested because foundries, designers, developers, and operators have yet to find an equitable licensing scheme for typefaces. (Like other creative works, a typeface is protected by copyright. To use a typeface within a page, a site must have the right to publish it, making it available to all consumers.) Meanwhile, there’s little incentive to break the legal stalemate because applicable standards aren’t widely implemented, even years after ratification.
Moreover, and as type designer David Berlow mentions in his recent interview with A List Apart, existing standards are unimaginative, akin to “â€¦ a fourth-grader’s crayoning abilities: no shadows, in-lines, outlines, fill variety, twisting, perspective, set on a bouncing line, or opaque over another object, much less [motion.]â€
Certainly, the dilemma is frustrating and explains why many turn to bitmaps and Flash to create compelling, exclusive, and signature site content.
While workable, both bitmaps and Flash are hardly ideal. The bitmap solution requires a unique asset for each heading, an unmanageable liability for a site with a great deal of dynamic or multilingual content. sIFR requires Flash, which is acceptable; however, sIFR is difficult to deploy and the results are less than spectacular.
Cue Up Cufón
So, what’s a designer and developer to do? Resort to chisel and stone? Lead type? PDF?
Sure, but before you break out your marble slab, Gutenberg press, or copy of Adobe Acrobat, try Cufón.
Here’s how it works.
- Assuming you have purchased the rights to embed a specific font in a Web page, you convert the font to JSON data via the Cufón Generator.
You can use the Generator online or download the source code from GitHub and host the application yourself. The Generator can convert any TrueType (TTF), OpenType (OTF), Printer Font Binary (PFB) and PostScript font (additional formats may be supported in the future).
For example, if your font was named Rock Star, you would include two lines in the