Ligatures in HTML

On July 17, 2005, I found that Unicode had symbols for ligatures, which many common fonts implemented. These elegant remnants of the days of quality typesetting are conspicously absent from almost every webpage I have seen. LaTeX and TeX use them naturally, as do all other good typesetting and layout programs. Not only do they look better (compare the text below in various fonts for some examples), they also give the document a more professional feel. Since I found the Unicode entities, I have been going through the code of this site by hand (or sed script), changing appropriate letter combinations into ligatures. If you notice a mistake or an absent ligature, noting that each font implements a different set, please let me know. If anyone would like to implement these features in their HTML text formatting programs, I (and the rest of the font-loving nerds out there) would greatly appreciate it. I have found that all of the default fonts for modern operating systems (Windows, various flavors of UNIX, including MacOS X) all implement at least the “fi” and “fl” ligatures, so it is possible to make a general implementation work.

In my continuing search for a way to effectively implement ligatures in webpages, my friend Evan pointed me to PHP SmartyPants, Michel Fortin’s PHP port of John Gruber’s SmartyPants. This simple, yet incredibly effective PHP script seemed like the perfect opportunity to implement my ligature plan. Indeed, in some 20 minutes, with only minimal knowledge of PHP, I was able to modify the original version of PHP SmartyPants to also change the letters “fi” and “fl” into the corresponding ligatures. If you would like to use it, I’m providing a copy here. Drop me a line if you do use it—I’m interested to see who, if anyone, does.

 

The next day, I moved on to the original SmartyPants. At this point, I had as little experience with perl as I did with PHP, but the code was easy to patch. After a bit of work, I had fully functional ligature replacement in the original plugin. Let me know if you use this script as well. I am awaiting emails from both maintaners as to what to do with the patch. I will post updates here if anything happens. Michel Fortin replied that he would implement the patch in PHP Smartypants if it was added to the original. John Gruber, however, refused to add the patch, saying that it violated the separation between formatting and data. I see his point, but I've decided to continue to post my patches here, because who knows? People might just use them, and not everyone cares about those distinctions.

On January 12, 2007, Peter Bex wrote to me, saying that my Smartypants patch had inspired him to write Fancypants, a markup manipulator like Smartypants, that also includes ligature support and support for pretty arrows. Unlike Smartypants, however, Fancypants uses Scheme and SXML. This leads to a more natural, more extensible structure for the code. Take a look!

ff fi fl ffi ffl ſt st

ff fi fl ffi ffl ſt st