typography
OpenType features
also called font features, feature tags, font-feature-settings (css), OpenType
Optional glyph substitutions and spacing rules packed inside a font file, addressed by four-letter tags and switched on from CSS.
A font file is not only a set of drawings. It also carries tables of rules about
those drawings: replace this pair of letters with a single ligature,
swap these numerals for a set of a different width, rebuild this sequence as a
fraction, pull these two shapes closer together. Each rule set has a four-letter
tag, and the tags are the vocabulary you use to ask for them. Some are on before
you ask (liga, kern, calt); the interesting ones are not.
There are two ways to say it in CSS and they are not equals. font-variant-caps,
font-variant-ligatures, and font-variant-numeric are the high-level spellings:
they take readable keywords, they inherit sensibly, and separate declarations
combine. font-feature-settings takes the raw tags, and it is one property holding
one list, so a rule that sets "frac" 1 on an element that had "tnum" 1 from an
ancestor has just turned tabular figures off. Reach for the high-level property
whenever one exists, and keep font-feature-settings for tags that have no
keyword, chiefly the stylistic sets ss01 through ss20.
The awkward part is discovery. Nothing in CSS reports which tags a given file
actually carries, and asking for one that is missing is not an error: it simply
does nothing, silently, which is what the third row of the specimen is. The one
exception makes it worse, because font-variant-caps: small-caps will be faked by
the browser out of scaled capitals when the font has no smcp table, so the
declaration that looks like it worked is the one you should distrust. Real
small caps are drawn, not shrunk. Check a face before you build a
design on a feature, and remember that a fallback font will not
have the same tables.
Two habits keep this honest. Scope every feature to where it belongs, since
tabular figures across a whole document make prose look like a
spreadsheet and discretionary ligatures in running text are a distraction. And
remember that all of this is rendering only: the DOM still holds 1/2 and
office, so search, copy and paste, and screen readers see the characters you
wrote, not the glyphs that were drawn for them.
Which word?
| If you want | say |
|---|---|
| reaching for a font capability that is off by default | opentype features |
| switching a font's single-storey a on | stylistic set |
| a script font changes shape depending on its neighbours | contextual alternates |
| two letters collide and the font fuses them | ligature |