A NDTV aprimorou a experiência do usuário e, assim, a retenção, otimizando para as Métricas da Web.
A NDTV é uma das principais estações de notícias e sites da Índia. Ao seguir o programa Web vitals, a equipe melhorou uma das métricas de usuário mais importantes, a Maior exibição de conteúdo (LCP, na sigla em inglês), em 55% em apenas um mês. Isso está relacionado a uma redução de 50% nas taxas de rejeição.
55%
de melhoria na LCP
50%
de redução nas taxas de rejeição
Destaque a oportunidade
Com cerca de 200 milhões de usuários únicos a cada mês, era fundamental que o NDTV otimizasse a qualidade da experiência do usuário. Embora as taxas de engajamento estivessem bem acima da média do setor e as mais altas entre os concorrentes, a equipe de NDTV ainda viu espaço para melhorias e decidiu investir no Web vitals junto com outras mudanças no produto para melhorar ainda mais as taxas de engajamento.
A abordagem usada
Com a ajuda de ferramentas como PageSpeed Insights, web.dev/measure e WebPageTest, a equipe de NDTV analisou possíveis áreas de melhoria no site. Essas ideias de otimização claramente definidas ajudaram a mudar a prioridade de tarefas de alto impacto e alcançar resultados imediatos na melhoria das Core Web Vitals. Otimizações incluídas:
- Priorizar o maior bloco de conteúdo com solicitações de terceiros atrasadas, incluindo chamadas de espaços de anúncio abaixo da dobra e incorporações de redes sociais, que também estão abaixo da dobra.
- Aumente o armazenamento em cache do conteúdo estático de alguns minutos para 30 dias.
-
Usar
font-display
para mostrar texto mais rapidamente durante o download de fontes. - Uso de gráficos vetoriais para ícones em vez de TrueType Fonts (TTF).
- Carregamento lento JavaScript e CSS: carregar a página com o mínimo de JS e CSS possível e, em seguida, carregar lentamente o JS e CSS restantes na rolagem da página.
- Pré-conexão às origens que entregam recursos essenciais.
![Um resumo das otimizações: Maior exibição de conteúdo, armazenamento em cache, CSS, gráficos vetoriais, JS e CSS com carregamento lento e pré-conexão.](https://web.dev/static/case-studies/ndtv/image/a-summary-the-optimizati-b938d496646d5.png?authuser=5&hl=pt)
Impacto
As Métricas da Web deram à equipe indicadores orientados por métricas para acelerar o processo de melhoria da experiência do usuário.
Antes de iniciar o projeto de otimização, a equipe de NDTV comparou a pontuação de LCP em 3,0 segundos (para o 75o percentil dos usuários, com base nos dados de campo do Chrome User Experience Report). Depois do projeto de otimização, o tempo foi de 1,6 segundo. Ela também reduziu a pontuação da Mudança de layout cumulativa (CLS, na sigla em inglês) para 0,05. Outras métricas no WebPageTest, como "Tempo de primeiro byte" e "Uso eficaz da CDN", melhoraram para uma nota A.
![Pontuação de CLS de 0,05.](https://web.dev/static/case-studies/ndtv/image/005-cls-score-63ecddcee9427.png?authuser=5&hl=pt)
de retorno do investimento
Apesar da complexidade e profundidade do ndtv.com, o site já estava alcançando pontuações razoáveis de FID e CLS, graças ao foco de longa data da equipe em práticas recomendadas de desempenho e UX. Para melhorar ainda mais a experiência do usuário, a equipe se concentrou na LCP e conseguiu atingir o limite algumas semanas após iniciar o trabalho de otimização.
Resultados gerais dos negócios
- 55% de melhoria na LCP como resultado da otimização para as Core Web Vitals.
- 50% de redução na taxa de rejeição no site após a otimização para as Core Web Vitals, além de outras mudanças no produto.
- Aumentou o engajamento e o consumo de conteúdo de maneira direta e, de modo proporcional, aumentou a receita do site.
![55% de melhoria na LCP. 50% de redução na taxa de rejeição. Maior engajamento e consumo.](https://web.dev/static/case-studies/ndtv/image/55-improvement-lcp-50-bbfb39b0c8352.png?authuser=5&hl=pt)
A NDTV segue as práticas recomendadas há muito tempo para oferecer uma experiência do usuário de alta qualidade. Consideramos medir as Métricas da Web como parte integrante do desenvolvimento do nosso produto, e o aumento no engajamento que observamos torna isso um bom ROI.
Kawaljit Singh Bedi, diretor de tecnologia e produtos do NDTV Group
Confira a página Estudos de caso da escala na Web para mais histórias de sucesso da Índia e do Sudeste Asiático.