Web Vitals

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

סקירה כללית

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

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

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

Core Web Vitals

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

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

המלצות הסף להצגת התוכן הכי גדול (LCP) המלצות לגבי הסף מאינטראקציה עד להצגת התוכן הבא המלצות סף לשינויים בפריסת הפריסה
  • LCP (המהירות שבה נטען רכיב התוכן הכי גדול): מדד של ביצועי הטעינה. כדי לספק חוויית משתמש טובה, נתוני ה-LCP צריכים להתרחש בתוך 2.5 שניות מהמועד שבו הדף נטען לראשונה.
  • Interaction to Next Paint (INP): מדידת אינטראקטיביות. כדי לספק חוויית משתמש טובה, ה-INP של הדפים צריך להיות עד 200 אלפיות השנייה.
  • Cumulative Layout Shift (CLS): מודדת יציבות חזותית. כדי לספק חוויית משתמש טובה, ה-CLS של הדפים צריך להיות 0.1 לכל היותר.

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

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

מחזור חיים

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

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

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

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

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

תכונה ניסיונית

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

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

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

בהמתנה

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

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

אורווה

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

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

כלים למדידה ולדיווח על מדדי ליבה לבדיקת חוויית המשתמש באתר

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

כלי שדה למדידת מדדי ליבה לבדיקת חוויית המשתמש באתר

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

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

מדידת מדדי הליבה לבדיקת חוויית המשתמש באתר ב-JavaScript

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

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

באמצעות ספריית אתרי אינטרנט, אפשר למדוד כל מדד על ידי קריאה לפונקציה יחידה (עיינו במסמכי התיעוד כדי לקבל מידע מלא על שימוש ופרטי 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);

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

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

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

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

התוסף הזה יכול לעזור לכם להבין את הביצועים של האתרים שלכם, של האתרים של המתחרים שלכם ושל האינטרנט באופן כללי.

  LCP INP CLS
קריאייטיבים באינטרנט
תוסף Web Vitals

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

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

כלי מעבדה למדידת מדדי ליבה לבדיקת חוויית המשתמש באתר

כל מדדי הליבה לבדיקת חוויית המשתמש באתר הם בראש ובראשונה מדדי שדה, אבל רבים מהם ניתנים למדידה גם בשיעור ה-Lab.

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

אפשר להשתמש בכלים הבאים כדי למדוד את מדדי הליבה לבדיקת חוויית המשתמש באתר בסביבת שיעור ה-Lab:

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

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

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

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

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

מדדי Web Vitals אחרים

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

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

לדוגמה, המדדים Time to First Byte (TTFB) ו-First Contentful Paint (FCP) הם שני היבטים חיוניים של חוויית הטעינה, ושניהם שימושיים לאבחון בעיות ב-LCP (זמני תגובה איטיים של השרת או משאבים לחסימת עיבוד, בהתאמה).

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

שינויים ב-Web Vitals

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

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

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

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