Typeset.js is a small library that aims to improve typography on the web — by bringing it closer to its written word counterparts i.e. newspapers and magazines.
I use @liamfiddler’s typeset plugin on my Eleventy site. Overall, it’s a small difference that not many readers will notice until shown two content pieces side by side. At least, that’s how I realized how much of a difference it makes.
It’s missing a couple of
fis because Typeset ate them. The alphabet f followed by the alphabet i is a common ligature apparently — and Typeset converted the plain-text
ﬁ, which made it harder for machines to read it.
What are ligatures? This is how Wikipedia introduces them:
In writing and typography, a ligature occurs where two or more graphemes or letters are joined as a single glyph. An example is the character æ as used in English, in which the letters a and e are joined. The common ampersand (&) developed from a ligature in which the handwritten Latin letters e and t (spelling et, from the Latin for “and”) were combined.
Because this makes it harder or impossible for machines to read, it’s also a bad fit for the web and might even affect your search results (and therefore SEO) as discussed on the English StackExchange community above.
I updated the configuration to exclude ligatures while typesetting and now my comment appears properly:
const pluginTypeset = require("eleventy-plugin-typeset")
I had noticed this issue in other places but never figured out why this weird behaviour was present at all, until looking at the raw HTML now.
If you use Typeset and/or its Eleventy plugin, please be wary of this and update your Eleventy configuration.