3

Kottke.org Redesigns With 2024 Vibes

 6 months ago
source link: https://kottke.org/24/03/kottkeorg-redesigns-with-2024-vibes?ref=sidebar
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

posted 7d ago by Jason Kottke

Kottke.org Redesigns With 2024 Vibes

a screenshot of the new kottke.org redesign for 2024

Well. Finally. I’m unbelievably pleased, relieved, and exhausted to launch the long-awaited (by me) redesign of kottke.org today. Let’s dive right into what has changed and why.

{ Important: If the “logo” on the left/top is not circles and is squares/diamonds instead, you can update your browser to the latest version to see it how I intended. (Will be looking for a fix for this…) }

(Justified and) Ancient. The last time I redesigned the site, a guy named Barack Obama was still President. Since then, I’ve launched the membership program, integrated the Quick Links more fully into the mix, (more recently) opened comments for members, and tweaked about a million different things about how the site works and looks. But it was overdue for a full overhaul to better accommodate all of those incremental changes and, more importantly, to provide a solid design platform for where the site is headed. Also, I was just getting tired of the old design.

Back to the Future. In my post introducing the new comments system, I wrote about the potential for smaller sites like mine to connect people and ideas in a different way:

The timing feels right. Twitter has imploded and social sites/services like Threads, Bluesky, and Mastodon are jockeying to replace it (for various definitions of “replace”). People are re-thinking what they want out of social media on the internet and I believe there’s an opportunity for sites like kottke.org to provide a different and perhaps even better experience for sharing and discussing information. Shit, maybe I’m wrong but it’s definitely worth a try.

Before Facebook, Tumblr, Twitter, Instagram, and Snapchat came along and centralized social activity & output on the web, blogs (along with online diaries, message boards, and online forums) were social media. Those sites borrowed heavily from blogging — in the early years, there wasn’t much that those sites added in terms of features that blogs hadn’t done first. With the comments and now this redesign, I’m borrowing some shit back from the behemoths.

A social media design language has evolved, intelligible to anyone who’s used Twitter or Facebook in the past decade. Literally billions of people can draw what a social media post looks like on a napkin, show it to someone else from the other side of the world, and they’d say, “oh, that’s a post”. In thinking about how I wanted kottke.org to look and, more importantly, feel going forward, I wanted more social media energy than blog energy — one could also say “more old school blog energy than contemporary blog energy”. Blogs now either look like Substack/Medium or Snow Fall and I didn’t want to pattern kottke.org after either of those things. I don’t want to write articles — I want to blog.

Practically speaking, “social media energy” means the design is more compact, the type is smaller,1 the addition of preview cards for Quick Links, and the reply/share/???? buttons at the bottom of each post. But, it also still looks like a personal (old school) blog rather than a full-blown Twitter clone (I hope). I think this emphasis will become clearer as time goes on.

So What’s Different? I mean, you can probably tell for yourself what’s changed, but I’ll direct your eye to a few things. 1. Member login + easy account access for members on the top of every page. kottke.org has always been very much my site…but now it’s just a little bit more our site. 2. No more top bar (on desktop), so the content starts much higher on the page. 3. Most Quick Links have a preview card (also called an unfurl) that shows the title, a short description, and often an image from the link in question — the same as you’d get if someone sent you a link via text or on WhatsApp. 4. We’ve bid a fond farewell to the Whitney typeface and welcomed Neue Haas Unica into the fold. 5. IMO, the design is cleaner but also more information dense, reflecting the type of blogging I’d like to do more of. 6. Dark mode! There’s no toggle but it’ll follow your OS settings.

Billions and Billions. kottke.org has (famously?) never had a logo. I’ve never wanted one thing to represent the site — in part because the site itself is all over the place and also because it’s fun to switch things up every once in awhile. Instead, I’ve always gone for a distinctive color or gradient that lets readers know where they are. This time, I’ve opted for a series of circles — a friend calls them “the planets” — but with a twist. There are 32 images, each with 4 different hues and 8 different rotations, that can slot into the 4 available spaces…and no repeats. By my calculations (corrections welcome!), there are over 900 billion different permutations that can be generated, making it extremely unlikely that you’ll ever see the same exact combo twice. Even if, like last time, this design lasts for almost eight years.

Gimme the Goods. The tiny collection of kottke.org t-shirts has its own page on the site now. The Hypertext Tee based on the previous design will be offered only for another few weeks and then probably be retired forever. To be replaced with…TBD. 😉

Winnowing Down. Last time I redesigned, I went back and modified the template of every page on the site, even stuff from the late 90s and early 00s that no one actually remembers. This time around, I’m focusing only on the core site: blog posts from 1998-present, tag pages, membership, and the few pages you can get to from the right sidebar. The rest of the site, mostly pages deep in the archive that see very little (if any) traffic, are going to stick with the old design, effectively archived, frozen in digital amber. We wish those old pages well in their retirement.

So yeah, that’s kind of it for now. There is so much left to do though! The comments need some lovin’, some social media things need tightening up, the about page could use some tuning, the newsletter needs a visual refresh, a few other small things need doing — and then it’s on to the next project (which I haven’t actually decided on, but there are several options).

I’m happy to hear what you think in the comments, on social media, or via email — feedback, critique, and bug reports are welcome. Now, if you’ll excuse me, I have not taken a full day off from the site since late December (including weekends), so I’m going to go collapse into a little puddle and sleep for about a week.


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK