Tagging pages

The vision of the freehouse has been fulfilled. Hobby corners are no more, say welcome to… tags!

Public pages on the website are now tagged, meaning that each page has a set of categories assigned to it.

I’ve been working on it for the past few days, and I really like the result!

I have to give a disclaimer: this change could’ve broken my blog in your feed reader!

If that’s the case, I am terribly sorry for the havoc caused.
I tried to keep the breaking changes to a minimum, but I can’t predict everything.

You might say to me, “But riki, isn’t this what blogs do by default? Why did it take considerable engineering effort to get to this?”

To which I can respond that sometimes, learning something valuable takes a few failed attempts.

I originally set out with the goal of this blog being a bit non-standard. This is what the whole nesting tree format was about. I thought it would be super cool and ultra flexible any time I wanted to make some major changes to the website’s structure.

Originally, I set out with a design for “hobby corners,” where each of my hobbies was a foldable section in the tree.

  • Programming
    • Article 1
    • Article 2
  • Design
    • Article 1
    • Article 2
  • Music
    • …
  • Philosophy (shower thoughts)

The reality is, that design never underwent any changes. The website has largely stayed the same, and the supposedly flexible structure of the tree has resulted in me falling into one obvious spot rather than experimenting.

And when I was seeing the design’s deficiencies, I could never alter them, because turns out laying out your webpage like that actually makes it very rigid!

Trust me, there’s nothing more flexible than blocks of text.

I mean, look at this.
Would you be able to do something like this with a tree?

I fear not.

So I settled on a more standard blog-like structure for the 2nd iteration. But the old system remained, including the old new page, which already implemented an idea of feeds for transforming the tree into an Atom feed.

When I transitioned the blog to its 2nd iteration, I used that old feed system to show a post list on the home page. That system supported assigning tags to entries, which were available as <category> tags in the generated Atom feed. I showed those tags in the home page feed too, so that you could see what categories a post belongs to. There was no way to filter through tags, though.

By my own stupidity, I also made it impossible to Ctrl+F for #tagname by inserting the hash tag # via ::before in CSS.

After the 2nd iteration, which got rid of hobby corners, I really wanted to bring them back. I really liked the idea of having a “front page” for each subcategory of posts, where I could give further context on a hobby, opinions on a technology, or an overview of a project.

So with today’s update, I revamped the tags a bit.

I made each tag have its own home page. You can browse them all here. There’s also a special tag #all, for posts listed on the home page.

Doing this required reworking the feed system a bit.

I abandoned the idea of generating a feed from a tree file. Each page now defines tags and an ID for the Atom feed on its own.

title = "A tagging system for pages"
id = "doc?20250826-page-tags"
tags = ["all", "treehouse"]
updated = "2025-08-26T19:20:00+02:00"

+++

The vision of the [freehouse][page:design/freehouse] has been fulfilled.
Hobby corners are no more, welcome to... tags!

The tags field is used to assign the page to different tags. There’s also updated for sorting pages in a tag chronologically.

Then, each document is allowed to display a feed next to itself. This is my replacement for a special-case system for generating a list of posts.

title = "#programming"
include_feed = { tag = "programming", title = "Pages" }

+++

Honestly my favourite thing to do.
I've been programming for over 10 years now, and there's no sign of it stopping.

The feed is generated by listing all pages under a tag, and sorting them from newest to oldest.

Each page in the feed lists all the (other) tags it belongs to. Clicking on a tag will take you to its corresponding tag/{tagname} page, which in all cases is literally just an ordinary document reusing that include_feed mechanism.

(I actually devised this include_feed mechanism for the home page, just now it’s rewritten to use tags instead of feed pages.)

On wide enough displays, that feed is shown as a sidebar, which is why I only ever inflict it upon you on main pages for tags. I wouldn’t want you to get distracted with it while reading a full post.

But having those main pages serving as descriptions for tags honestly feels great. It feels to me like it will make the whole system more interesting for the readers of the blog. Combine this with the fact that I intend to follow the Lobsters philosophy of not adding too many tags, to make them feel really meaningful, rather than “just another blogger’s meaningless attempt at grouping their posts.”

I’ve seen lots of bloggers fall into the trap of defining tags too soon ahead of time, and ending up with lots of tags that only ever have one post in them. I’d like to avoid that by only adding tags once there are a few posts which can’t be better categorised into something else.

I know this post is a bit all over the place. But I really wanted to share it, because I think it’s a cool lesson in humility.

I wanted to create a brilliant system with an infinitely nesting tree. It turned out too complicated, so I reverted to something more ordinary: a blog with tags.

But at the same time, I saw space for improvement in that ordinary system: making tags feel more meaningful through a small set of them with long descriptions.

Sometimes the simplest systems are, in fact, the coolest.

There’s a reason why so many people implement them, after all.