Colophon
Notes on how this site is put together, mostly so I remember the reasoning when I inevitably want to change something.
Type
No webfonts. The body is set in whatever serif the system provides
— ui-serif first, then Iowan Old Style, Charter, Sitka,
Cambria, Georgia as fallbacks. Interface text and captions use the system
sans stack, dates and figures the system monospace.
The case for self-hosting a typeface is real, but so is the case for zero network requests and no layout shift, and on a site that is entirely text the system stacks are already good.
- Base size
clamp(1.0625rem, 1.0125rem + .22vw, 1.1875rem)— 17px on a phone, 19px on a wide screen, and it still respects browser font-size settings because the terms are in rem.- Measure
66ch. The research settles between 50 and 75 characters per line, with 66 the most commonly cited optimum.- Leading
1.6for body,1.18for headings. Unitless, so it scales with the font rather than fighting it. Long measures want looser leading; large type wants tighter.- Scale
- Major third, 1.25. Every step is fluid via
clamp(), which removes the need for breakpoints on type. - Rhythm
- A single spacing unit of
1.6rem, multiplied. Margins are all fractions or multiples of it, which is why the page feels regular even though nothing is on a strict baseline grid.
Colour
Two schemes, chosen by prefers-color-scheme rather than a
toggle. A toggle is a preference the reader has already expressed at system
level, and asking twice is rude.
Contrast on body text clears WCAG AA in both schemes. Secondary text sits lower deliberately — it is secondary, and flattening the hierarchy to chase a number makes the page harder to scan, not easier.
Detail
text-wrap: balance on headings so short lines do not leave a
single orphaned word. text-wrap: pretty on paragraphs for the
same reason at the end of blocks. hanging-punctuation where the
browser supports it.
There is a print stylesheet. Nobody will print this. It took four minutes and it is the kind of thing that separates a site someone made from a site someone generated.
Hosting
Static files on a small server in Finland, served by nginx. No JavaScript — not as a statement, there is simply nothing here that needs it. No analytics, no third-party requests, nothing that phones anywhere.
Total weight of this page is under fifteen kilobytes including the stylesheet. That is not an achievement, it is just what happens when a text site is built as a text site.