This content originally appeared on web.dev and was authored by Google Developers
NDTV is one of India's leading news stations and websites. By following the Web Vitals program, they improved one of their most important user metrics, Largest Contentful Paint (LCP), by 55% in just a month. This was correlated with a 50% reduction in bounce rates.
NDTV made other product changes while they optimized for Web Vitals so it is not possible to conclusively say that optimizing for Web Vitals was the only cause of the bounce rate reduction.
55%
Improvement in LCP
50%
Reduction in bounce rates
Highlighting the opportunity
With close to 200M unique users every month, it was critical for NDTV to optimize for quality of user experience. Although their engagement rates were well over industry average and the highest amongst their peers, the NDTV team still saw room for improvement and decided to invest in Web Vitals along with other product changes to further improve their engagement rates.
The approach they used
With the help of tools like PageSpeed Insights, web.dev/measure, and WebPageTest the NDTV team analyzed potential improvement areas on the site. These clearly defined optimization ideas helped them re-prioritize high-impact tasks and achieve immediate results in the improvement of Core Web Vitals. Optimizations included:
- Prioritizing the largest content block by delaying third-party requests, including ad calls for below-the-fold ad slots, and social network embeds, which are also below-the-fold.
- Increasing the caching of static content from a few minutes to 30 days.
-
Using
font-displayto display text sooner while fonts are downloaded. - Using vector graphics for icons instead of TrueType Fonts (TTF).
- Lazy loading JavaScript and CSS: loading the page with the minimum possible JS and CSS and then lazy loading the remaining JS and CSS on page scroll.
- Preconnecting to origins delivering critical assets.
Impact
Web Vitals equipped the team with metric-driven signals to expedite the process of improving user experience.
Before beginning the optimization project, the NDTV team benchmarked their LCP score at 3.0 seconds (for the 75th percentile of their users, based on Chrome User Experience Report field data). After the optimization project, it was down to 1.6 seconds. They also reduced their Cumulative Layout Shift (CLS) score to 0.05. Other metrics on WebPageTest like "First Byte Time" and "Effective use of CDN" improved to an A grade.
When optimizing your site, remember that it's important to not think of your metric scores as single values, but rather a distribution of field data values from real users. You'll want to make sure that the distribution overall is improving. See Web Performance: Leveraging The Metrics That Most Affect UX for more information.
Return on investment
Despite the complexity and depth of ndtv.com, the site was already achieving decent FID and CLS scores, thanks to the team's longstanding focus on performance and UX best practices. To further improve their user experience, the team focused on LCP and managed to meet the threshold within a few weeks of kicking off their optimization work.
Overall business results
- 55% improvement in LCP as a result of optimizing for Core Web Vitals.
- 50% reduction in bounce rate on the website after optimizing for Core Web Vitals, along with other product changes.
- Increased engagement and consumption of content directly, and proportionally increased revenue for their website.
NDTV has long followed best practices to deliver a top-quality user experience. We consider measuring Web Vitals to be an integral part of our product development now, and the engagement uplift we've seen makes it a good ROI.
Kawaljit Singh Bedi, Chief Technology and Product Officer, NDTV Group
Check out the Scale on web case studies page for more success stories from India and Southeast Asia.
This content originally appeared on web.dev and was authored by Google Developers
Google Developers | Sciencx (2020-10-27T00:00:00+00:00) NDTV achieved a 55% improvement in LCP by optimizing for Core Web Vitals. Retrieved from https://www.scien.cx/2020/10/27/ndtv-achieved-a-55-improvement-in-lcp-by-optimizing-for-core-web-vitals/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.