CrossFit Onen · Event microsite
The Dairy Grind is a two-day team fitness competition on a working dairy farm in North Cornwall. The site had one job: convince a team captain to commit six people, a weekend, and an entry fee — without ever leaving the page.
Entering a team competition is a high-friction decision. A captain has to persuade five other people, book time off, sort travel and camping, and hand over an entry fee — usually while scrolling on a phone, in a gym, between sets.
Most grassroots events answer this with a linktree and an Instagram post. The information a captain actually needs — what the workouts look like, where it is, what it costs, whether there is somewhere to sleep, whether spectators pay — is scattered across a dozen stories that expired last week.
The raw material for something better already existed: 1,282 photographs from the 2025 event, shot by @unearthedcreative_. Nobody had done anything with them.
One page. Everything a captain needs, in the order they need it, with a call to action at every point where a decision gets made.
The editorial work mattered more than the code. 1,282 images were sifted down to 24 — the ones that convey mud, weather, effort and a genuinely good weekend, rather than the ones that are technically the sharpest. A live countdown runs to the start line. Structured event data is embedded so search engines list it as the real event it is, with dates and a venue, instead of as a generic web page.
Sections run in decision order: what the grind is, the events, the workouts, the vibe, the gallery, FAQs, contact. A team captain can answer every objection their teammates will raise without opening a second tab.
Static HTML with a bespoke farmyard theme — no CMS, no framework, and zero JavaScript dependencies. The reveal-on-scroll, the sticky nav, the countdown and the gallery lightbox are all hand-written in one small file.
That is not minimalism for its own sake. The audience is on mobile data in rural Cornwall, where coverage is patchy and a heavy page simply doesn’t load. Images are served at two sizes, the hero is responsive, and there is nothing to block rendering.
flowchart LR
classDef extern fill:#fdfcfb,stroke:#c4873b,stroke-width:1.5px,color:#0a0f0f
classDef hub fill:#0a0f0f,stroke:#c4873b,stroke-width:1.5px,color:#fdfcfb
classDef out fill:#f3f2f1,stroke:#9a9a96,color:#0a0f0f
P["1,282 photos
from 2025"]:::extern
E["Event details,
pricing, logistics"]:::extern
S["Single static page
no dependencies"]:::hub
C["Countdown +
entry CTAs"]:::out
G["24-photo gallery
+ lightbox"]:::out
SEO["Structured event
data for search"]:::out
P --> S
E --> S
S --> C
S --> G
S --> SEO
Built for a phone on rural mobile data. Nothing loads that doesn’t need to.
Built as a free favour for CrossFit Onen, who run the event. Photography by @unearthedcreative_, credited in the gallery and the footer — the pictures are the reason the page works, and the credit stays.
Running an event? One good page beats a linktree and a dozen expired stories. We design, build and look after sites like this — see how that works →