Notes
How this site is built
This website is a folder. There’s no framework in it, no package manager, no build step, and no deploy pipeline beyond pushing to the default branch. Writing down what that actually consists of seemed worthwhile, partly because it’s a fair sample of how we like to build things generally.
What’s in the folder
One HTML file per page, one stylesheet, one variable font, one SVG logo, and
three small text files: robots.txt, sitemap.xml and a
_headers file that the host reads to set response headers. That’s the
whole site. Editing it means opening an HTML file in a text editor, which is the
point.
No JavaScript
Not a small amount of JavaScript. None. Everything the pages do, they do with HTML and CSS: the sticky header, the focus styles, the entrance animation, the responsive grids. It’s a strange thing to ship a marketing site that can’t render without executing a program, and the moment you allow one script you inherit its dependencies, its update treadmill and its failure modes.
The practical benefit is that the content security policy can start from the strictest position available:
default-src 'none'; style-src 'self'; font-src 'self'; img-src 'self'
data:; base-uri 'none'; form-action 'none'; frame-ancestors 'none'
Nothing may load from anywhere except this origin, and scripts aren’t permitted at all. A policy like that is easy to write when you have nothing to exempt from it. It’s close to impossible to hold once a single analytics snippet is in the page.
The font is on our own server
The typeface is Archivo, a variable font licensed under the SIL Open Font License. It’s subset to the Latin range, which brings it to about 35 KB, and it’s served from this domain rather than a font CDN.
That’s a privacy decision before it’s a performance one. A webfont request to a
third party hands that party the visitor’s IP address, user agent and referring
page on every load. Self-hosting removes the request, and it’s what lets
font-src stay at 'self'.
The logo is a CSS mask
The mark appears in the header, in the hero and in the footer, and in none of
those places is it an <img>. It’s one SVG applied as a CSS mask
over a block that takes its colour from currentColor.
Two things fall out of that. The logo has exactly one source file, so changing the brand means replacing one SVG and touching no markup. And because the shape gets painted with the current text colour, it inherits hover states and colour changes for free, with no second asset for every variant.
No analytics
There’s no analytics package on this site, no tag manager, no pixel, and no cookie set by us. We don’t know how many people visit. That’s a mild inconvenience for us and no imposition at all on anyone else, and it’s why the privacy policy is short.
Why any of this matters
The stack is small enough to hold in your head, and it’ll still work in five years without a single dependency upgrade. That’s the same argument we make about the apps we build. Pick a foundation you can maintain on your own, keep the surface area small, and spend the time you save on the parts people actually touch.