ב-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 ניתח אזורים אפשריים לשיפור באתר. רעיונות האופטימיזציה האלה, שהוגדרו באופן ברור, עזרו להם לתעדף מחדש משימות בעלות השפעה משמעותית, ולהשיג תוצאות מיידיות בשיפור של דוח המדדים הבסיסיים של חוויית המשתמש (Core Web Vitals). האופטימיזציות כלולות:
- מתן עדיפות לחסימת התוכן הגדולה ביותר על ידי השהיית בקשות של צד שלישי, כולל קריאות להצגת מודעות במיקומי מודעות בחלק הנגלל והטמעות ברשתות חברתיות, שנמצאות גם בחלק הנגלל.
- הגדלת השמירה במטמון של תוכן סטטי מכמה דקות ל-30 ימים.
-
שימוש ב-
font-display
כדי להציג טקסט מהר יותר בזמן הורדת הגופנים. - שימוש בגרפיקה וקטורית לסמלים במקום בגופנים מסוג TrueType (TTF).
- טעינה מדורגת ל-JavaScript ו-CSS: טעינת הדף עם ה-JS וה-CSS המינימליים האפשריים, ולאחר מכן טעינה מדורגת של שאר ה-JS וה-CSS במהלך גלילת הדף.
- קישור מראש למקורות שמספקים נכסים קריטיים.
![סיכום של האופטימיזציות: Largest Contentful Paint (LCP), שמירה במטמון, CSS, גרפיקה וקטורית, JS ו-CSS שנטען באופן מדורג, התחברות מראש.](https://web.dev/static/case-studies/ndtv/image/a-summary-the-optimizati-b938d496646d5.png?authuser=5&hl=he)
השפעה
דוח ה-Web Vitals סיפק לצוות אותות המבוססים על מדדים כדי לזרז את התהליך של שיפור חוויית המשתמש.
לפני שהתחילו את פרויקט האופטימיזציה, צוות NDTV בדק את ציון ה-LCP כ-3.0 שניות (לאחוזון ה-75 של המשתמשים, על סמך נתוני השטח של הדוח לגבי חוויית המשתמש ב-Chrome). אחרי פרויקט האופטימיזציה, משך הזמן ירד ל-1.6 שניות. בנוסף, הציון של ה-Cumulative Layout Shift (CLS) ירד ל-0.05. מדדים אחרים ב-WebPage Testing, כמו "First Byte Time" ו "שימוש יעיל ב-CDN", השתפרו והובילו לשיפור בציון A.
![ציון CLS של 0.05](https://web.dev/static/case-studies/ndtv/image/005-cls-score-63ecddcee9427.png?authuser=5&hl=he)
החזר על ההשקעה
למרות המורכבות והעומק של ndtv.com, האתר כבר קיבל ציוני FID ו-CLS סבירים, הודות להתמקדות הוותיקה של הצוות בשיטות המומלצות לביצועים ולחוויית המשתמש. כדי לשפר עוד יותר את חוויית המשתמש, הצוות התמקד ב-LCP והצליח לעמוד בדרישות הסף בתוך כמה שבועות מרגע שהתחיל את עבודת האופטימיזציה.
התוצאות הכוללות של העסק
- שיפור של 55% ב-LCP כתוצאה מאופטימיזציה למדדי הליבה לבדיקת חוויית המשתמש באתר.
- ירידה של 50% בשיעור העזיבה באתר אחרי ביצוע אופטימיזציה למדדי הליבה לבדיקת חוויית המשתמש באתר, יחד עם שינויים אחרים במוצרים.
- הגברת המעורבות והצריכה של תוכן באופן ישיר, והגדלת ההכנסות באופן יחסי מהאתר.
![שיפור של 55% ב-LCP. ירידה של 50% בשיעור העזיבה. מעורבות וצריכה מוגברת.](https://web.dev/static/case-studies/ndtv/image/55-improvement-lcp-50-bbfb39b0c8352.png?authuser=5&hl=he)
ב-NDTV פועלים כבר זמן רב לפי השיטות המומלצות כדי לספק חוויית משתמש באיכות הגבוהה ביותר. אנחנו מחשיבים את המדידה של Web Vitals כחלק בלתי נפרד מפיתוח המוצר שלנו כיום, והעלייה בהתעניינות שראינו הופך אותה להחזר טוב על ההשקעה.
קוואלג'יט סינג בדי, מנהל טכנולוגיה ומוצר, קבוצת NDTV
בדף Scale on Web המקרים לדוגמה תוכלו לקרוא על סיפורי הצלחה נוספים מהודו ומדרום-מזרח אסיה.