The Brief
Once again I partnered with LEAP to deliver a refreshed, lightweight WordPress website for their long-standing client, Capitals Coalition.
Working closely with the design team, we needed to deliver a fresh update to the visuals alongside a brand new custom CMS build. All within a reasonably tight, fixed budget.
With a build schedule of just two weeks, the website had to come together quickly and efficiently to meet with the client’s marketing targets.
As part of the project I provided:
- Technical guidance on the build, and review of designs to know what was feasible with the budget
- A lower-carbon custom WordPress website build with flexible content
- Inclusive cross-browser testing
A scroll animated page divider allows Capitals to split content and colour patterns in an engaging manner
The Outcome
The new Capitals Coalition website is considerably lighter than its predecessor. Where the website was previously loading around 2.4Mb, the new website now loads on average around 500Kb.
Not only is the website lighter, but it is also simpler and easier to use. Content editing is now via a series of custom blocks, rather than via a Gutenberg driven system, that the client had struggled to understand. Sometimes not knowing how their content may appear, putting them off from publishing.
With the new system in place, content editing is simple and quick to do. Enabling more important work to be shared.
Content-driven areas each have their own unique layouts and interactions based on their content types
Light touch CSS-driven animation
Leap wanted to liven the website up with some animations. Though keen to also keep things lightweight.
With the more recent changes to CSS driven animation on the web, the opportunity arose to make use of some of these newer techniques. In certain applications needing to be coupled with a sprinkling of JavaScript.
With these in place, the website comes alive more than it would have as a purely ‘static’ build.
Subtle animation help to enliven the UI as you scroll down the website
Content blocks for differing use cases
For the Capitals site it was important that they had an array of content options available to them. This was to control layout as well as to fit different types of content, or length of text. With a blend of information-rich pages and long-form resources, the content blocks had to be designed and built to work for that variety.
A mix of column layouts, media options and text styles helps to keep the content flowing. With visual interest as you scroll to engage with the content.
Conclusion
With such a tight budget and timescale, I’m proud of the results that LEAP and I were able to achieve together. It’s not always easy to do, especially with those types of restrictions.
The final result is fast, much lighter than it’s predecessor and ready for a future phase of work to expand on the content offering the Capital’s team would like to achieve.
* via renewable power matching purchase agreements. Find out more.