NDTV 會針對網站體驗指標進行最佳化,藉此提升使用者體驗,進而提高留存率。
NDTV 是印度首屈一指的新聞電台和網站。根據網站體驗計畫,他們在一個月內就讓「最大內容繪製」(LCP) 這項最重要的使用者指標提升了 55%。這與跳出率降低 50% 有關。
55%
LCP 中的改善項目
50%
跳出率降低
突顯商機
由於每月的不重複使用者將近 2 億名,因此 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=1&hl=zh-tw)
影響程度
Web Vitals 提供團隊指標導向信號,因此能加快改善使用者體驗的程序。
在展開最佳化專案前,NDTV 團隊在 3.0 秒 (使用者第 75 個百分位數) 的基準資料基準測試自己的 LCP 分數 (根據 Chrome 使用者體驗報告欄位的資料)。經過最佳化專案之後,降到 1.6 秒。此外,他們也將累計版面配置位移 (CLS) 分數降至 0.05。WebPageTest 的其他指標 (例如「首次位元組時間」和「CDN」的有效使用) 已提升到 1 年級,
![0.05 CLS 分數。](https://web.dev/static/case-studies/ndtv/image/005-cls-score-63ecddcee9427.png?authuser=1&hl=zh-tw)
投資報酬率
儘管 ndtv.com 相當複雜且深度,但團隊一直以來都著重在效能和使用者體驗最佳做法上,此網站早已達到較低的 FID 和 CLS 分數。為了進一步改善使用者體驗,該團隊專注於 LCP,並在開始最佳化工作後的幾週內達到門檻。
整體業務成果
- 網站體驗核心指標經過最佳化之後,LCP 的 LCP 提升了 55%。
- 針對網站體驗核心指標進行最佳化後,網站的跳出率降低 50%,且有其他產品異動。
- 這麼做能直接提高內容的參與度和消費量,並按比例增加網站收益。
![LCP 提高 55%。跳出率降低 50%。提高參與度和消費量。](https://web.dev/static/case-studies/ndtv/image/55-improvement-lcp-50-bbfb39b0c8352.png?authuser=1&hl=zh-tw)
NDTV 長期遵循最佳做法,提供最優質的使用者體驗。我們目前將網站體驗指標評估視為產品開發過程中不可或缺的一環,而由於參與度提升,此指標也可達到良好的投資報酬率。
NDTV Group 技術與產品長 Kawaljit Singh Bedi
如需更多印度和東南亞的成功案例,請參閱「擴大網路規模個案研究」頁面。