3 ms·

Can you provide an example of the font doing this? Substitution of individual characters with ligatures is in my experience a feature of the typesetting/display

by grzm 3y ago

Can you provide an example of the font doing this? Substitution of individual characters with ligatures is in my experience a feature of the typesetting/display engine (which decides how to represent the "bytes" as glyphs), not the font itself. Indeed, this ligature substation is often something you can toggle in whatever application you're using if it's capable of doing the substitution at all.

CGamesPlay 3y ago
I don't use ligatures at all, but I have seen it on websites. So perhaps it's the CSS of the website that has decided to do this. I don't have any specific examples off hand, but my mental picture puts it on sites that also use this style of font: https://rubjo.github.io/victor-mono/ https://rubjo.github.io/victor-mono/ (although typing fi into the sandbox on the site doesn't exhibit the behavior).
- grzm 3y ago
  Yup. It's the browser that's choosing to display this. As 'gdwatson pointed out, the font can indicate which ligatures are available, but whether or not the substation occurs also depends on the typesetting engine.
  - spockz 3y ago
    So then it is the responsibility of the font to make sure that when a ligature that it made available is used that is displayed as two characters wide instead of one?
    - grzm 3y ago
      If that's the shape the font designer wants for the ligature glyph, yes. IIRC, Tonsky's Fira code is designed with this in mind (https://github.com/tonsky/FiraCode https://github.com/tonsky/FiraCode) (Butterick uses Fira Code as his example.) But maybe it's the intent of the designer to have each glyph have the same width, not each "character", so the glyph LESS-THAN OR EQUAL TO (≤, https://www.compart.com/en/unicode/U+2264 https://www.compart.com/en/unicode/U+2264) would be the same width as < or =: it's ultimately up to the application/typesetting engine to decide whether or to substitute the character string "<=" as "≤", and to see if the font _has_ that character and how to render it to the screen. I suppose you could have the typesetting engine choose to somehow read the two characters, note that there's a ligature substitution, and "fit" the ligature glyph into a two-character space (say, padding the glyph or horizontally stretching it), but I doubt that would be very pleasing. But ultimately what gets displayed is up to the typesetting engine: it can choose to use or not use ligatures; it can choose the spacing between glyphs; whether to "fake" certain styles (such as italics), text justification — all sorts of behavior. Good typesetting is available in many more applications today than it was, say, 25 years ago. There was all kinds of janky behavior going on, both from the engines not using information in the fonts when it was available, and faking it or overriding it as well.
- grzm 3y ago
  And your example about CSS and browsers is exactly this. There can be information added to indicate how things should be displayed, but it’s ultimately up to the renderer. All the tricks used to adapt to various ways browsers render the same data, and sometimes the same (font and CSS) data in different contexts (say, as part of a <p> vs part of an <input>) in the same browser.
- CGamesPlay 3y ago
  Found an example: <https://api.slack.com/events/url_verification#markdown https://api.slack.com/events/url_verification#markdown> It appears to be because of `font-variant-ligatures: common-ligatures` being set on body.
gdwatson 3y ago
OpenType fonts can define ligation pairs. If the editor implements OpenType ligatures, it will read the instructions from the font and implement them. There will probably be a setting to enable or disable ligatures entirely, and there may be another one for which ligatures to include.
- grzm 3y ago
  > If the editor implements OpenType ligatures, it will read the instructions from the font and implement them. Exactly.
nyanpasu64 3y ago
Bitbucket used Nimbus Mono with this unfortunate behavior, until I disabled it with a Stylus CSS injection.
fweimer 3y ago
Overpass Mono does it: https://fonts.google.com/specimen/Overpass+Mono?preview.text=file&preview.text_type=custom https://fonts.google.com/specimen/Overpass+Mono?preview.text... It's been fixed in Red Hat Mono.
- sspiff 3y ago
  That looks so wrong. Why would they do this?
  - fweimer 3y ago
    I suspect is just a bug: the ligature tables were copied from the regular variant, and perhaps no one noticed for some reason. Maybe the assumption was that the renderer would turn of ligature processing in monospace mode at the time, and the reference renderer did that?
    - bityard 3y ago
      I can't find any examples now, but I'm positive that there have been "coding" fonts which do this that have hit the front page of HN. Highlighted as a feature in the screenshots, even. Another example of form over function, to the utter detriment of function, IMHO.
      - fweimer 3y ago
        Perhaps Fira Code? https://github.com/tonsky/FiraCode https://github.com/tonsky/FiraCode https://news.ycombinator.com/item?id=10764527 https://news.ycombinator.com/item?id=10764527 But I think it's different: it uses double-width characters for two-character ligatures, so this doesn't break alignment.
  - michaelcampbell 3y ago
    It's truly amazing that people can like different things, no?

by grzm 3y ago

CGamesPlay 3y ago

I don't use ligatures at all, but I have seen it on websites. So perhaps it's the CSS of the website that has decided to do this. I don't have any specific examples off hand, but my mental picture puts it on sites that also use this style of font: https://rubjo.github.io/victor-mono/ https://rubjo.github.io/victor-mono/ (although typing fi into the sandbox on the site doesn't exhibit the behavior).

grzm 3y ago
Yup. It's the browser that's choosing to display this. As 'gdwatson pointed out, the font can indicate which ligatures are available, but whether or not the substation occurs also depends on the typesetting engine.
- spockz 3y ago
  So then it is the responsibility of the font to make sure that when a ligature that it made available is used that is displayed as two characters wide instead of one?
  - grzm 3y ago
    If that's the shape the font designer wants for the ligature glyph, yes. IIRC, Tonsky's Fira code is designed with this in mind (https://github.com/tonsky/FiraCode https://github.com/tonsky/FiraCode) (Butterick uses Fira Code as his example.) But maybe it's the intent of the designer to have each glyph have the same width, not each "character", so the glyph LESS-THAN OR EQUAL TO (≤, https://www.compart.com/en/unicode/U+2264 https://www.compart.com/en/unicode/U+2264) would be the same width as < or =: it's ultimately up to the application/typesetting engine to decide whether or to substitute the character string "<=" as "≤", and to see if the font _has_ that character and how to render it to the screen. I suppose you could have the typesetting engine choose to somehow read the two characters, note that there's a ligature substitution, and "fit" the ligature glyph into a two-character space (say, padding the glyph or horizontally stretching it), but I doubt that would be very pleasing. But ultimately what gets displayed is up to the typesetting engine: it can choose to use or not use ligatures; it can choose the spacing between glyphs; whether to "fake" certain styles (such as italics), text justification — all sorts of behavior. Good typesetting is available in many more applications today than it was, say, 25 years ago. There was all kinds of janky behavior going on, both from the engines not using information in the fonts when it was available, and faking it or overriding it as well.
grzm 3y ago
And your example about CSS and browsers is exactly this. There can be information added to indicate how things should be displayed, but it’s ultimately up to the renderer. All the tricks used to adapt to various ways browsers render the same data, and sometimes the same (font and CSS) data in different contexts (say, as part of a <p> vs part of an <input>) in the same browser.
CGamesPlay 3y ago
Found an example: <https://api.slack.com/events/url_verification#markdown https://api.slack.com/events/url_verification#markdown> It appears to be because of `font-variant-ligatures: common-ligatures` being set on body.

gdwatson 3y ago

OpenType fonts can define ligation pairs. If the editor implements OpenType ligatures, it will read the instructions from the font and implement them. There will probably be a setting to enable or disable ligatures entirely, and there may be another one for which ligatures to include.

grzm 3y ago
> If the editor implements OpenType ligatures, it will read the instructions from the font and implement them. Exactly.

nyanpasu64 3y ago

Bitbucket used Nimbus Mono with this unfortunate behavior, until I disabled it with a Stylus CSS injection.

fweimer 3y ago

Overpass Mono does it: https://fonts.google.com/specimen/Overpass+Mono?preview.text=file&preview.text_type=custom https://fonts.google.com/specimen/Overpass+Mono?preview.text... It's been fixed in Red Hat Mono.

sspiff 3y ago
That looks so wrong. Why would they do this?
- fweimer 3y ago
  I suspect is just a bug: the ligature tables were copied from the regular variant, and perhaps no one noticed for some reason. Maybe the assumption was that the renderer would turn of ligature processing in monospace mode at the time, and the reference renderer did that?
  - bityard 3y ago
    I can't find any examples now, but I'm positive that there have been "coding" fonts which do this that have hit the front page of HN. Highlighted as a feature in the screenshots, even. Another example of form over function, to the utter detriment of function, IMHO.
    - fweimer 3y ago
      Perhaps Fira Code? https://github.com/tonsky/FiraCode https://github.com/tonsky/FiraCode https://news.ycombinator.com/item?id=10764527 https://news.ycombinator.com/item?id=10764527 But I think it's different: it uses double-width characters for two-character ligatures, so this doesn't break alignment.
- michaelcampbell 3y ago
  It's truly amazing that people can like different things, no?