Building the New Mutual Site
Discover how Mutual built their redesigned website using Craft CMS, Gatsby, and modern JAMstack technologies emphasizing speed and accessibility.
We've rebuilt madebymutual.com. The brief for ourselves was simple: fast, accessible, and a clearer view of what we actually do. Here's the stack.
Craft CMS
Craft 3.3 shipped GraphQL and Headless Mode, which made it a straightforward pick as the content layer for a JAMstack build. The authoring experience is still the best of any CMS we've used, and the GraphQL API lets us pull exactly the fields we need — homepage title and intro text, for example, without the rest of the entry coming along for the ride.
Craft Cloud and Craft 4 were announced shortly after we started, which settled any lingering questions about picking Craft for another decade.
Gatsby
Gatsby is the static site generator, with Craft as the data source. We picked it for a few reasons:
- Strong performance defaults out of the box
- Flexible data sourcing — Craft, plus anything else we want to pull in later
- Good DX, which tends to translate to faster iteration
It's React underneath, so pages are built from components — semantic, maintainable, and easy to share.
Theme UI
Theme UI handles the design system: tokens for colour, typography, and spacing in a single theme file. Consistent styling without stitching together a grab-bag of CSS approaches.
Netlify
Netlify hosts the built output. Webhooks fire on Craft content changes and Git pushes, so the site rebuilds and deploys on its own.
Results
Lighthouse scores came in strong across performance, accessibility, SEO, and best practices — which was the point.
