I’m customizing my Discourse theme and want to update the default font (body/heading) to something more unique that matches my community’s branding. I know Discourse allows setting fonts via Admin > Customize > Themes/Colors, along with the option to add custom web fonts via CSS.
Few things I’d love input on:
Do you prefer using Google Fonts, self-hosted fonts, or the built-in Discourse font options?
Any performance concerns (page load speed) when adding custom web fonts?
Are there any accessibility best practices to keep in mind when choosing fonts for readability?
Would appreciate any tips, theme component recommendations, or experiences you’ve had customizing fonts on your own Discourse instance!
My take would be: avoid monospace-esque fonts (e.g. JetBrains Mono) because it’s harder to read, unless your community is comprised of hardcore developers . But seriously, I have been on a community with that font, and it’s not easy (plus, the letters are too spaced-out for my liking).
Self-hosting is always nice because you can remove the reliance on an external asset, so one less network request to make. You can download and host Google Fonts yourself, and the built-in Discourse font options are also sourced from Google and don’t rely on their servers.
As mentioned, having the fonts served from your site directly is better for performance (though fonts are usually small so it’s not a major concern). Try to not include more variants and styles than you need, usually two different fonts with normal and bold weights is plenty.
Mostly watch out for fonts that are really light in appearance, and if your site has a dark mode double check that for readability too… sometimes the color scheme can make a big difference. Try zooming in/out in your browser and changing the font size in your user preferences to make sure nothing unexpected happens.
. But seriously, I have been on a community with that font, and it’s not easy (plus, the letters are too spaced-out for my liking).