alt Hacker NewsIMO a font specimen site may be the worst place to use font-display: swap. Was wondering why I was looking at what seemed indistinguishable from Courier, turns out what I saw was exactly Courier.
Replies
For those not in the know (or who didn't suffer through having to write CSS manually): font-display: swap changes the default behavior from "No text visible until font been loaded" to "Display fallback font until specified font is available", meaning you'll see Courier until Iosevka loaded properly, or Courier forever if the font file failed to load.
I'm guessing the website author added that after some "website performance tool" recommended it, as they make sweeping generalizations that don't always make sense in every context, and "always add font-display: swap so text is readable earlier" is now a dogmatic rule "web developers" (mechanical or wetware ones) add without thinking, so that precious performance number goes up.
On my iPad, I’m pretty sure Fira Code and IBM Plex in the example box are displaying as Courier. They’re certainly both identical.
was also confused...
I had thought that was an intentional animation to show the different weights and variants