NDTV улучшило взаимодействие с пользователем и, следовательно, удержало его за счет оптимизации для Web Vitals.
NDTV — одна из ведущих новостных станций и веб-сайтов Индии. Следуя программе Web Vitals , они улучшили один из своих самых важных пользовательских показателей — Largest Contentful Paint (LCP) — на 55 % всего за месяц. Это коррелировало со снижением показателя отказов на 50%.
55 %
Улучшение в LCP
50 %
Снижение показателя отказов
Подчеркивая возможность
Учитывая, что каждый месяц у NDTV около 200 миллионов уникальных пользователей, для NDTV было крайне важно оптимизировать качество пользовательского опыта. Хотя их уровень вовлеченности значительно превышал средний показатель по отрасли и был самым высоким среди аналогов, команда NDTV все же видела возможности для улучшения и решила инвестировать в Web Vitals наряду с другими изменениями в продуктах, чтобы еще больше повысить уровень вовлеченности.
Подход, который они использовали
С помощью таких инструментов, как PageSpeed Insights , web.dev/measure и WebPageTest , команда NDTV проанализировала потенциальные области улучшения сайта. Эти четко сформулированные идеи по оптимизации помогли им по-новому расставить приоритеты высокоэффективных задач и добиться немедленных результатов в улучшении основных веб-показателей. Оптимизации включали:
- Приоритизация крупнейшего блока контента путем задержки сторонних запросов , в том числе вызовов объявлений для рекламных мест в нижней части экрана и встраивания в социальные сети, которые также находятся в нижней части экрана.
- Увеличение срока кэширования статического контента с нескольких минут до 30 дней.
- Использование
font-display
для более быстрого отображения текста во время загрузки шрифтов. - Использование векторной графики для значков вместо шрифтов TrueType (TTF).
- Ленивая загрузка JavaScript и CSS : загрузка страницы с минимально возможным количеством JS и CSS, а затем ленивая загрузка оставшихся JS и CSS при прокрутке страницы.
- Предварительное подключение к источникам доставки критически важных ресурсов.
![Краткое описание оптимизаций: самая большая отрисовка контента, кеширование, CSS, векторная графика, ленивая загрузка JS и CSS, предварительное подключение.](https://web.dev/static/case-studies/ndtv/image/a-summary-the-optimizati-b938d496646d5.png?authuser=5&hl=ru)
Влияние
Web Vitals снабдила команду сигналами на основе показателей, чтобы ускорить процесс улучшения пользовательского опыта.
Прежде чем приступить к проекту оптимизации, команда NDTV оценила свой показатель LCP на уровне 3,0 секунды (для 75-го процентиля своих пользователей, на основе полевых данных отчета об опыте пользователей Chrome ). После проекта оптимизации оно снизилось до 1,6 секунды. Они также снизили свой показатель совокупного сдвига макета (CLS) до 0,05. Другие показатели WebPageTest, такие как « Время первого байта » и «Эффективное использование CDN », улучшились до оценки A.
![0,05 балла по CLS.](https://web.dev/static/case-studies/ndtv/image/005-cls-score-63ecddcee9427.png?authuser=5&hl=ru)
Прибыль на инвестиции
Несмотря на сложность и глубину ndtv.com , сайт уже достиг приличных оценок FID и CLS благодаря давнему вниманию команды к производительности и лучшим практикам UX. Чтобы еще больше улучшить взаимодействие с пользователем, команда сосредоточилась на LCP и сумела достичь порогового значения в течение нескольких недель после начала работы по оптимизации.
Общие результаты бизнеса
- Улучшение LCP на 55 % в результате оптимизации для Core Web Vitals.
- Снижение показателя отказов на 50 % на веб-сайте после оптимизации для Core Web Vitals, а также других изменений продукта.
- Увеличение вовлеченности и потребления контента напрямую, а также пропорциональное увеличение доходов их веб-сайта.
![Улучшение LCP на 55%. Снижение показателя отказов на 50%. Увеличение вовлеченности и потребления.](https://web.dev/static/case-studies/ndtv/image/55-improvement-lcp-50-bbfb39b0c8352.png?authuser=5&hl=ru)
NDTV уже давно следует лучшим практикам, чтобы обеспечить высочайшее качество обслуживания пользователей. Сейчас мы считаем, что измерение веб-показателей является неотъемлемой частью разработки наших продуктов, и наблюдаемый нами рост вовлеченности делает это хорошей рентабельностью инвестиций.
Кавалджит Сингх Беди, директор по технологиям и продуктам, NDTV Group
Посетите страницу масштаба онлайн-кейсов, чтобы узнать больше историй успеха из Индии и Юго-Восточной Азии.