Web Vitals

פורסם: 4 במאי 2020, עדכון אחרון: 31 באוקטובר 2024

אופטימיזציה של חוויית המשתמש היא אחד הגורמים הכי חשובים לשימור ההצלחה של כל אתר ברשת לטווח הארוך. לא משנה אם אתם בעלי עסקים, משווקים או מפתחים, שימוש ב-Web Vitals יכול לעזור לכם לכמת מדדים שקשורים לחוויית המשתמש באתר ולזהות הזדמנויות לשפר אותה.

סקירה כללית

Web Vitals היא יוזמה של Google שמטרתה לספק הנחיות אחידות לגבי אותות איכות שחיוניים למתן חוויית משתמש מעולה באינטרנט.

במהלך השנים, Google סיפקה מספר כלים למדידה ולדיווח על ביצועים. יש מפתחים שהם מומחים בשימוש בכלים האלה, ויש מפתחים שמתקשים לעקוב אחרי כל הכלים והמדדים.

בעלי אתרים לא צריכים להיות מומחים לביצועים כדי להבין את איכות חוויית המשתמש שהם מספקים למשתמשים שלהם. המטרה של Web Vitals היא לפשט את התמונה ולעזור לאתרים להתמקד במדדים שהכי חשובים, Core Web Vitals.

Core Web Vitals

המדדים הבסיסיים של חוויית המשתמש (Core Web Vitals) הם קבוצת משנה של Web Vitals שרלוונטיים לכל דפי האינטרנט. כל בעלי האתרים צריכים למדוד אותם, והם יוצגו בכל הכלים של Google. כל אחד מהמדדים הבסיסיים של חוויית המשתמש מייצג היבט ייחודי של חוויית המשתמש. אפשר למדוד אותו בשטח, והוא משקף את התוצאות מנקודת המבט של הקוראים.

המדדים שמרכיבים את Core Web Vitals יתפתחו עם הזמן. הקבוצה הנוכחית מתמקדת ב-3 היבטים של חוויית המשתמש – טעינה, אינטראקטיביות ויציבות חזותית – וכוללת את המדדים הבאים (ואת ערכי הסף הרלוונטיים שלהם):

המלצות לגבי סף ה-Largest Contentful Paint ‏(LCP) המלצות לגבי סף מהירות התגובה לאינטראקציה באתר (INP) המלצות בנוגע לסף של מדד יציבות חזותית

כדי לוודא שביצועי האתר עונים על הציפיות של רוב המשתמשים ביחס למדדים האלה, ערך הסף המומלץ למדידה הוא האחוזון ה-75 של טעינות הדפים (כלומר, 75% מחוויות הטעינה צריכות לעמוד ביעד). כדאי לנתח את הנתונים האלה במחשבים ובמכשירים ניידים בנפרד.

בכלים שמעריכים את התאימות למדדי הליבה לבדיקת חוויית המשתמש באתר, דף נחשב כעומד בדרישות אם הוא עומד ביעדים המומלצים באחוזון ה-75 של כל שלושת המדדים של Core Web Vitals.

מחזור חיים

המדדים של Core Web Vitals עוברים מחזור חיים שכולל שלושה שלבים: ניסיוני, בהמתנה ויציב.

שלושת השלבים במחזור החיים של מדדי ה-Core Web Vitals, מוצגים כסדרה של שלושה חצים. משמאל לימין, השלבים הם ניסיוני, בהמתנה ויציב.
השלבים במחזור החיים של Core Web Vitals.

כל שלב נועד להראות למפתחים איך כדאי לחשוב על כל מדד:

  • מדדים ניסיוניים הם מדדים בסיסיים של חוויית המשתמש (Core Web Vitals) שעדיין נמצאים בשלבי פיתוח, ועשויים לעבור שינויים משמעותיים בהתאם לתוצאות הבדיקות ולמשוב מהקהילה.
  • מדדים בהמתנה הם מדדים עתידיים של Core Web Vitals שעברו את שלב הבדיקה והמשוב, ויש להם ציר זמן מוגדר היטב עד שהם יהפכו ליציבים.
  • מדדים יציבים הם קבוצת המדדים הנוכחית של Core Web Vitals שדפדפן Chrome מחשיב כחיוניים לחוויית משתמש מעולה.

מדדי הליבה לבדיקת חוויית המשתמש באתר נמצאים בשלבי מחזור החיים הבאים:

ניסיוני

כשמדד חדש מפותח ומוצג במערכת, הוא נחשב מדד ניסיוני.

המטרה של שלב הניסוי היא להעריך את מידת ההתאמה של מדד מסוים. קודם כל, צריך לבדוק את הבעיה שרוצים לפתור, ואולי לחזור על מה שמדדים קודמים לא הצליחו לפתור. לדוגמה, המדד מהירות התגובה לאינטראקציה באתר (INP) פותח בתחילה כמדד ניסיוני כדי לטפל בבעיות בביצועים בזמן הריצה שקיימות באינטרנט בצורה מקיפה יותר מאשר המדד מהירות התגובה לאינטראקציה ראשונה (FID).

שלב הניסויים במחזור החיים של Core Web Vitals נועד גם לספק גמישות בפיתוח מדד, על ידי זיהוי באגים ואפילו בחינת שינויים בהגדרה הראשונית שלו. זה גם השלב שבו המשוב מהקהילה הכי חשוב.

בהמתנה

כשהצוות של Chrome קובע שמדד ניסיוני קיבל מספיק משוב והוכיח את היעילות שלו, הוא הופך למדד בהמתנה. לדוגמה, בשנת 2023, המדד INP עבר מסטטוס ניסיוני לסטטוס בהמתנה, במטרה להוציא בסופו של דבר את המדד FID משימוש.

המדדים בהמתנה נשארים בשלב הזה למשך שישה חודשים לפחות, כדי לתת למערכת האקולוגית זמן להתאים את עצמה. משוב מהקהילה ממשיך להיות חשוב בשלב הזה, ככל שיותר מפתחים מתחילים להשתמש במדד.

אורווה

כשמדד מועמד של Core Web Vitals עובר לשלב הסופי, הוא הופך למדד יציב. בשלב הזה המדד יכול להפוך למדד Core Web Vitals.

יש תמיכה פעילה במדדים יציבים, והם עשויים להיות כפופים לתיקוני באגים ולשינויים בהגדרות. מדדים יציבים של Core Web Vitals לא ישתנו יותר מפעם אחת בשנה. כל שינוי במדד Core Web Vital יצוין באופן ברור במסמכים הרשמיים של המדד, וגם ביומן השינויים של המדד. מדדי Core Web Vitals נכללים גם בכל ההערכות.

כלים למדידה ולדיווח של Core Web Vitals

‫Google מאמינה שמדדי הליבה לבדיקת חוויית המשתמש באתר (Core Web Vitals) הם קריטיים לכל חוויית שימוש באינטרנט. לכן, היא מחויבת להציג את המדדים האלה בכל הכלים הפופולריים שלה. בקטעים הבאים מפורטים הכלים שתומכים במדדי הליבה לבדיקת חוויית המשתמש באתר.

כלים למדידת Core Web Vitals

בדוח לגבי חוויית המשתמש ב-Chrome נאספים נתונים אנונימיים של מדידות על משתמשים בפועל לגבי כל אחד ממדדי ה-CWV. הנתונים האלה מאפשרים לבעלי אתרים להעריך במהירות את הביצועים של האתר שלהם בלי להטמיע באופן ידני כלי ניתוח בדפים, והם משמשים כבסיס לכלים כמו כלי הפיתוח ל-Chrome,‏ PageSpeed Insights והדוח Core Web Vitals ב-Search Console.

הנתונים שמוצגים בדוח לגבי חוויית המשתמש ב-Chrome מאפשרים להעריך במהירות את הביצועים של אתרים, אבל הם לא כוללים את נתוני הטלמטריה המפורטים לגבי כל צפייה בדף, שנדרשים בדרך כלל כדי לאבחן בעיות, לעקוב אחרי שינויים ולהגיב במהירות לבעיות רגרסיה. לכן, אנחנו ממליצים מאוד לאתרים להגדיר מעקב משלהם אחרי משתמשים אמיתיים.

מדידת Core Web Vitals ב-JavaScript

אפשר למדוד כל אחד מהמדדים של Core Web Vitals ב-JavaScript באמצעות ממשקי API רגילים לאינטרנט.

הדרך הכי קלה למדוד את כל ה-Core Web Vitals היא באמצעות ספריית JavaScript‏ web-vitals. זוהי עטיפה קטנה ומוכנה לייצור של ממשקי ה-API הבסיסיים לאינטרנט, שמודדת כל מדד באופן שתואם במדויק לדיווח של כל הכלים של Google שצוינו קודם.

כדי למדוד כל מדד באמצעות הספרייה web-vitals, צריך להפעיל פונקציה אחת. אפשר לעיין בתיעוד כדי לקבל פרטים מלאים על השימוש ועל ה-API.

import {onCLS, onINP, onLCP} from 'web-vitals';

function sendToAnalytics(metric) {
  const body = JSON.stringify(metric);
  // Use `navigator.sendBeacon()` if available, falling back to `fetch()`.
  (navigator.sendBeacon && navigator.sendBeacon('/analytics', body)) ||
    fetch('/analytics', {body, method: 'POST', keepalive: true});
}

onCLS(sendToAnalytics);
onINP(sendToAnalytics);
onLCP(sendToAnalytics);

אחרי שמגדירים באתר את השימוש בספרייה web-vitals כדי למדוד ולשלוח את נתוני Core Web Vitals לנקודת קצה של ניתוח נתונים, השלב הבא הוא לצבור את הנתונים ולדווח עליהם כדי לבדוק אם הדפים עומדים בערכי הסף המומלצים לפחות ב-75% מהביקורים בדפים.

חלק מספקי ניתוח הנתונים כוללים תמיכה מובנית במדדי Core Web Vitals, אבל גם אם אין תמיכה כזו, הם אמורים לכלול תכונות בסיסיות של מדדים מותאמים אישית שמאפשרות לכם למדוד את מדדי Core Web Vitals בכלי שלהם.

מפתחים שמעדיפים למדוד את המדדים האלה ישירות באמצעות ממשקי ה-API הבסיסיים של האינטרנט יכולים במקום זאת להשתמש במדריכי המדדים האלה כדי לקבל פרטים על ההטמעה:

הנחיות נוספות למדידת המדדים האלה באמצעות שירותי ניתוח נתונים פופולריים או כלים פנימיים לניתוח נתונים מפורטות במאמר שיטות מומלצות למדידת Web Vitals בשטח.

כלי מעבדה למדידת Core Web Vitals

כל מדדי ה-Core Web Vitals הם קודם כל מדדים של נתוני שטח, אבל אפשר למדוד רבים מהם גם במעבדה.

מדידה במעבדה היא הדרך הכי טובה לבדוק את הביצועים של תכונות במהלך הפיתוח – לפני שהן מושקות למשתמשים. זו גם הדרך הכי טובה לזהות בעיות רגרסיה בביצועים לפני שהן מתרחשות.

אפשר להשתמש בכלים הבאים כדי למדוד את Core Web Vitals בסביבת מעבדה:

  LCP INP CLS
כלי פיתוח ל-Chrome
Lighthouse (במקום זאת אפשר להשתמש ב-TBT)

מדידה במעבדה היא חלק חשוב ביצירת חוויות נהדרות, אבל היא לא תחליף למדידה בשטח.

הביצועים של אתר יכולים להשתנות באופן משמעותי בהתאם ליכולות המכשיר של המשתמש, לתנאי הרשת, לתהליכים אחרים שעשויים לפעול במכשיר ולאופן האינטראקציה של המשתמש עם הדף. למעשה, האינטראקציה של המשתמשים יכולה להשפיע על הציון של כל אחד ממדדי Core Web Vitals. רק מדידה בשטח יכולה לתת תמונה מלאה ומדויקת.

המלצות לשיפור הציונים

במדריכים הבאים מפורטות המלצות ספציפיות לאופטימיזציה של הדפים לכל אחד ממדדי ה-Core Web Vitals:

יש הרבה דרכים לשפר את מדדי ה-Core Web Vitals, ולכל גישה יש רמות שונות של השפעה, רלוונטיות וקלות שימוש בכל מצב. במאמר השיטות הכי יעילות לשפר את מדדי ה-Core Web Vitals מופיעה רשימה קצרה של ההמלצות המובילות של צוות Chrome.

מדדים אחרים של Web Vitals

בעוד שה-Core Web Vitals הם המדדים החשובים ביותר להבנה ולשיפור של חוויית משתמש נהדרת, יש גם מדדים תומכים אחרים.

המדדים האחרים האלה יכולים לשמש כקירוב – או כמדדים משלימים לשלושת מדדי הליבה לבדיקת חוויית המשתמש באתר – כדי לעזור לכם להבין חלק גדול יותר מהחוויה או לאבחן בעיה ספציפית.

לדוגמה, המדדים הזמן עד לבייט הראשון (TTFB) והצגת תוכן ראשוני (FCP) הם שני היבטים חשובים של חוויית הטעינה, ושניהם שימושיים לאבחון בעיות שקשורות ל-LCP (זמני תגובה איטיים של השרת או משאבים שחוסמים את הרינדור, בהתאמה).

באופן דומה, מדד כמו זמן החסימה הכולל (TBT) הוא מדד מעבדה שחשוב לזיהוי ולאבחון של בעיות פוטנציאליות באינטראקטיביות שיכולות להשפיע על מדד INP. עם זאת, הם לא נכללים ב-Core Web Vitals כי אי אפשר למדוד אותם בשטח, והם לא משקפים תוצאה שמתמקדת במשתמש.

שינויים ב-Web Vitals

Web Vitals ו-Core Web Vitals מייצגים את האותות הטובים ביותר שזמינים היום למפתחים למדידת איכות חוויית המשתמש באינטרנט, אבל האותות האלה לא מושלמים, וצפויים שיפורים או תוספות בעתיד.

Core Web Vitals רלוונטיים לכל דפי האינטרנט ומוצגים בכל הכלים הרלוונטיים של Google. לשינויים במדדים האלה תהיה השפעה רחבה. לכן, מפתחים צריכים לצפות שההגדרות והערכים של Core Web Vitals יהיו יציבים, ושהעדכונים יתבצעו במחזור שנתי צפוי, עם הודעה מוקדמת.

מדדים אחרים של Web Vitals הם לרוב ספציפיים להקשר או לכלי, ועשויים להיות ניסיוניים יותר מ-Core Web Vitals. לכן, ההגדרות והערכים שלהם עשויים להשתנות בתדירות גבוהה יותר.

כל השינויים ב-Web Vitals יתועדו בבירור בCHANGELOG הזה שזמין לכולם.