Core Web Vitals (کور وب وایتال) مجموعهای از معیارهای استاندارد شده توسط Google هستند که کمک می کنند تا توسعهدهندگان، تجربه کاربران در یک صفحه وب را درک کنند. در حالی که کور وب وایتال (Core Web Vitals) برای توسعه دهندگان ایجاد شده اما می تواند توسط همه مدیران وب سایت ها مورد استفاده قرار گیرد زیرا تجربه واقعی کاربر در یک صفحه را تجزیه و تحلیل می کند.
کور وب وایتال (Core Web Vitals) معیاری را برای سه حوزه اصلی تجربه کاربر (User Experience) تعریف کرده است، از جمله:
- نحوه لود صفحه (Loading)
- سهولت تعامل (Interactivity)
- ثبات بصری یک صفحه از دیدگاه کاربر (Visual Stability)
هر یک از این معیارهای کور وب وایتال، دیدگاه خاص خود را در مورد عناصر مختلف ارائه می دهند که بر نحوه تعامل و ارتباط کاربران با یک وب سایت تأثیر می گذارند. در حالی که توسعهدهندگان باید «تجربه کاربر UX» را به صورت کلی در نظر بگیرند، این معیارهای مستقل در تجزیه متغیرهای مختلف به قطعات کوچکتر کمک میکنند تا صاحبان سایت بتوانند مشکلات فنی را در وبسایت خود شناسایی و برطرف نمایند.
مهم است به خاطر داشته باشید که این معیارها کل داستان تجربه کاربر (User Experience) در یک وب سایت را بیان نمی کنند اما ترکیب آنها با یکدیگر می تواند به توسعه دهندگان کمک کند تا به روشی کارآمد و علمی، عیب یابی را انجام دهند.
در ادامه سه معیار اصلی موجود در Core Web Vitals برای بهبود وبسایتهای امروزی بررسی شده است.
1. لود بزرگترین عنصر محتوایی Largest Contentful Paint (LCP)
Largest Contentful Paint یکی از معیارهای اصلی وب وایتال (Web Vitals) است که صاحبان سایت می توانند از آن برای ارزیابی تجربه کاربر استفاده کنند. Largest Contentful Paint مدت زمان لود بزرگترین عنصر محتوایی است که از زمان درخواست URL (آدرس سایت) توسط کاربر تا نمایش آن در صفحه طول می کشد.
صاحبان سایت به صفحاتی در سایت خود نیاز دارند که سریع بارگذاری شوند تا تجربه کاربری (User Experience) لذت بخشی ایجاد کنند. سرعت بالا در زمان بارگذاری نه تنها یک عامل حیاتی برای تجربه کاربری مثبت محسوب می شود بلکه موجب کسب رتبه بالاتری در گوگل خواهد شد. علاوه بر آن، بارگذاری سریع بر میزان تعامل و نرخ تبدیل تأثیر خوبی میگذارد.
تصویر(1)
معیار LCP از کور وب وایتال چه چیزی را اندازه گیری می کند؟
LCP زمان دانلود بلوک های محتوای مختلف را از دید کاربر (با توجه به صفحه نمایش فعلی) اندازه گیری می کند. این معیار صرفا به شما میگوید که بخشهای مختلف محتوا از جمله مواردی که در ادامه ذکر شده اند با چه سرعتی در صفحه ای از سایت که کاربر آن را مشاهده می کند (نه مطالبی که کاربر برای دیدن آنها باید اسکرول کند)، لود می شوند.
- تصاویر
- تصاویر پیش نمایش ویدیو
- تصاویر پس زمینه
- بلوک های متنی
بهتر است مدیران سایت ها لود بزرگترین عنصر محتوایی LCP را با زمان 2.5 ثانیه پس از شروع بارگذاری صفحه، هدف قرار دهند.
2. تغییر چیدمان تجمعی Cumulative Layout Shift (CLS)
صاحبان سایت باید تعامل با لینک ها و دکمه های یک سایت را تا حد امکان آسان کنند تا فروش و conversion (نرخ تبدیل) را افزایش دهند. CLS (تغییر چیدمان تجمعی) معیاری از کور وب وایتال (Core Web Vitals) است که لینک ها یا دکمههایی که به صورت غیر منتظره پس از لود یک صفحه وب جابهجا میشوند را شناسایی میکند و مشکلات کاربران هنگام تلاش برای تعامل با عناصر در سایت شما پس از رندر شدن صفحه را نشان می دهد.
UX و طراحی، اجزای حیاتی یک تجربه کاربری خوب هستند و اگر صفحه وب، عناصر را در حین مطالعه تغییر دهد، کاربر ناامید خواهد شد. CLS به توسعه دهندگان کمک می کند تا مشخص کنند که آیا تصاویر یا لینک ها در صفحه جابجا می شوند یا خیر. سپس مدیران سایت می توانند بر اساس آن، نرخ کلیک (CTR) را افزایش داده و قابلیت استفاده و فروش آنلاین را بهبود ببخشند.
تصویر(2)
CLS چه چیزی را اندازه گیری می کند؟
CLS (چیدمان عناصر تجمعی) مشخص می کند که آیا عناصر در نمای قابل رویت، از موقعیت اولیه خود بین دو فریم رندر شده جابجا می شوند یا خیر. به زبان ساده، این معیار از کور وب وایتال (Core Web Vitals) به مدیران سایت کمک می کند تا بفهمند که آیا محتوایی مانند متن، دکمه ها و بنرها در حالی که کاربر در حال خواندن مطالب در یک صفحه خاص است، جابجا می شود؟
عناصری که موقعیت خود را تغییر می دهند، می توانند باعث سردرگمی کاربران شوند و تجربه آنها در یک صفحه را تحت شعاع قرار دهند، بنابراین باید اطمینان حاصل شود که پس از لود صفحه، تمام محتوا در جای خود باقی خواهد ماند. CLS معیارهای اصلی تعیین ثبات بصری (Visual Stability) یک صفحه از دیدگاه کاربر را با در نظر گرفتن چندین عامل بررسی می کند:
- جابجایی چیدمان
- کم کردن ضربه
- میزان فاصله
مدیران سایت باید CLS 0.1 یا کمتر را هدف قرار دهند.
3. اولین تاخیر ورودی First Input Delay (FID)
کاربران آنلاین، صفحاتی را دوست دارند که سریع بوده و تعامل (Interact) با آنها آسان باشد. First Input Delay معیاری دیگر از کور وب وایتال (Core Web Vitals)، میزان تاخیر ورودی (زمانی که طول می کشد تا یک عنصر صفحه به ورودی کاربر پاسخ دهد) را اندازه گیری می کند تا صفحاتی که می توانند در لود باعث ناامیدی مخاطبان شما شوند را شناسایی نماید.
وب سایت های مدرن، مجموعه ای از فناوری های پیشرفته و ابزارک های محتوای پویا را برای ارائه مطالب کاربردی و مفید به مخاطبان خود مورد استفاده قرار می دهند. در حالی که این نوع محتوا میتواند تعامل را بهبود ببخشد اما ممکن است تاخیر ایجاد کرده و کاربر را ملزم کند تا برای دریافت پاسخ بر اساس ورودی، منتظر بماند.
توسعه دهندگان باید مدت زمانی را که کاربران در انتظار پاسخگویی مرورگر به ورودی آنها سپری می کنند، با بهینه سازی عملکرد سایت کاهش دهند تا تعامل و قابلیت استفاده سایت را بهبود ببخشند.
تصویر(3)
FID چه چیزی را اندازه گیری می کند؟
FID (اولین تاخیر ورودی) سرعت پاسخگویی صفحه را پس از دریافت ورودی از کاربر، اندازه گیری می کند. این بدان معنی است که معیار FID صرفا رویدادهایی مانند کلیک ها و فشار دادن کلیدها را ثبت می کند. هدف صاحبان سایت باید ارائه یک تجربه کاربری (User Experience) خوب، با FID کمتر از 100 میلی ثانیه باشد.
لازم به ذکر است که اندازه گیری FID دشوار می باشد زیرا این داده ها فقط از فیلد های ورودی بدست می آیند. یعنی امتیاز نهایی به متغیرهایی خارج از کنترل شما بستگی دارد، مانند قابلیت های دستگاه کاربران و سرعت اینترنتی که توسط مخاطبان شما به منظور مشاهده وب سایت استفاده شده است.
سایر معیارهای حیاتی در عملکرد کور وب وایتال
همانطور که ذکر شد، کور وب وایتال (Core Web Vitals) مجموعه ای از اطلاعات را ارائه می دهد که توسعه دهندگان می توانند از آنها برای برای بهبود تجربه کاربری (UX) وب سایت خود استفاده کنند. به موازات معیارهای اصلی ذکر شده در بالا، توسعه دهندگان می توانند تاثیر کدهای خود بر نحوه تعامل کاربران با محتوای سایت را درک کنند.
در حالی که آنها بخشی از معیارهای تجربه کاربر در نظر گرفته نمیشوند اما مدت زمان تاخیر (FID) یا سایر عوامل فنی را تعیین میکنند که میتوانند بر نحوه تعامل مخاطبان با یک صفحه وب تأثیر منفی داشته باشند، بنابراین در ادامه چند معیار دیگر به صورت مختصر ذکر شده است که میتوانید برای درک تجربه کاربران در سایت خود، از آنها استفاده کنید.
1. زمان لود اولین محتوا (First Contentful Paint)
First Contentful Paint (FCP) مدت زمانی که طول میکشد تا مرورگرِ کاربر عناصر DOM (تصاویر، عناصر (canvas) غیرسفید و SVG) را رندر کند، اندازهگیری می نماید. این معیار منابع مسدودکننده رندر را شناسایی و در بازه های مختلف بر اساس ثانیه، دسته بندی می کند:
- 0-2 ثانیه: سبز (سریع)
- 2-4 ثانیه: نارنجی (متوسط)
- 4+ ثانیه: قرمز (کند)
2. شاخص سرعت (Speed Index)
وبسایتهای سریع، تجربه آنلاین را بهبود می بخشند. شاخص سرعت (SI) میانگین زمانی را که طول میکشد تا محتوای سایت شما به کاربر نمایش داده شود، نشان می دهد. این معیار از کور وب وایتال (Core Web Vitals)، جاوا اسکریپت اضافی موجود در یک صفحه را شناسایی کرده و بر اساس میلی ثانیه دسته بندی می کند:
- 0-4.3 ثانیه: سبز (سریع)
- 4.4-5.8 ثانیه: نارنجی (متوسط)
- 5.8+ ثانیه: قرمز (کند)
3. زمان شروع تعامل (Time to Interactive)
Time to Interactive (TTI) مدت زمانی است که طول می کشد تا محتوای یک صفحه قابل استفاده باشد و کاربر بتواند با آن ارتباط برقرار نماید. TTI به شما کمک می کند تا صفحاتی که دارای جاوا اسکریپت غیر ضروری هستند را شناسایی کرده و بر اساس میلی ثانیه دسته بندی می کند تا نسبت به بهینه سازی آن اقدام شود :
- 0-3.8 ثانیه: سبز (سریع)
- 3.9-7.3 ثانیه: نارنجی (متوسط)
- 7.3+ ثانیه: قرمز (کند)
4. مدت زمان پاسخگویی به ورودی خاص (Total Blocking Time)
Total Blocking Time (TBT) به مدیران سایت کمک می کند تا مدت زمانی را که یک صفحه وب به ورودی های خاص پاسخ می دهد، ارزیابی کنند. این معیار صفحاتی که دارای جاوا اسکریپت غیر ضروری هستند را شناسایی کرده و بر اساس میلی ثانیه دسته بندی می کند تا نسبت به بهینه سازی آن اقدام شود :
- 0-300 ms: سبز (سریع)
- 300-600 میلیثانیه: نارنجی (متوسط)
- 600+ ms: قرمز (کند)
5. امتیازات عملکرد صفحه (Page Performance Scores)
Page Performance Scores یک معیار واحد است که تمام معیارهای مهم تجربه کاربر (UX) در کور وب وایتال (Core Web Vitals) را در نظر می گیرد. این امتیاز از یک سیستم امتیازدهی انبوه، شامل تمام بازدیدهای تلفن همراه و دسکتاپ استفاده می کند.
تمامی معیارها در امتیازات عملکرد صفحه (Page Performance Scores) ساده شدهاند و توسعهدهندگان میتوانند امتیازات را به صورت 90 (خوب)، 50 تا 90 (نیاز به بهینه سازی بهبود) و زیر 50 (ضعیف) در نظر بگیرند.