Gustama Dimas

This site runs on Chyrp Lite — a small, self-hosted blogging engine that does roughly what I need and nothing else. It's been up for a while on the default theme, which is perfectly good and completely anonymous. I finally rewrote it.

What was wrong

Not much, honestly. The theme worked. But three things bothered me.

First, the navigation listed ten pages in one flat list, and seven of them existed only to embed a service in an iframe. Several of those embeds pointed at endpoints that no longer answer, or that refuse to be framed at all. The sidebar was offering links to broken panels.

Second, the layout was a single narrow column with a sidebar and no sense of what the site was for. A visitor landed on it and learned my name. That was about it.

Third, the content was a list of facts with no way in.

What I changed

A real homepage. Instead of dropping visitors straight into the blog index, there's now a front page: who I am, where I am, what I do, and four ways to go deeper. It answers the question the old site left hanging.

Navigation that reflects the actual structure. The per-service pages are gone from the menu. They still exist — every old link still resolves — but the Home Lab page now links out to each service directly, with a one-line description of what it is. Seven iframe panels became one readable index.

A theme with an opinion. IBM Plex Sans and Plex Mono, self-hosted rather than pulled from a CDN. Monospace is reserved for labels, metadata, and anything that reads as data. The palette is warm off-white with a single copper accent, used for links and almost nothing else.

The service list is styled as a rack: index number, name, what it does, and whether it's open to the world or only reachable on the LAN. That last column is the honest one — it tells you before you click whether a link is about to ask for a password.

Accessibility wasn't an afterthought

• A skip link for keyboard users, since the sidebar comes first in the markup
• Visible focus outlines on every interactive element, in the accent colour
• prefers-reduced-motion respected — no transitions, no smooth scrolling, for anyone who's asked for neither
• prefers-contrast: more pushes borders and text to full black
• A print stylesheet, because these pages are worth keeping on paper

What I'd do differently

Write the content before the theme.

I spent a while designing components — a hero, a status strip, a rack table — and then had to go back and rewrite the page copy to fit them. The design turned out fine. The order was backwards.

Next time: decide what the page needs to say, then decide what it needs to look like.