Shufflin’
Last month I redesigned my website, so it’s about time to do it again. This one includes a bunch of interesting details to talk through but perhaps it’s better to call this a “reshuffle” more than a “redesign.”
i.
I’ve replaced everything with Söhne, my typographic kudzu: I spotted these beautiful letters a few months ago and every time I return to them they grow on me a little more. Which is odd since because Helvetica was everywhere growing up, I’ve never looked kindly upon neo-grotesques. Every poster and movie and every logo and website used some flavor of Helvetica. As a budding designer, it felt like Helvetica was a problem, an antagonist, the typographic equivalent of a lazy metaphor that’s best avoided.
If you put Helvetica right up next to Söhne then most folks probably wouldn’t notice the difference. And yet...Söhne is still a constant surprise. It has this warmth and elegance that is especially Klim, capturing the printed feeling of Akzidenz-Grotesk—the great grandfather of Helveticas.
Here’s a paragraph set in Helvetica Neue. A lot of folks argue about the differences between Arial and Helvetica and the Neue version but it’s all the same to me. There’s a mechanical bite, maybe even a lack of humanity in these shapes. There’s nothing to point to exactly, it’s more a gut feeling.
See how the difference is so slight between these two paragraphs and yet you can feel it, right? Maybe it’s in the letter spacing. Either way, I hear chalkboards screeching when paragraphs of text are set in the Helveticas. Söhne is somehow more graceful and kinder on the eyes: I can read it all day long and still want to read more.
ii.
You might notice maps in a few places—in the header, in the footer—and that’s all stolen from these old maps of the Bay Area, preserved by Berkeley Library Digital Collections which has a fabulous URL: https://digicoll.lib.berkeley.edu/record/59124. Just look at that bad boy! That’s a URL you can trust to have some real nerdy stuff inside.
This proves Henry’s point about what makes for a cool website:
the coolness of the url is inversely proportional to the coolness of the web project. the best website you'll ever find is gonna be something like libra.v2.progrecali.edu/oct2023/dept/manifesto.html, but going to etherzone.ooo or, say, x.com will be the worst experience of your life
Anyway, I’ve added maps here because I wanted to capture something about the Bay Area that I haven’t seen in websites. Like, when you pick up a book about the history of London you’ll see flags and crumpets or some such visual motifs but the Bay Area? Besides the bridge and some other cheesy stuff it’s kinda hard to know how to represent that this place is home for me. Anyway, I’m gonna keep working on those visual hints over time since here I’ve sort of made my website look like a BDSM website dedicated to the work of David Fincher.
iii.
I’ve added a new projects section which is sort of like a portfolio but really it’s just all the work I want to brag about. This’ll eventually include everything from tiny projects with friends, to medium-sized freelance gigs, to enormous, months-long projects at my day job.
It took me ages to figure out what I wanted this to be. I looked at all sorts of portfolios for inspiration; Lynn’s, Jessica’s, Kevin’s, and the overwhelming and yet incredible case studies of Bethany Heck.
Eventually I figured that I just want to show a few pics and a quick snippet of a description. These might become more visually impressive over time but for now I just wanted to have an archive of work somewhere. Next I’ll iterate on that list page because it should probably pack more of a punch.
iv.
I think it was maybe the fourth or fifth redesign of this website where I realized I had to stop. Blowing everything up and starting again doesn’t really make much sense and would lead to me not pushing updates to my site for months at a time. I would mix up CMS refactors with smaller typographic changes and this would stall everything and make it so much harder to make any kind of progress.
I needed to see my website differently, as a constantly evolving thing, something I can keep pushing in a direction over the years and keep refining over time. Like with this reshuffle I kept the header the same but everything went dark mode. I kept most of the copy of the /about page the same. Same goes for /essays. But then I completely changed all the typesetting for /notes.
This is the way to build a personal site, I realize now; slowly, small-ly, iteratively.