Note: This article was last updated on September 25, 2019 and may contain outdated information.
Mutual recently launched a redesigned website emphasizing speed, accessibility, and transparent showcase of agency services. The development utilized several modern tools and techniques.
Key Technologies
Craft CMS
The team selected Craft CMS as their content management system. Version 3.3’s GraphQL and Headless Mode capabilities integrate seamlessly with their JAMstack approach while maintaining excellent content authoring features.
GraphQL enables efficient data querying. As an example, “getting the title and introduction text for our homepage” demonstrates the targeted approach to fetching only necessary information.
The announcement of Craft Cloud and version 4 reinforced their confidence in long-term platform viability.
Gatsby
Gatsby was chosen as the static site generator, paired with Craft CMS as the data source. Key advantages include:
- “Awesome performance out of the box” with strong default optimization
- Flexible data sourcing capabilities
- Developer and user experience focus
Built on React, the framework enables componentized, semantic, and maintainable page structures.
Theme UI
“Theme UI is a great tool which helps to build themed web applications with ease.” Design tokens and customizable scales consolidate colors, typography, and layout styling into unified theme files for consistent UI development.
Netlify
Netlify hosts the static files generated during Gatsby builds. Webhook integration with Craft enables automatic site rebuilding and deployment when repository commits occur or content updates trigger.
Results
The site achieved high performance audit scores, including strong marks for accessibility, SEO, and best practices.