Improve Core Web Vitals by Going Headless
A TravelBoom Marketing Case Study on Carmana Hotel & Suites
With Google continuing to emphasize the end user as a priority, digital marketers must find ways to improve the customer journey from start to finish. We’ve found that a key component to this strategy is to improve Core Web Vitals by going headless.
We explain what going headless means here, and now we’re taking it one step further by showcasing real results.
TravelBoom Marketing sought to improve overall digital performance for Carmana Hotel & Suites by going headless.
The result? An increase in key website performance metrics that matter.
Situation and Background
The Carmana Hotel & Suites website was underperforming due to a lack of technical optimization.
We determined a primary goal of improving Core Web Vitals – along with other digital performance metrics – through the redevelopment of the hotel’s website.
Secondary objectives included implementing proper eCommerce tracking, improving user friendliness and increasing rankings, which would put Carmana Hotel & Suites on the path to a boost in their bottom line.
Key Factors
- The new website would be headless in an effort to showcase immediate improvement in key performance metrics.
Read more about the evolution of Google hotel search results and why Core Web Vitals matter.
Our approach
TravelBoom redeveloped the Carmana Hotel & Suites website on a headless configuration in an effort to decouple, or remove, the CMS from the front end of a website, offering a content-first approach that utilizes an API to access and display content.
We were already aware of the advantages of a headless website, with overall performance at the top of the list. A headless design removes concerns of caching, database optimization and image optimization. More specifically, with a headless solution, the page isn’t actually changing or being reloaded, but instead, content is shifting, which translates to faster load times – aligning with our primary goal.
Carmana Hotel & Suite’s website was created using both NextJS + WordPress, with the CMS hosted on WPEngine and the front end hosted on Vercel.
Below are a few recommended best practices to ensure web vitals are healthy:
- Avoid chaining critical requests
- Keep request counts low and transfer sizes small
- Avoid large layout shifts
- Avoid long main-thread tasks
- Reduce JavaScript execution time
- Minimize main-thread work
Looking at Core Web Vitals Assessment field data on desktop pre and post-launch, we were able to immediately improve key Core Web Vitals metrics including:
Separately, we saw a 9 point increase in the overall performance score from 72 to 81, as well as a 0.2s improvement in Time to First Byte.
- First Contentful Paint
- 1.3s to 0
- Cumulative Layout Shift
- 0.09 to 0
Let's Get Started.
With TravelBoom, you get better data, customized insights, and our powerful digital and strategic hospitality marketing expertise.