Core Web Vitals چیست؟ توضیح ساده LCP، INP و CLS

کاربر صفحه محصول را باز می‌کند. چند ثانیه فقط یک کادر خالی جای عکس محصول می‌بیند. بالاخره عکس می‌آید و دکمه «افزودن به سبد» را می‌زند. کاربر روی دکمه می‌زند و نیم ثانیه هیچ اتفاقی نمی‌افتد. گوگل برای هر کدام از این سه لحظه یک عدد دارد و به مجموع این سه عدد Core Web Vitals می‌گوید.

در این مقاله Core Web Vitals را به زبان ساده توضیح می‌دهیم: هر کدام از سه معیار LCP، INP و CLS چه چیزی را می‌سنجد، عدد خوب برای هر کدام چقدر است، چطور اندازه گرفته می‌شوند و برای بهتر کردن هر کدام از کجا شروع کنید.

#Core Web Vitals چیست؟

Core Web Vitals سه معیار گوگل برای سنجش تجربه کاربر از سرعت و پایداری صفحه است: LCP برای سرعت بارگذاری، INP برای واکنش‌پذیری و CLS برای ثبات بصری. این سه عدد از مرورگر کاربران واقعی جمع می‌شوند و گوگل آن‌ها را در ارزیابی تجربه صفحه در نتایج جستجو در نظر می‌گیرد.

یک صفحه وقتی Core Web Vitals را با نمره خوب پشت سر می‌گذارد که هر سه معیار در محدوده خوب باشند. گوگل برای هر معیار عدد ۷۵ درصد بازدیدها را ملاک می‌گیرد. یعنی LCP خوب یعنی دست‌کم سه بازدید از هر چهار بازدید، محتوای اصلی را در کمتر از ۲٫۵ ثانیه دیده است.

#LCP چیست و چطور بهتر می‌شود؟

LCP یا Largest Contentful Paint زمانی است که بزرگ‌ترین بخش محتوای صفحه، معمولاً عکس اصلی یا عنوان بزرگ بالای صفحه، روی صفحه نمایش داده می‌شود. طبق تعریف MDN، این معیار زمان شروع بارگذاری صفحه تا نمایش بزرگ‌ترین تصویر یا بلوک متنی در قسمت قابل‌دید صفحه را می‌سنجد. LCP همان لحظه‌ای است که کاربر حس می‌کند صفحه باز شده است.

رایج‌ترین علت‌های LCP بالا و راه‌حل هر کدام:

• پاسخ کند سرور: اگر سرور یک ثانیه طول بکشد تا اولین جواب را بدهد، LCP هیچ‌وقت زیر یک ثانیه نمی‌رود. کش صفحه و هاست مناسب اولین قدم است.
• عکس اصلی سنگین: عکس بالای صفحه را کوچک کنید، با فرمت WebP ذخیره کنید و آن را تنبل بارگذاری نکنید.
• فایل‌های CSS و جاوااسکریپت که نمایش را متوقف می‌کنند: فایل‌های غیرضروری بالای صفحه را حذف یا با تأخیر بارگذاری کنید.
• فونت و منابع خارجی: فونتی که از سرویس خارجی بارگذاری می‌شود، اگر کند جواب بدهد، نمایش متن را عقب می‌اندازد. فونت را روی هاست خود قرار دهید.

اگر سایت شما وردپرسی است، علت‌های کندی و راه‌حل هر کدام را در مقاله چرا سایت وردپرس کند است مفصل توضیح داده‌ایم.

#INP چیست و چه فرقی با FID دارد؟

INP یا Interaction to Next Paint می‌سنجد صفحه بعد از کلیک، لمس یا فشار دادن کلید چقدر طول می‌کشد تا نتیجه را نشان دهد. طبق مستندات MDN، INP در سال ۲۰۲۴ جای FID را در Core Web Vitals گرفت. فرق اصلی این است که FID فقط اولین تعامل کاربر را می‌سنجید، اما INP همه تعامل‌ها را در طول بازدید در نظر می‌گیرد و کندترین آن‌ها را گزارش می‌کند.

INP بالا معمولاً یعنی مرورگر مشغول اجرای کد سنگین است و نمی‌تواند به کلیک کاربر جواب بدهد. اسکریپت‌های تبلیغاتی و آماری، اسلایدرها، چت آنلاین و صفحه‌سازهای سنگین علت‌های رایج هستند. اسکریپت‌هایی را که لازم ندارید حذف کنید، اسکریپت‌های جانبی را بعد از بارگذاری صفحه اجرا کنید و تعداد افزونه‌هایی را که روی همه صفحه‌ها کد اضافه می‌کنند کم کنید.

#CLS چیست و چرا صفحه جابه‌جا می‌شود؟

CLS یا Cumulative Layout Shift میزان جابه‌جا شدن ناگهانی اجزای صفحه هنگام بارگذاری را می‌سنجد. طبق تعریف MDN، هر بار که عنصری بدون اقدام کاربر جای خود را تغییر دهد، به عدد CLS اضافه می‌شود. همان لحظه‌ای که کاربر می‌خواهد روی دکمه‌ای بزند و دکمه از زیر انگشتش فرار می‌کند، نتیجه CLS بالاست.

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

#Core Web Vitals چطور اندازه گرفته می‌شود؟

Core Web Vitals به دو روش اندازه گرفته می‌شود: داده آزمایشگاهی و داده کاربر واقعی. فرق این دو روش مهم‌ترین نکته‌ای است که موقع خواندن نتیجه ابزارها باید بدانید.

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

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

#چند درصد سایت‌ها Core Web Vitals خوب دارند؟

طبق گزارش سالانه HTTP Archive در سال ۲۰۲۵، فقط ۴۸ درصد سایت‌ها روی موبایل و ۵۶ درصد روی دسکتاپ هر سه معیار Core Web Vitals را با نمره خوب پشت سر می‌گذارند. این عدد برای موبایل در سال ۲۰۲۱ فقط ۳۲ درصد بود. وضعیت هر معیار روی موبایل در همین گزارش:

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

#آیا Core Web Vitals روی سئو اثر دارد؟

Core Web Vitals روی سئو اثر دارد، اما مهم‌ترین عامل رتبه نیست. طبق مستندات Google Search Central، گوگل Core Web Vitals را بخشی از سیگنال‌های تجربه صفحه در نظر می‌گیرد، اما محتوای مرتبط و مفید همچنان اولویت اول است. در عمل، وقتی دو صفحه محتوای هم‌سطح دارند، صفحه‌ای که سریع‌تر و پایدارتر است شانس بیشتری دارد.

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

#Core Web Vitals سایت را با بینا زیر نظر بگیرید

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

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

#جمع‌بندی

Core Web Vitals سه معیار گوگل برای تجربه کاربر است: LCP برای سرعت نمایش محتوای اصلی با حد خوب ۲٫۵ ثانیه، INP برای واکنش به کلیک با حد خوب ۲۰۰ میلی‌ثانیه و CLS برای جابه‌جا نشدن صفحه با حد خوب ۰٫۱.

عددی که اهمیت دارد، عدد کاربران واقعی روی موبایل است. نمره تست آزمایشگاهی فقط برای پیدا کردن علت کندی به کار می‌آید. برای بهتر کردن Core Web Vitals از LCP شروع کنید، چون بیشتر سایت‌ها در همین معیار رد می‌شوند، و بعد از هر تغییر عددها را دوباره بسنجید.

پرسش‌های متداول