Font-Family Recommendations
chrismorgan.info
Font-Family Recommendations
1–10 of 22 posts
Re: Font-Family Recommendations
#2These days you can have an LLM code you up python to custom match visual metrics from your preferred web fonts to the likely user fonts across your statistical user base.
Re: Font-Family Recommendations
#3So basically just use monospace, serif, or sans-serif because you can't 100% be sure it'll render correctly?
Re: Font-Family Recommendations
#4> If not inlined, subresources can fail to load for all kinds of network reasons.
Also, it's commonly recommended to load fonts asynchronously/deferred without blocking the main page render. But I HATE it when the page jumps around as it cycles through different fonts before the real one loads. I'd rather get dinged on PageSpeed insights with "Requests are blocking the page's initial render, which may delay LCP. Deferring or inlining can move these network requests out of the critical path." rather than have everything popping about for the first second. Is it just me?
Re: Font-Family Recommendations
#5> If not inlined, subresources can fail to load for all kinds of network reasons. Also, it's commonly recommended to load fonts asynchronously/deferred without blocking the main page render. But I HATE it when the page jumps around as it cycles through different fonts before the real one loads. I'd rather get dinged on PageSpeed insights with "Requests are blocking the page's initial render, which may delay LCP. Defe…
Def not just you!
Re: Font-Family Recommendations
#6So basically just use monospace, serif, or sans-serif because you can't 100% be sure it'll render correctly?
Fuck that. I don’t want my website to look ugly because 99.9% of users don’t bother to change the defaults.
Re: Font-Family Recommendations
#7These days you can have an LLM code you up python to custom match visual metrics from your preferred web fonts to the likely user fonts across your statistical user base.
But why?
Re: Font-Family Recommendations
#8> If not inlined, subresources can fail to load for all kinds of network reasons. Also, it's commonly recommended to load fonts asynchronously/deferred without blocking the main page render. But I HATE it when the page jumps around as it cycles through different fonts before the real one loads. I'd rather get dinged on PageSpeed insights with "Requests are blocking the page's initial render, which may delay LCP. Defe…
This drove me crazy on one of my (very lightweight) static sites... even on incredibly fast connections you'd always see that FOUT. I managed to solve it with font-display: fallback.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/A...
I also had to make sure I was preloading my fonts properly... not sure if this is the same guide I followed, but it's close. The only difference is that I swapped that "&display=swap" to "&display=fallback":
Re: Font-Family Recommendations
#9So basically just use monospace, serif, or sans-serif because you can't 100% be sure it'll render correctly?
Fuck that. I don’t want my website to look ugly because 99.9% of users don’t bother to change the defaults.
This is not at all what the article recommends. I recommend actually reading it.
Re: Font-Family Recommendations
#10Earlier quoted context omitted.
Fuck that. I don’t want my website to look ugly because 99.9% of users don’t bother to change the defaults.
This is not at all what the article recommends. I recommend actually reading it.
> 3. Strongly consider using only a generic family
Seems clear enough.