Case giftcards.co.uk
Good URLs on desktop
0%
94%
Cumulative Layout Shift (CLS)
45%
78%
Average response time (crawl request)
478ms
288ms
Optimising Performance and User Experience for giftcards.co.uk
Cadeau Concepten, a leading gift card provider, sought to create a seamless, user-friendly online platform for their english customers. To achieve this goal, they decided to switch from a traditional Multi-Page Application (MPA) to a more dynamic Single-Page Application (SPA), utilising a JavaScript framework. While SPAs offer numerous benefits, such as faster navigation and a more fluid user experience, they also introduce unique challenges when it comes to performance optimisation.
Recognising the need for expertise in development, design, and performance optimisation, Cadeau Concepten collaborated with Touchtribe, Resoluut, Soda studio NL, and Iron/Out. Together, these teams were tasked with creating a visually stunning website that not only showcased Cadeau Concepten's wide range of gift cards but also ensured a smooth user experience by addressing any performance bottlenecks inherent to SPAs.
Challenge:
The primary challenge was to create a visually stunning website that not only showcased Cadeau Concepten’s wide range of gift cards but also ensured a smooth user experience by addressing any performance bottlenecks.
Solution:
Our team at Iron/Out, together with Touchtribe, Resoluut and Soda studio NL, tackled the challenge head-on. Touchtribe's development expertise ensured the website's functionality was top-notch, while Soda studio NL & Resoluut created an eye-catching design that captured the essence of the Gift Cards brand.
Iron/Out focused on performance optimisation by closely monitoring the website's performance throughout its development. We identified bottlenecks and suggested solutions to address them, working closely with the development team to integrate these improvements into the platform. This collaborative approach ensured that the website's performance was optimised for speed and user experience.
Our Approach: A Three-Phase Process for Web Performance Optimisation
To ensure a streamlined, efficient process, our approach to optimising the platform was broken down into three distinct phases: Sprint Preparation, the Sprint itself, and Sprint Evaluation. This structured methodology allowed for clear communication, effective collaboration, and a targeted focus on addressing performance issues.
Sprint Preparation:
During this initial phase, our team at Iron/Out conducted a thorough assessment of the pages built by the development team to identify any bottlenecks or issues that could potentially impact user experience. We compiled our findings in a comprehensive performance guide, which served as a reference for the project. This guide provided valuable input for defining a roadmap and outlining user stories that would be addressed during the Sprint phase.Sprint:
With a clear roadmap and user stories in place, our team collaborated closely with the development team at Touchtribe to implement the necessary performance improvements. By working hand-in-hand with the developers, we were able to provide guidance and support in addressing the identified performance issues one by one. This close collaboration not only allowed for efficient problem-solving but also helped to build a strong working relationship between our teams, ensuring seamless integration of the performance optimisations into the platform.Sprint Evaluation:
Once the Sprint phase was complete, our team conducted a thorough evaluation to assess the impact of the implemented solutions. We tested the website's performance, analysing the improvements made, and identifying any further opportunities for optimisation. By continuously refining our approach and addressing any remaining issues, we ensured that Cadeau Concepten's website was fully optimised for speed and user experience.
This structured, three-phase approach to performance optimisation allowed our team at Iron/Out to work effectively with Touchtribe and Soda studio NL, creating a high-performing, visually stunning website that exceeded Cadeau Concepten's expectations. Through diligent preparation, hands-on collaboration, and ongoing evaluation, we were able to deliver an exceptional online platform for our client and their customers.
Some of the key strategies we employed included:
Getting involved at the design stage to discuss performance impact on design decisions
Analysing key pages during development on several devices
Utilising performance standards and challenging the team to use browser standards instead of modules.
Conducting regular performance audits and addressing issues as they arose.
Results:
The combined efforts of Iron/Out, Touchtribe, Resoluut and Soda studio NL resulted in a visually stunning, high-performing website that made it easier than ever for customers to find and purchase the perfect gift card for any occasion. Some key results included:
Reduced page load times, leading to improved user experience and increased customer satisfaction.
Passing Core Web Vitals assessment right after launching the platform.
Enhanced website performance across various devices and platforms, ensuring accessibility for all users.
Reduced Average response time (crawl request) by almost 40%
Website Launch and Ongoing Work on Interaction to Next Paint (INP) Metric:
One area where we are currently focusing our efforts is the Interaction to Next Paint (INP) metric. This metric measures the time it takes for a user's interaction with the site to trigger a visual response, such as clicking a button, tapping a touchscreen or typing on the keyboard. A lower INP value indicates a more responsive and engaging user experience.
Since the website's launch, several third-party software applications have been introduced, which can potentially impact the site's performance and INP metric. To ensure the continued optimisation of Cadeau Concepten's website, our team is proactively monitoring and addressing any issues related to the integration of these third-party applications.
Our ongoing efforts include:
Identifying and assessing the impact of third-party software on the website's INP metric.
Collaborating with the development team to optimise the integration of third-party scripts, minimising their impact on site performance.
Implementing performance monitoring tools to provide real-time data and insights into the website's INP metric, enabling quick detection and resolution of any issues.
Conclusion:
Iron/Out collaborated closely with our MakerStreet partners, TouchTribe, Resoluut, and Soda studio NL, throughout the design and development process to deliver outstanding results. Together we created an optimised, visually appealing website that met Cadeau Concepten's needs. By identifying performance bottlenecks and providing solutions to address them, we ensured a seamless user experience that sets a new standard for online gift card shopping. Visit https://www.giftcards.co.uk/ to experience the exceptional performance of Cadeau Concepten's website for yourself!