Typography
Illustrated chapter
The full scale, the tracking curve, and the two-readers test, set in the real faces at the real sizes.
Website Examples
The system running, rather than described
A standard you can inspect is worth more than a standard you are asked to believe. Everything on this page is the real artefact: open it, resize it, print it, turn JavaScript off, read it in dark theme. It should hold up.
In active development
- What this section covers
- The system in use rather than described: the illustrated chapters, this publication, and the measured evidence behind both.
- Why it matters
- A standard you can inspect is worth more than a standard you are asked to believe.
- How it connects
- Everything else on this site is the specification. This is the artefact.
The illustrated chapters
Chapters that demonstrate their rules instead of stating them
Each one is a long-form publication at production density, with live specimens, measured values, and a print layout that works. They are the deepest evidence on this site.
Colour Language
Illustrated chapter
Every approved pair with its measured contrast ratio, the four-channel status model, and both themes shown rather than described.
Identity System
Illustrated chapter
Every logo variant, its clear space, its minimum size, and the misuse set, all from one currentColor source.
This website
The fourth example is the one you are using
This site is built from the system it documents. There is no framework, no content management system, no database and no build tooling beyond a set of small scripts that read the source chapters and write the pages. Every page is an ordinary HTML file that opens directly in a browser.
That is not minimalism for its own sake. It is the argument the practice makes, applied to itself. If I tell a client their site is heavier and more complicated than it needs to be, the least I can do is publish something that is not.
What has been measured
Zero horizontal overflow from 320 pixels to 1600, in both themes. Zero font fallback: the brand faces only, verified in the document rather than assumed. Zero broken links, internal or external. Every colour pair meets its stated target, with the ratio computed rather than estimated. The heading tree descends properly on every page, with one first-level heading each.
Seven font files are deployed, which is exactly the number the stylesheet names. The font store holds thirty-two, and the other twenty-five are weights and italics the type system has refused with a reason recorded for each. The deploy script parses the stylesheet and copies only the faces it names, so it is impossible to accidentally publish a face the system rejected.
Three consecutive builds produce byte-identical output. That matters because it means a difference between two deployments is always a real change rather than build noise.
What has not been measured, and I would rather say so
The measurements above were taken in one browser engine. There has been no automated accessibility audit, no screen reader testing with a real assistive technology, and no figure for transferred bytes on a real connection. Text resizing to 200 per cent is required by the accessibility chapter and has never been tested, which is recorded as an open item rather than quietly left out.
Stating those limits is the pattern rather than an apology for it. A measurement without its method is decoration.
Client work
There are no case studies here yet
I would rather say that plainly than pad this page. Client websites are being worked on and none of them has been written up, and a case study assembled to fill a gap tends to read exactly like one.
When they arrive they will be here, with the measurements that made the case rather than an adjective about the outcome. Until then this system is the evidence, and it has the advantage of being something you can check for yourself rather than take my word for.
If you want to know what your own site would look like measured this way, that is a conversation rather than a page.