Sustainable website design theme applied in less than 30 minutes
Website Brief
We’ve updated the website’s global template with a new primary colour palette to align with Navillus' "Sustainable Products" printed brochure for 2024. Each category now features eco§-friendly colours, managed through a mix of manual graphic updates and dynamic CSS variables. Given the success of the category colours, we need to investigate ways to improve the management of the colour palette, streamlining future updates.
Project Deliverables
Rework the Global Header Area
We introduced new graphics to the website that reflect the sustainable theme, creating cohesion with the printed brochure’s visual design. We addressed responsive issues with the 'ribbon' design for the header area which varied in height significantly. We hope to have settled on a balanced solution that aligns with the print design.
Update the Category Colours
In our last major production, we applied custom colours to relevant product categories using a method that managed the colours dynamically. This approach allowed us to update the product category hexadecimal values quickly, taking approximately 30 minutes. However, agreeing on the finer design details, especially colour matching, took about two weeks. After investigating Figma, a new collaborative website design tool, we used it to agree on an extensive 23-colour palette, ensuring consistency with the printed brochure.
Update the Primary Colours
Ironically, rebranding the rest of the global template styling took longer using traditional CSS styling methods. While styling variables seem like an obvious mechanism for managing global style changes, this would require an upgrade. This project served as a great use case for managing an extensive colour palette on a more granular level, potentially with light/dark versions for each category. This would extend the management to approximately 60 colours, offering greater design opportunities.
The Result
Consistent Branding
The website now closely reflects Navillus’ new printed brochure for 2024, ready for the start of shipping the printed version.
Performance Optimisation (Tech SEO)
Through ongoing progressive enhancements to the website, we aim to maintain or improve the current website performance. We are pleased to report that the PageSpeed score for print-gifts.com remains exceptionally high: 97 for mobile and 100 for desktop.
Conclusion
We often take for granted how rapidly technology progresses. Managing colours dynamically through the global template would require an upgrade to Bootstrap 5, but it would be a great progression for the category colour palette, which seems to be here to stay. This upgrade is on our development wish list!
SolvIt has proven to be a fantastic asset to our whole business and have not only aided a massive leap forward for our company's web profile, but also changed the way we view our company and helped us to thrive in a highly competitive industry.
SolvIt's business planning and forward thinking approach has proved impeccable and delivered over and above our expectations with the same enthusiasm as we have which in turn invigorated our whole strategy for web marketing.
Richard Sullivan
Business Owner
Related
Bridging the gap between print and web design with a fresh new look
Navillus Print Gifts required their website design to have a greater synergy with their printed brochure which is updated periodically, influenced by industry trends.
Does my website need a CMS to succeed?
If you’re anticipating your website to contribute to the growth of your business, then yes, absolutely!