← Back to home

How this site was made.

Built as a single self-contained static page. No CMS. No build step. No plugin attack surface. Edited in code, deployed by moving files.

Typography

• Fraunces. Display serif, used for headings, anchor wordmarks, and pull quotes. Variable axis, weights 400 to 600.
• Schibsted Grotesk. Body grotesque, used for prose and UI labels. Weights 400 and 600.

Both fonts are self-hosted in production.

Stack

• Static HTML and CSS, single file
• Hand-written, no framework
• Hosted on my own Proxmox cluster, on a container built for this site
• Cloudflare Tunnel ingress, nginx at the origin
• Google Analytics 4, IP anonymized

Composition

• Hero: six-tile asymmetric bento grid (the operator's console)
• Long read: single column, magazine voice
• Boot-in: tiles settle into place once, then static
• prefers-reduced-motion respected throughout

Credits

I designed, wrote, and built this site, with pattern guidance from Claude (Anthropic) during the structural design phase.