Style tweaks: some progress
As I wrote earlier, I’m stumbling my way through some style tweaks, inching away from the default Bear Blog themes. I want this site to have its own vibe.
Perhaps the biggest decision someone in my shoes must make is what the text looks like. Typeface, font, colors, etc. As someone with the design intuition of a turnip, I’m desperately seek the opinions of wiser people.
After flopping around in the stylesheet for a few days (apologies if you witnessed some of my poorer decisions), I think I’m at a point where I can stop bikeshedding. Here’s how the dust is settling for the moment.
I want some spice. I’ve injected whimsy into my site’s title and nav links. I’m using a font that looks like handwriting (Caveat). In dark mode, my title lights up with color and glow like a neon sign. I haven’t found any guidance telling me I’m a terrible person for doing this. It’s just a few words, and it packs some personality.
Some might point out that loading a Google Font raises my site’s carbon footprint by adding another HTTP request and about 50kb to the total payload (once per browser, mind you, and then it’s cached). But this site is lean af by modern standards. I’ll sleep at night.
Elsewhere, I want readability. On the rest of the site, I’m using the sans serif system font stack and high-ish-contrast colors. These are safe, boring choices. The curmudgeons should be placated.
I also bumped up the font scale to 1.1em to make it easier to read on mobile.
Resources. Here are a few guides I consulted:
- Smashing Magazine’s A Reference Guide For Typography In Mobile Web Design
- Iain Bean’s System fonts don’t have to be ugly
- Not ready yet’s Never, ever use system-ui as the value of font-family
I’d love your input. Email me!