با این کار جزو نفرات اول دوره GA4 منتوریکس هستید. با شما در ارتباط هستیم :)
  • 1
  • 2
  • 3
کتاب الکترونیکی رایگان

برو مرحله بعدی
  • 1
  • 2
  • 3
دوست عزیز
برای ارسال کتاب به ایمیل و شماره موبایل شما نیاز داریم.
برو مرحله آخر
  • 1
  • 2
  • 3
کتاب شما آماده است، دکمه دریافت لینک دانلود را بزنید.

لینک دانلود به شما ایمیل و پیامک شد.

core web vitals چیست؟ راهنمای 0 تا 100 کور وب ویتال

ساسان سلوتی
ساسان سلوتی
17:31، 1401/05/22
core web vitals چیست؟ راهنمای 0 تا 100 کور وب ویتال
4 رای    میانگین 4.0/5
لطفا شما هم امتیاز بدهید!

core web vitals چیست؟ راهنمای 0 تا 100 کور وب ویتال


در آینده‌ای نزدیک Core Web Vitals یا هسته حیاتی وب بخش جدایی‌ناپذیر سئو سایت خواهد شد. سئوکاران از این به بعد به دو دسته کسانی که کوروب وایتال می‌دانند و نمی‌دانند تقسیم می‌شوند، از این رو بهتر است هر چه زودتر خود را با تغییرات فاکتورهای رتبه بندی گوگل در ماه June سال 2021 همگام کنید. در ادامه همراه ما در منتوریکس باشید تا ببینیم core web vitals چیست، چه معیارهایی دارد و چگونه می‌توان آن را بهینه کرد.

کور وب وایتال یا معیارهای حیاتی وب چیست؟

Core Web Vitals ابتکاری است برای ارائه راهنمایی یکپارچه برای سیگنال‌های باکیفیت که یک تجربه کاربری عالی در وب را اراده می‌دهند. معیارهای اصلی کوروب وایتال 3 معیار تاخیر ورودی اول (FID)، بزرگ‌ترین ترسیم محتوایی صفحه (LCP) و تغییر چیدمان تجمعی (CLS) می‌شود که هر کدام یک آستانه دارند که با تعیین آن می‌توانیم سایت خود را برای هسته حیاتی وب بهبود ببخشیم.

در زیر مجموعه‌ای از آموزش Core Web Vitals به صورت دسته بندی موضوعی آمده است. به وسیله این آموزش‌ها می‌توانید به راحتی بدانید کوروب وایتال چیست؟ و چرا باید سئو سایت خود را براساس Core Web Vitals بهبود ببخشیم. همچنین درباره موضوعاتی مانند Font web، جاوا اسکریپت، کدهای CSS، API، بهینه سازی ابعاد و سایز تصاویر و ویدیو و ابزارهای اندازه گیری Core Web Vitals و گزارش‌گیری به وسیله ابزارهای مختلف مانند CRUX، Lighthouse سرچ کنسول و... سخن می‌گوییم.

در زیر می‌توانید موضوعات را مشاهده کنید و مقالات مرتبط با هر یک را مطالعه کنید. همچنین در انتهای این مطلب می‌توانید کتاب جامع core web vitals که توسط آژانس دیجیتال مارکتینگ منتوریکس تهیه شده است را دانلود کنید.

راهنمای جامع Core Web Vitals

کاربر، کاربر و باز هم کاربر. موتورهای جست‌وجو امروزه بسیار هوشمند شده‌اند، قبول دارید؟ از سیرِ الگوریتم‌های گوگل که بگذریم، می‌رسیم به سال 2021 که کاربر بیش از هر زمان دیگری برای موتورهای جست‌وجو به‌ویژه گوگل اهمیت پیدا کرده است. ماهیت Core web vitals برخلاف نامش، آنقدرها هم عجیب نیست، بلکه تمام هَم و غمش بهبود تجربه‌ای است که کاربر هنگام مواجه با سایت شما به دست می‌آورد.

معیارهای اندازه گیری Core Web Vitals

معیارهای اندازه‌گیری core web vitals فاکتورهایی هستند که از سمت موتورهای جست‌وجو در سایت‌تان بررسی می‌شوند و براساس عملکردی که در آن‌ها دارید، امتیاز کسب می‌کنید. این معیارها عبارتند از:

  • LCP (Largest Contentful Paint)
  • FID (First Input Delay)
  • CLS (Cumulative Layout Shift)

هر یک از این معیارها به ویژگی‌هایی اشاره دارد که کاربر در مواجهه با سایت شما آن را تجربه می‌کند. برای مثال زمان بارگزاری بزرگ‌ترین المان تصویری صفحه چقدر است؟ کاربر چقدر در اولین مواجهه با تاخیر مواجه می‌شود؟ (در این رابطه حتما مقاله تأثیر سرعت سایت بر سئو را مطالعه کنید). آیا چیدمان صفحه هنگام اسکرول کردن تغییر می‌کند یا به زبان خودمانی می‌پَرَد؟ (مشکل رایج سایت‌های خبری و محتوایی ایران!)

امتیازی که از این 3 معیار گرفته می‌شود، به صورت کلی، امتیاز core web vitals سایت شما را می‌سازد. پیشنهاد می‌کنیم برای آشنایی مفصل با هریک از این معیارها، مطالب زیر را مطالعه کنید:

معیارهای Core web vitals

معیارهای Core web vitals زیر مجموعه‌ای از معیارهای Web Vitals هستند که بر تمامی صفحات وب اعمال می‌شوند و باید توسط صاحبان تمامی سایت‌ها به کار گرفته شوند. این معیارها در تمامی ابزارهای گوگل وجود دارند. هر یک از معیارهای Core web vitals نمایانگر یک وجه متمایز از تجربه‌ی کاربری هستند. این معیارها به صورت میدانی قابل اندازه‌گیری هستند و انعکاسی از تجربه‌ی کاربری واقعی از یک خروجی مهم کاربر محور به شمار می‌آیند.

معیارهای تشکیل‌دهنده‌ی معیارهای Core web vitals به مرور زمان تکامل می‌یابند. مجموعه‌ی کنونی برای سال 2020 بر سه جنبه از تجربه‌ی کاربری تمرکز دارد:

  • بارگذاری (Loading)
  • تعامل (Interacctivity)
  • پایداری بصری (Visual Stability)

این 3 بخش شامل 3 معیار زیر است (و آستانه‌های مربوط به هر یک):

معیارهای Core web vitals

معیارهای اصلی Core Web Vitals

  • بزرگ‌ترین ترسیم محتوایی صفحه (LCP): این معیار عملکرد بارگذاری را اندازه‌گیری می‌کند. به منظور ارائه‌ی یک تجربه‌ی کاربری خوب، LCP باید در عرض 5/2 ثانیه بعد از شروع بارگذاری صفحه اتفاق افتد.
  • تاخیر ورودی اول (FID): این معیار تعامل را اندازه‌گیری می‌کند. به منظور ارائه‌ی یک تجربه‌ی کاربری خوب، صفحات باید FID 100 میلی ثانیه یا کمتر داشته باشند.
  • تغییر چیدمان تجمعی (CLS): این معیار پایداری بصری را اندازه‌گیری می‌کند. به منظور ارائه‌ی یک تجربه‌ی کاربری خوب، صفحات باید CLS 1/0 یا کمتر داشته باشند.

چگونگی محاسبه‌ی CLS

مثال تصویری از CLS

برای هر یک از معیارهای بالا، به منظور تضمین دستیابی به هدف توصیه شده برای رسیدن به تجربه‌ی کاربری خوب، یک آستانه‌ی خوب اندازه‌گیری 75% از صفحات بر روی گوشی‌های موبایل و دستگاه‌های دسکتاپ تعریف شده است.

ابزارهایی که انطباق با معیارهای Core web vitals را ارزیابی می‌کنند، یک صفحه وب را در صورت برآورده کردن اهداف توصیه شده در آستانه‌ی 75% برای هر سه معیار، قبول می‌کنند و امتیاز خوبی به آن‌ها می‌دهند.

خب درباره این 3 معیار نیز آستانه وجود دارد که به این ترتیب است: 

  مطلوب ضعیف %
شاخص LCP کمتر از 2500 میلی ثانیه بیشتر از 4000 میلی ثانیه 75
شاخص FID کمتر از 100 میلی ثانیه بیشتر از 300 میلی ثانیه 75
شاخص CLS کمتر از 0.1 ثانیه بیشتر از 0.25 ثانیه 75

جدول شماره 1 – آستانه معیارهای وب وایتال

سنجش و اندازه‌گیری Core Web Vitals

حال که متوجه شدید Core Web Vitals چیست، بیایید نگاهی بیندازیم به بحث شیرین اندازه‌گیری! اگر با دنیای داده‌ها رابطه‌ی خوبی داشته باشید، حتما مشتاقید با روش‌های اندازه‌گیری معیارهای کور وب وایتال آشنا شوید. خبر خوب این است که بسیاری از ابزارهای سئویی موجود، توان سنجش این معیارها را دارند.

در ادامه لیستی از این ابزارها را معرفی کرده‌ایم، اما برای کسب اطلاعات بیشتر در مورد ابزارها، پیشنهاد می‌کنیم مقاله‌ی اختصاصی هر یک که در ادامه لینک آن‌ها گذاشته شده است را مطالعه کنید.

ابزارهای اندازه گیری WEB VITALS

ابزارهای اندازه‌گیری کور وب وایتال در یک نگاه

همانطور که در تصویر بالا می‌بینید، از ابزارهای متنوعی می‌توان برای اندازه گیری معیارهای حیاتی وب استفاده کرد. بعضی از مهم‌ترین این ابزارها عبارتند از:

  • Search Console: اگر سئوکار هستید، حتما می‌دانید سرج کنسول چیست و چه کاربردی دارد. سرچ کنسول قسمتی از گزارش‌های خود را به بررسی معیارهای کور وب وایتال اختصاص داده است. برای دیدن این بخش به قسمت Experiences بروید و تایتل core web vitals را انتخاب کنید.
  • Page Speed Insight: این ابزار سئویی محبوب هم قادر است گزارش کور وب وایتال را به تفکیک صفحات سایت ارئه دهد.
  • Lighthouse: با توجه به آپدیت‌های جدیدی که ابزار لایت هاوس داشته است، این ابزار هم می‌تواند گزارش خوبی از معیارهای اصلی کور وب به شما ارائه دهد.
  • CRUX: کراکس یا گزارش تجریه کاربری کروم از ابزارهای جدید و جذابی‌ست که با امکان اتصال به دیتا استودیو می‌تواند گزارش‌های خوانا و کاربردی را برای شما فراهم کند.

بهبود معیارهای Core Web Vitals

وضعیت گزارش‌های سایتتان خوب است یا نه؟ در هر صورت نگران نباشید، چون با کمک برنامه‌نویسان سایت، می‌توانید مشکلات core web vitals را به‌راحتی برطرف کنید. برای مثال مشکل CLS با تعیین Height و Width قابل حل شدن است، کافی‌ست لیست المان‌های صفحه که از این مشکل رنج می‌برند را از ابزارهای پیش‌تر معرفی شده به دست آورید و به تیم فنی جهت اقدامات لازم تحویل بدهید. در مقالات زیر به شکل مبسوط روش بهبود معیارهای کور وب وایتال توضیح داده شده است:

بهینه سازی تصاویر و ویدیو سایت

اگر مسئولیت سئو سایتی را برعهده داشتید، حتما می‌دانید عکس‌ها و ویدئوهای هر سایت می‌توانند تبدیل به بلای جان آن شوند! اگر عکس‌ها و ویدئوهای سایت را از نظر حجم بهینه نکنیم، بار زیادی بر دوش سرور سوار می‌کنیم که نتیجه‌ای جز کند شدن سایت و درنتیجه نارضایتی کاربر در پی نخواهد داشت. در مقالات زیر نحوه پیدا کردن عکس‌های پر حجم و روش بهینه کردن آن‌ها را توضیح داده‌ایم:

بهینه سازی Resource Delivery

شبکه‌های توزیع محتوا یا CDN نقش قابل توجهی در بهبود عمکرد سایت، کاهش بار ترافیکی سرور و در نتیجه سرعت سایت دارند. برای آشنایی بیشتر با نحوه‌ی عملکرد CDNها، مطلب زیر را بخوانید:

بهینه سازی منابع Third Party

حتما شما هم از یک یا چند اسکریپت شخص ثالث در وب‌سایتتان استفاده می‌کنید؛ کد امبد ویدئو، خدمات چت آنلاین، اسکریپت‌های گوگل آنالیتیکس، تگ منیجر و... تنها نمونه‌ای از اسکریپت‌های شخص ثالث هستند که می‌توانند روی سرعت سایت اثر بگذارند. ما در مقالات زیر به شما می‌گوییم چطور می‌توان این منابع را شناسایی و بهینه کرد.

بهینه سازی فونت وب Fontweb

وقتی بحث Performance سایت به میان می‌آید، نباید از نقش کلیدی فونت‌ها غافل شد. از آنجا که فونت‌ها منبعی اضافی دارند، اگر بهینه نشده باشند می‌توانند روی سرعت سایت اثر منفی بگذارند. در مقالات زیر با زیر و بمِ فونت‌های سایت و روش‌های بهینه کردن آن‌ها آشنا شوید:

بهینه سازی CSS و جاوا اسکریپت

با css و کدهای جاوا اسکریپتی بهینه نشده چه کنیم؟ اصلا چرا بهینه کردن این دو اهمیت دارد؟ اگرچه بحث در این زمینه کمی تخصصی و در حوزه‌ی استحفاظی برنامه‌نویسان است، اما بشما به عنوان سئوکار باید با ادبیات این حوزه آشنا باشید تا بتوانید درخواست خود را مطرح کنید. در مقالات زیر با چرایی و چگونگی بهینه‌سازی CSS و جاوا اسکریپت آشنا خواهید شد:

دانلود کتاب Core Web Vitals

دوست دارید همه‌ی مطالب آموزشی کور وب وایتال را یک‌جا داشته باشید؟ ما منتوریکسی‌ها تصمیم گرفتیم کتابچه‌ی آموزشی Core Web vitals را برای شما تدارک ببینیم تا مثل یک منبع همیشه در کنارتان باشد. برای دریافت کتاب، کافی‌ست روی لینک زیر کلیک کنید:

ابزار CrUX Dashboard

یک نمونه گزارش از اندازه گیری Web Vitals

ابزارهای اندازه گیری WEB VITALS کدامند؟

در حال حاضر ابزارهای گوگل با کمک ارزیابی صفحه محور، اندازه‌گیری Core Web Vitals را انجام می‌دهند. پس حتماً این شاخص‌ها باید برای اندازه‌گیری در دسترس و قابل اندازه‌گیری باشند.

پیش از شروع، برای آنکه بتوانید تجربه کاربر از وبسایت خود را با Core Web Vitals اندازه‌گیری کنید، مراحل زیر را انجام دهید:

  • از سرچ کنسول جدید، گزارش Core Web Vitals را دریافت کنید تا مجموعه صفحه‌هایی که نیاز به توجه بیشتری دارند را پیدا کنید.
  • زمانی که صفحات مدنظر خود را پیدا کردید، باید از PageSpeed Insight (که توسط lighthouse و Chrome UX Report تهیه شده است) استفاده نمایید تا مشکل صفحه را بیابید. PageSpeed Insight یا همان PSI را می‌توانید در سرچ کنسول خود بیابید یا در PSI به‌صورت مستقیم آدرس URL خود را وارد نمایید.
  • آیا برای بهینه‌سازی وبسایت خود به‌صورت محلی به کمک این ابزار آمادگی دارید؟ از Lighthouse و Chrome DevTools برای اندازه‌گیری Core Web Vitals استفاده کنید. در همین بخش، ابزارها شما را راهنمایی می‌کنند تا چطور مشکل را برطرف نمایید. با استفاده از افزونه Web Vitals کروم می‌توانید در لحظه شاهد استانداردها و شاخص‌های مدنظر خود باشید.
  • آیا به داشبورد شخصی‌سازی‌شده برای Core Web Vitals نیاز دارید؟ از داشبورد آپدیت CrUx یا Chrome Ux Report API جدید برای داده‌های میدانی یا PageSpeed Insight API برای داده‌های آزمایشگاهی استفاده کنید.

بررسی ابزار Lighthouse

Lighthouse یک وبسایت خودکار است که می‌تواند به توسعه‌دهنده در زمینه تشخیص مشکلات مختلف کمک کند. به این ترتیب توسعه‌دهنده با کمک Lighthouse می‌تواند تجربه کاربر وبسایت خود را بهبود دهد.

این ابزار می‌تواند چند بُعد مختلف از تجربه واقعی کاربر را در محیط آزمایشگاهی اندازه‌گیری نماید. این ابعاد شامل عملکرد و دسترسی یا همان دستیابی‌پذیری کاربر می‌شوند. در آخرین نسخه از Lighthouse، استانداردها و ممیزی‌های جدید به آن اضافه شده است. در این نسخه می‌توانید امتیاز عملکرد وبسایت خود را نیز از 1 تا 100 مشاهده کنید.

در آخرین نسخه Lighthouse 6.0، سه استاندارد جدید به گزارش اضافه شده است. دو شاخص جدید، Largest Contentful Paint (LCP) و Cumulative Layout Shift (CLS) هستند. این دو شاخص می‌توانند با کمک Core Web Vitals به بهبود تجربه کاربر، کمک شایان توجهی کنند. این شاخص‌ها نه فقط به‌عنوان یک شاخص اندازه‌گیری در گزارش نهایی، بلکه به‌عنوان یک عامل در امتیاز نهایی عملکرد وبسایت نیز در نظر گرفته خواهند شد.

Total Blocking Time یا همان TBT، سومین استاندارد جدیدی است که آن را به Lighthouse اضافه کرده‌اند. این شاخص جدید در ارتباط مستقیم با FID یا همان تأخیر اولین ورودی است. از ترکیب این شاخص‌ها، Lighthouse به شما بهترین شرایط را برای تجربه مطلوب کاربر ارائه می‌دهد. تمام محصولات مرتبط با Lighthouse، از جمله Lighthouse CI، از آخرین نسخه Lighthouse استفاده می‌کنند. Lighthouse CI به شما کمک می‌کنند تا به‌راحتی پول ریکوئست‌های (Pull Request) خود را قبل از ادغام و اجرا‌شدن، اندازه‌گیری نمایید.

بررسی ابزار PageSpeed Insight

بررسی ابزار PageSpeed Insight

ابزار PageSpeed Insight یا همان PSI عملکرد میدانی و آزمایشگاهی یک صفحه را هم در زمینه کاربران موبایل و هم کاربران دسکتاپ ارائه می‌دهد. این ابزار به‌صورت کلی به شما نشان می‌دهد که تجربه واقعی کاربر از صفحه شما چیست؟

PSI این کار را با کمک گزارش Chrome UX انجام می‌دهد. در نهایت PSI چند راهکار برای حل مشکلات و بهبود عملکرد وبسایت در اختیار توسعه‌دهنده قرار خواهد داد.

ابزار PSI و همچنین PSI API برای اینکه بتوانند از Lighthouse نسخه 6 استفاده کنند، ارتقاء یافته‌اند. در حال حاضر این ابزارها قادر به اندازه گیری Core Web Vitals هم در شرایط میدانی و هم در شرایط آزمایشگاهی هستند.

با وجود آنکه سرچ کنسول، دامنه وسیعی از صفحاتی که به توجه و ارتقاء بیشتری نیاز دارند را به توسعه‌دهندگان ارائه می‌دهد، PSI به توسعه‌دهنده کمک می‌کند تا تجربه کاربر در هر صفحه را بهبود دهد. در PSI شما می‌توانید به وضوح بررسی کنید که آستانه هر یک از شاخص‌های Core Web Vitals صفحه شما در چه وضعیتی قرار دارند. شما می‌توانید تمامی این موارد را در گزارش کامل PSI به دست بیاورید.

بررسی ابزار Chrome UX Report

Chrome UX Report یا همان CrUX یک سری مجموعه داده عمومی از تجربه کاربران واقعی در میلیون‌ها وبسایت مختلف است. این ابزار می‌تواند تمام نسخه‌های Core Web Vitals را اندازه‌گیری کند. برخلاف داده‌های آزمایشگاهی، داده‌های CrUX از کاربران واقعی در این زمینه تهیه شده است.

با استفاده از این داده‌ها، توسعه‌دهنده می‌تواند درک کاملی از توزیع تجربه واقعی کاربران جهانی در وبسایت خود یا حتی وبسایت رقبا داشته باشد. حتی اگر وبسایت شما فاقد RUM باشد، CrUX یک راه سریع برای اندازه‌گیری و ارزیابی Core Web Vitals وبسایت شما خواهد بود.

مجموعه داده CrUX، داده‌هایی در خصوص عملکرد مطلوب تمام شاخص‌های Core Web Vitals را شامل می‌شود. دسترسی به تمام این داده‌ها به‌صورت ماهانه امکان‌پذیر است.

معرفی CrUX API

تنها راه برای آنکه عملکرد حقیقی وبسایت خود را به دست بیاورید، اندازه‌گیری عملکرد کاربرانی است که در حال بارگذاری وبسایت شما و ارتباط برقرار کردن با آن هستند. این نوع ارزیابی معمولاً مربوط به RUM یا همان بررسی لحظه‌ای کاربر در بازه زمانی کوتاه‌مدت است. اگر وبسایت شما فاقد RUM باشد، CrUX یک راه سریع برای اندازه‌گیری و ارزیابی Core Web Vitals وبسایت شما خواهد بود.

بیشتر بخوانید: چطور با CrUX معیارهای Core Web vitals را اندازه بگیریم؟ {آموزش ویدئویی}

معرفی CrUX API

امروز مفتخریم اعلام کنیم که CrUX API برای اندازه‌گیری استاندارد‌های مختلف به‌صورت رایگان قابل استفاده است. CrUX API یک روش رایگان و سریع برای ادغام روند بهبود وبسایت شما با اندازه‌گیری‌های مطلوب بر اساس URL و اوریجینز شماست. در این ابزار می‌توانید شاخص‌های زیر را اندازه‌گیری نمایید:

  • Largest Contentful Paint
  • Cumulative Layout Shift
  • First Input Delay
  • First Contentful Paint

توسعه‌دهندگان می‌توانند با اعمال فاکتورها و فیلترهای مختلف به‌دنبال یک URL، اوریجین یا بخشی از آن بگردند. API به‌صورت روزانه بروزرسانی می‌شود و گزارش 28 روز قبل را به‌صورت مختصر ارائه می‌دهد. این API دارای همان مقدار سهم از API عمومی است که در PageSpeed Insight API وجود دارد. این یعنی هر دو دارای 25،000 درخواست در روز هستند.

بررسی داشبورد Revamped CrUX

داشبورد جدید CrUX به شما اجازه می‌دهد تا در هر لحظه بتوانید عملکرد هر تک اوریجین یا URL را بررسی نمایید. این داشبورد به شما کمک می‌کند تا توزیع دقیق تمام استانداردهای Core Web Vitals را نیز در لحظه مشاهده کنید. این لندینگ پیج جدید فقط به منظور ساده‌سازی استفاده کاربر طراحی شده است. به این ترتیب می‌توانید به‌راحتی عملکرد کلی وبسایت خود را مشاهده کنید.

بررسی تغییرات غیرمنتظره پوسته در پنل جدید

این بخش به شما کمک می‌کند تا تغییرات غیرمنتظره چیدمان و پوسته را تشخیص دهید. این ابزار می‌تواند آشفتگی بصری وبسایت شما را تشخیص دهد تا آن را اصلاح کنید. به این ترتیب CLS صفحه شما کاهش پیدا می‌کند.

برای این کار باید Layout Shift را انتخاب کنید و بر روی گزینه Summary کلیک نمایید. برای آنکه به‌صورت بصری از محل وقوع CLS مطلع شوید، می‌توانید از بخش Moved From و Moved To استفاده نمایید.

شاخص کل زمان انسداد یا همان Total Blocking Time را می‌توان با ابزارهای آزمایشگاهی مختلف اندازه‌گیری کرد. این شاخص یک پراکسی عالی برای تأخیر اولین ورودی به حساب می‌آید. کل زمان انسداد فاصله زمانی بین First Contentful Pain و زمان پاسخدهی یا همان Time To Interactive است. در حقیقت زمان انسداد زمانی است که شاخصه اصلی به مدت کافی مسدود می‌شود تا از پاسخ‌دهی ورودی جلوگیری کند. برا بهبود کل زمان انسداد در شرایط آزمایشگاهی، باید شاخص FID در شرایط میدانی بهبود پیدا کند.

کل زمان انسداد وبسایت شما در بخش کناری پنل جدید تجربه کاربری Chrome DevTools به نمایش در می‌آید. برای دستیابی به این پارامتر باید مراحل زیر را طی کنید:

  1. اول کلید ترکیبی Ctrl+shift+J یا Comand+Option+J را فشار دهید تا پنل DevTools بالا بیاید.
  2. سپس بر روی گزینه Performance کلیک کنید.
  3. در مرحله بعدی بر روی گزینه Record بزنید.
  4. سپس به‌صورت دستی صفحه را دوباره بارگذاری کنید.
  5. صبر کنید تا صفحه به‌صورت کامل بارگذاری شود.

بررسی سرچ کنسول

Core Web Vitals Report جدید در سرچ کنسول به شما کمک می‌کند تا صفحاتی که نیاز به بررسی بیشتر دارند را پیدا کنید. عملکرد سرچ کنسول بر اساس اطلاعات کاربران واقعی از CrUx است. در این ابزار عملکرد URL بر اساس وضعیت، نوع شاخص و گروه URLدسته‌بندی می‌شود.

گزارش نهایی بر اساس سه شاخص اصلی LCP,FID و CLS تهیه خواهد شد. اگر URL حداقل داده مورد نیاز برای ایجاد گزارش را نداشته باشد، از گزارش حذف می‌شود. از سیستم گزارش جدید استفاده کنید تا به دید جامع از عملکرد اوریجین خود دسترسی پیدا کنید.

بعد یافتن صفحه‌ای که دارای مشکلات Core Web Vitals است، می‌توانید از PageSpeed Insight برای یافتن راه‌حل مشکل استفاده نمایید.

بررسی web.dev

web.dev/measure به شما کمک می‌کند تا شاخص‌های صفحه خود را در بازه‌های مختلف زمانی اندازه‌گیری کنید. این ابزار در نهایت به شما یک لیست همراه با اولویت اهمیت ارائه می‌دهد. همچنین در لیست کد‌هایی را مشاهده خواهید کرد که هر کد نشانه یک راه‌کار برای بهبود و رفع آن مشکل است.

این سیستم برای اندازه‌گیری شاخص‌ها و ارائه راهکار، از Page Speed Insights استفاده می‌کند. این ابزار قادر به اندازه‌گیری تمام شاخص‌های Core Web Vitals است.

بررسی web.dev

افزونه Web Vitals

افزونه Web Vitals قادر به اندازه‌گیری سه شاخص اصلی Web Vitals به‌صورت لحظه‌ای در نرم‌افزار گوگل کروم دسکتاپ است. این افزونه به شما کمک می‌کند تا پیش از آنکه یک شاخص دچار مشکل شود و نیاز به بهبود داشته باشد، آن را شناسایی کنید. این افزونه همینطور که در حال مرور صفحات وب هستید، عملکرد وبسایت شما را بررسی خواهد کرد. در حال حاضر می‌توانید این افزونه را از فروشگاه گوگل نصب کنید.

اندازه‌گیری WEB VITALS با استفاده از داده‌های RUM

RUM مخفف عبارت انگلیسی Real User Monitoring است. ترجمه این عبارت، نظارت بر کاربران می‌شود. در نتیجه‌ی، نظارت مستقیم بر کاربران واقعی وبسایت، به داده‌های عددی واقعی دست پیدا خواهید کرد نه آزمایشی. به این طریق می‌توانیم برای بهبود عملکرد وبسایت از داده‌های آزمایشگاهی و واقعی در ترکیب با هم استفاده کنیم.

در حقیقت گوگل از همین داده‌ها استفاده می‌کند تا دستیابی به آستانه‌های WEB VITALS وبسایت ما را بسنجد.

اندازه‌گیری WEB VITALS با استفاده از داده‌های RUM

بهترین ابزارهای اندازه گیری Web Vitals

برای شروع آماده شوید

اگر شما دارای تنظیمات RUM نیستید، این ابزارها به شما کمک می‌کند تا به‌سرعت داده‌های واقعی از عملکرد وبسایت خود برسید. این ابزارها همگی بر اساس Chrome User Experience Report تهیه شده‌اند. با وجود این، باز هم در موارد خاص امکان دارد تفاوتی بین این داده‌ها و داده‌های کاربران واقعی وبسایت شما وجود داشته باشد.

ابزار Page Speed Insights یا همان PSI

PSI گزارشی جامع از عملکرد 28 روزه در سطح صفحه و اوریجین (پروتکل به همراه آدرس و پورت، به زبان ساده همان URL کامل) را ارائه می‌دهد. این ابزار در نهایت به شما راه‌کارهایی برای بهبود عملکرد وبسایت شما ارائه خواهد کرد. اگر به‌دنبال برداشتن اولین قدم در راستای بهبود عملکرد وبسایت خود هستید، ما به شما PSI را پیشنهاد می‌دهیم. PSI بر روی وب به‌عنوان یک API قابل دسترسی است.

ابزار Search Console

سرچ کنسول گزارش عملکرد وبسایت شما را به‌صورت صفحه محور ارائه می‌دهد. این ابزار برای یافتن صفحات یا همان پیج‌هایی که به بهبود نیاز دارند، بسیار مناسب است. برخلاف PSI، گزارش سرچ کنسول شامل داده‌های سابقه عملکرد وبسایت می‌شود. سرچ کنسول فقط بر روی وبسایتی که شما مالک واقعی آن هستید و مالکیت خود را تأیید کنید قابل استفاده است.

تفسیر داده‌های عددی

مثال کاملی از گرازش Core web Vitals و تفسیر داده‌ها

ابزار CrUX Dashboard

این ابزار یک داشبورد آماده است که داده‌های CrUX برای اورجینی که شما انتخاب می‌کنید را نشان می‌دهد. عملکرد این ابزار در اولویت قرار دارد و در عرض کمتر از 1 دقیقه اطلاعات را برای شما مهیا می‌کند. در مقایسه با سرچ کنسول و PSI، گزارش CrUX شامل ابعاد و جوانب بیشتری می‌شود. به‌عنوان مثال نوع دستگاه و نوع کانکشن کاربر نیز در این نوع داده مشخص خواهد شد.

لازم به ذکر است که این ابزارها فقط برای مراحل ابتدایی طراحی نشده‌اند. بلکه از آن‌ها می‌توان در تحلیل‌های پیشرفته و شرایط مختلف نیز استفاده کرد. CrUX و همچنین PSI، هر دو به‌صورت API نیز ارائه شده‌اند و می‌توان از آن‌ها برای ساخت داشبورد و گزارش‌های دیگر نیز استفاده کرد.

بیشتر بخوانید: چطور با CrUX معیارهای Core Web vitals را اندازه بگیریم؟ {آموزش ویدئویی}

جمع‌آوری اطلاعات RUM

با وجود آن‌که گزارش گوگل یا همان CrUX اطلاعات بسیار مفیدی را ارائه می‌دهد و قابل استناد هستند؛ اما شدیداً توصیه می‌کنیم که اطلاعات RUM وبسایت خود را نیز جمع‌آوری کنید. این کار باعث می‌شود تا به جزئیات بیشتری درباره کاربران واقعی وبسایت خود دست پیدا کنید. به این ترتیب می‌توانید فیدبک لحظه‌ای آن‌ها را به دست بیاورید. پس در نتیجه با اتکا به این داده‌ها، بهبود عملکرد وبسایت شما و تشخیص مشکلات آن ساده‌تر خواهد بود.

به یاد داشته باشید داده‌های CrUX تخمینی از داده‌های به دست آمده در طول یک ماه هستند. به همین خاطر جزئیات این داده‌ها در ابزارهای مختلف، متفاوت خواهد بود. به‌عنوان مثال گزارش PSI و سرچ کنسول بر اساس عملکرد 28 روزه وبسایت شما تهیه می‌شود. این در حالی است که مجموعه داده‌های CrUX به‌صورت ماهانه به وجود می‌آید. پس داده‌های شما از هر ابزار ممکن است با دیگری کمی متفاوت باشد.

شما می‌توانید داده‌های RUM را با کمک سرویس اختصاصی RUM جمع‌آوری کنید یا اینکه از ابزار شخصی خودتان استفاده نمایید. سرویس اختصاصی RUM مخصوص جمع‌آوری داده‌های RUM و ارائه گزارش در همین راستا است. برای آنکه از این سرویس در راستای اندازه‌گیری Core Web Vitals استفاده کنید، از سرویس اختصاصی RUM بخواهید تا مانیتورینگ Core Web Vitals را برای شما فعال نماید.

اگر فاقد سرویس اختصاصی RUM هستید، شاید با تغییرات جزئی در تنظیمات سیستم تحلیلی وبسایت خود بتوانید این داده‌های عددی را به دست بیاورید. برای این کار می‌توانید از کتابخانه جاوا اسکریپت، کد web-vitals را انتخاب کنید. روش دقیق استفاده از این روش را در ادامه به شما عزیزان معرفی خواهیم کرد:

استفاده از Web – Vitals در کتابخانه جاوا اسکریپت

اگر می‌خواهید به‌جای استفاده از سرویس اختصاصی RUM، ابزار اندازه‌گیری خودتان را اجرا کنید، بهتر است به سراغ Web – vitals در کتابخانه جاوا اسکریپ بروید. Web – Vitals یک کتابخانه کوچک ماژولار است که سایز آن به کمتر از 1 کیلوبایت می‌رسد. این کتابخانه می‌تواند به‌عنوان یک API مناسب برای جمع‌آوری داده‌های میدانی در زمینه استانداردهای Web Vitals برای شما عمل کند.

به این ترتیب شاخص‌ها به‌صورت مستقیم تحت‌تأثیر APIهای مرورگر نیستند؛ بلکه بر آن‌ها اولویت دارند. به‌عنوان مثال برای اندازه‌گیری استاندارد CLS از API مخصوص عدم ثبات پوسته استفاده می‌شود؛ اما زمانی که از کتابخانه Web – Vitals استفاده کنید دیگر لازم نیست نگران باشید که حتماً خودتان یک روش برای اندازه‌گیری این شاخص را اجرا کنید؛ بلکه این کتابخانه می‌تواند از بهترین روش برای اندازه‌گیری این استاندارد استفاده نماید.

سخن آخر

در این مقاله، سعی کردیم به هرآنچه راجع به کور وب وایتال نیاز دارید اشاره کنیم. برای دریافت بهتر از این مقاله، توصیه می‌کنیم حتما ویدئوی آموزشی را ببینید و لینک مقالات تکمیلی را هم مطالعه کنید. اگر سوالی در این رابطه داشتید، حتما برایمان کامنت بگذارید، مشتاقانه آن‌ها را می‌خوانیم و پاسخ می‌دهیم. جهت دریافت خدمات سئو سایت، آژانس دیجیتال مارکتینگ منتوریکس، همراه شماست.

ساسان سلوتی
ساسان سلوتی

ایدئولوژی اصلی ساسان اینه تا اونجایی که می‌تونه به کنجکاوی‌هاش پاسخ مثبت بده. برای همین، کارها و علایق جورواجوری رو دنبال می‌کنه؛ مثلاً: غواصی، دوچرخه‌سواری، یوگا، گیاه‌شناسی، عکاسی ماکرو و... تو کار هم همین طور بوده: از مدیر فروش بازاریابی تا منابع انسانی، دیجیتال مارکتینگ و تدریس...

انتشار مطالب فوق تنها با ذکر مرجع به همراه لینک وب‌سایت منتوریکس مجاز می‌باشد.
لطفا به حقوق هم احترام بگذاریم.

ما نظرات و سوالات شما را با دقت می‌خوانیم و پاسخ می‌دهیم
امین ثریا
1401/07/02
ممنون بابت وقتی که صرف کردید و این مفهوم رو ارائه دادید خسته نباشید.برا من یکم گنگه ! برا مثال مورد دوم یعنی FID با مورد آخر LCP در تعامله دیگه ! یه دکمه رو فشار میدیم یه لودینگ نمایش داده میشه ، تسکها پشت پرده اجرا میشن و ریسپانس برمیگرده . اما مطمعنن چیزی فراتره امیدوارم درک عمیق تری از Core Web
پاسخ...
نظرات تعداد کاراکترهای باقی مانده: 300
انصراف