A colophon traditionally describes how someone made a book: the typefaces, paper, and printing methods. This page serves a similar purpose for this website, documenting the design choices and technologies that shape the reading experience.
Typography
All body text uses Spectral, designed by Production Type (Jean-Baptiste Levee) and commissioned by Google for intensive text environments. Spectral draws from the French Elzevir tradition of nineteenth-century printing, with high contrast between thick and thin strokes and a moderate x-height that aids readability on screens.
Code samples use IBM Plex Mono, designed by Mike Abbink at IBM with Bold Monday. Plex Mono balances technical precision with humanist warmth, featuring square counters, a slashed zero, and thoughtful details that make code comfortable to read for extended periods.
Both typefaces share sophisticated design pedigrees and comprehensive weight ranges. The transition from Spectral prose to Plex Mono code feels natural rather than jarring.
Technology
I built this site with Astro, a modern static site generator that favors performance and developer experience.
Cloudflare Workers hosts the site, providing global CDN distribution and edge computing capabilities. Cloudflare also manages DNS and other services.
Source code is version controlled with Git and hosted on GitHub. The development process emphasizes accessibility, performance, and semantic markup as foundational concerns rather than afterthoughts.
Design philosophy
This site aims to feel like reading a well-designed book adapted for the web. The design draws from principles of book typography: restraint, proportion, generous whitespace, and typography that serves the reading experience rather than demanding attention.
Key principles
- Restraint and proportion - Beauty emerges through measured reduction rather than decoration. Every element serves the reading experience.
- Comfortable reading measures - Body text maintains 60-75 characters per line, favoring readability over filling the screen.
- Accessibility as foundation - Proper semantic structure, clear hierarchy, and adequate contrast serve all users. Color alone never conveys meaning.
- Performance as craft - Fast loading and smooth rendering are as important as visual beauty. A beautiful site that loads slowly fails its purpose.
Inspiration
The design draws from classic book typography and the Van de Graaf canon for proportions. Edward Tufte's work on information design influences how visuals integrate with text. Robert Bringhurst's The Elements of Typographic Style informs typographic decisions.
Modern web implementations that show these principles well include Linear's documentation, Stripe's design, and thoughtfully crafted personal sites that favor reading over impression.
Color
The site offers three color palettes (Cream, Gray, and Ivory), each with light and dark variants. All color combinations meet WCAG AA contrast requirements for accessibility, with most achieving AAA compliance.
The default Cream palette uses warm paper tones in light mode, evoking aged book pages. Dark mode feels like reading a well-lit book at night, with warm charcoal backgrounds rather than stark black.
Questions about the site? Feel free to reach out. I enjoy discussing design and technology choices.