Web Vitals

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

Philip Walton

תאריך פרסום: 4 במאי 2020

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

סקירה כללית

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

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

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

Core Web Vitals

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

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

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

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

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

מחזור חיים

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

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

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

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

• LCP: יציבה
• CLS: יציבה
• INP: יציבה

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

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

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

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

בהמתנה

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

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

אורווה

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

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

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

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

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

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

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

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

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

הדרך הקלה ביותר למדוד את כל המדדים הבסיסיים של חוויית המשתמש היא להשתמש בספריית 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 כדי למדוד את נתוני מדדי הליבה לבדיקת חוויית המשתמש באתר ולשלוח אותם לנקודת קצה לניתוח נתונים, השלב הבא הוא לצבור את הנתונים האלה ולדווח עליהם כדי לראות אם הדפים עומדים בערכי הסף המומלצים ב-75% לפחות מהביקורים בדפים.

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

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

• מדידת LCP ב-JavaScript
• מדידת INP ב-JavaScript
• מדידת CLS ב-JavaScript

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

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

כל המדדים הבסיסיים של חוויית המשתמש הם קודם כול מדדים שאפשר למדוד בשטח, אבל אפשר למדוד רבים מהם גם ב-Labs.

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

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

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

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

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

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

• אופטימיזציה של LCP
• אופטימיזציה של INP
• אופטימיזציה של CLS

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

מדדי Web Vitals אחרים

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

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

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

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

שינויים במדדי Web Vitals

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

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

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

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