This website

This site is my portfolio, blog, research archive and personal library in one place. I wanted somewhere to publish projects, essays, lessons, studies and reading notes side by side, filed by topic, and easy to add to every week.

Design

The layout follows the editorial style of a large university website: big serif headlines, a calm black, white and grey palette, generous spacing, and photography doing most of the visual work. The aim was a site that feels like an institution’s publication rather than a template.

A few details I cared about:

• A masthead that gets out of the way. It hides when you scroll down to read and comes back when you scroll up.
• A full-screen menu where each section opens on click, with a faded photo behind it.
• Quiet motion. Elements fade in once as you scroll, and nothing moves while you read. Visitors who turn off animations in their system settings see none.
• A logo of my own, an A and K monogram, used for the header, the menu and the browser tab.
• Link previews, so a shared link shows a proper card in messaging apps and on social sites.

How it is built

• Astro generates the whole site as static pages, so it is fast and cheap to host.
• Markdown files hold all the content. Each type, such as articles, lessons, studies, book notes, quotations, projects and ideas, has its own folder. Publishing something new means adding one file.
• Content checks at build time catch mistakes such as a missing title or an unknown topic before anything goes live.
• Pagefind powers the search, built from the finished pages with no server needed.
• RSS feeds for everything and for each section.
• Vercel hosts the site and redeploys it automatically whenever I push a change.

What I learned

• Copying a strong design system closely teaches more than loosely borrowing from it. Matching spacing, type scale and behaviour forced me to understand why each choice was made.
• Plain text content ages well. The articles here will still be readable files long after any framework changes.
• Most of the work in a “simple” site is in the small things: how a menu animates, where an arrow sits, what happens on a phone.

What is next

• A custom domain.
• More writing, and the first results from the studies in progress.