The Wonder Years
A storytelling site for a 10-year personal running challenge — running to one Wonder of the World per year. Same Spark-tier approach as The Great Year, dialled in for a decade-spanning narrative instead of a single year.
Brief
10 wonders · 10 years
A decade of running, ten wonders of the world
A personal project — the sequel to The Great Year. Where Great Year was about finishing in twelve months, The Wonder Years is about pacing across a decade: one Wonder of the World per year, on foot, between 2026 and 2035.
The brief was a follow-on from the Great Year challenge. I’d shown myself I could complete a year-long running goal; the next question was whether I could sustain one for ten. Ten Wonders, one per year, every one reached or circumnavigated on foot. The website is the live record-in-progress — updated each year as the next Wonder is ticked off.
The approach
Same Spark-tier philosophy as The Great Year — single-page, custom-built, image-led — but tuned for a different temporal shape. Where Great Year is a complete story (every Great Walk done, here’s the photo book), Wonder Years is a story unfolding in real time across a decade. The architecture had to support that: a layout that reads well early in the journey and will still read well once every Wonder’s been added.
Visually, a warmer palette than the Great Year — deep navy and cream against burnished gold, evoking the iconic-monument feel of the source material (the first hero shows the Taj Mahal). Same serif display face on the headline; same focus on photography over words.
What I built
- Decade-spanning single page — lean HTML/CSS/JS, deployed on Cloudflare edge. Same zero-framework approach as the Great Year for full design control and a sub-second first paint.
- Era-based progress sections — the decade broken into thirds (early, middle, late), with the current Wonder highlighted and future entries shown as upcoming placeholders. Updated annually.
- Animated stat counters — 10 Wonders, 10 Years, 400+ km total on foot — designed to tick over without site-rebuilds as the journey progresses.
- Per-Wonder modal galleries — same modal pattern as Great Year, so each completed Wonder has its own scrollable photo set, distance, elevation, terrain notes, and the story of how it went.
- Interactive world map showing the location of each Wonder, with completed entries activating as the years progress.
- Cross-link to the Great Year — the two sites reference each other as parts of one larger running story, so a visitor on either can navigate to the other.
- Long-haul performance: every asset lazy-loaded, all imagery served at modern formats, font-display: swap. The site loads cleanly today and won’t degrade as more photos get added over the decade.
The outcome
The site is now the live tracker for the decade-long challenge, updated as each Wonder is reached. As with The Great Year, it doubles as a working reference for clients considering a Spark-tier build — particularly anyone who wants a long-running personal site that won’t need a rebuild every few years to stay sharp.
What made this different
The Wonder Years had to be a site I’d still be happy maintaining in 2035. Most websites don’t have a ten-year horizon designed in from day one. This one does: simple enough to update with a single HTML edit each year, structured enough that adding nine more entries won’t break the rhythm.
Services
Strategy · Photography · Website Design & Development · Copywriting