Primrose Schools Website
Project Overview
Primrose Schools, a leader in early education and care, needed a modernized, scalable digital presence that would reflect their premium brand and support both national and local marketing efforts. Their legacy site was limiting performance, flexibility, and scalability goals.
I worked with a small team of developers to build the redesigned site using a headless WordPress architecture with a Next.js frontend, delivering a fast, SEO-optimized, and easily maintainable site while empowering the marketing team with an intuitive content management system.
My Contributions
Headless WordPress Setup
-
Custom ACF Blocks: Created flexible, reusable block components.
-
GraphQL API: Used Apollo GraphQL to expose structured content for Next.js to consume.
-
Authentication & Permissions: Customized WordPress user roles to ensure editorial workflows remained secure and streamlined.
Next.js Frontend
-
Static Site Generation (SSG) with Incremental Static Regeneration (ISR) for optimal performance and content freshness.
-
Server-Side Rendering (SSR) for dynamic sections like school locators and event listings.
-
Custom Components: Built a fully responsive component library with Tailwind CSS.
-
Optimized Images: Leveraged Next.js’ built-in Image component for automatic resizing, lazy loading, and format optimization.
-
Accessibility (a11y): Ensured all components met WCAG 2.1 AA standards.
Performance Enhancements
-
Caching Strategy: Deployed strategic caching using Cloudflare and optimized API requests.
-
SEO Best Practices: Dynamic meta tags, schema markup, and Open Graph integration via Next.js Head API.
-
Analytics Integration: Implemented Google Tag Manager and custom event tracking.
Results
Building a headless architecture empowered Primrose Schools with a flexible, lightning-fast website without sacrificing the powerful editorial experience of WordPress. This project demonstrated the importance of balancing content management ease with frontend performance and design integrity.