راهنمای جامع بهینه‌سازی Core Web Vitals؛ رساندن نمرات LCP، INP و CLS به ۱۰۰
Core Web Vitals مجموعه شاخص‌های سنجش سرعت و تجربه کاربری گوگل شامل ۳ مؤلفه اصلی است: سرعت لود بزرگ‌ترین بخش صفحه (LCP زیر ۲.۵ ثانیه)، روان بودن پاسخ به تعاملات کاربر (INP زیر ۲۰۰ میلی‌ثانیه) و پایداری بصری بدون پرش عناصر (CLS زیر ۰.۱). وب‌سایت‌هایی که در محدوده سبز قرار دارند، رتبه برتر SERP و بانس‌ریت بسیار پایین‌تری دارند.
سه ستون بنیادین شاخص‌های سرعت گوگل
ابزارهای معتبری مانند GTmetrix و Google PageSpeed معیارهای خود را مستقیماً بر مبنای این سه شاخص می‌سنجند. در ادامه نحوه بهینه‌سازی هریک را بررسی می‌کنیم:
۱. Largest Contentful Paint (LCP) - سرعت لود المان اصلی
المان اصلی در بیشتر صفحات وب‌سایت، تصویر پس‌زمینه هیرو یا تیتر اصلی H1 است. برای رساندن LCP به زیر ۱.۵ ثانیه:
- تبدیل تصاویر به فرمت مدرن WebP با فشرده‌سازی تا ۸۰ درصد بدون افت کیفیت (مانند تجربه‌ای که در کیس‌استادی کارخانه وین‌وود داشتیم).
- استفاده از
<link rel="preload">برای عکس‌های حیاتی بالای صفحه. - فعال‌سازی فشرده‌سازی Gzip/Brotli روی هاست از طریق کدهای بهینه در فایل
.htaccess.
۲. Interaction to Next Paint (INP) - روانی تعاملات
شاخص INP ارزیابی می‌کند که وقتی کاربر روی دکمه منو یا سبد خرید کلیک می‌کند، مرورگر چقدر سریع فریم بعدی را رندر می‌کند. کدهای سنگین جاوااسکریپت و پلاگین‌های زائد وردپرس باعث مسدود شدن Main Thread مرورگر می‌شوند. راهکار مهندسی، کدنویسی ماژولار و پرهیز از کتابخانه‌های غیرضروری است.
۳. Cumulative Layout Shift (CLS) - پایداری بصری بدون پرش
تا به حال اتفاق افتاده که بخواهید روی لینکی کلیک کنید، اما در همان لحظه با لود شدن یک بنر، متن به پایین بپرد و دست شما به اشتباه جای دیگری کلیک شود؟ این پدیده را CLS می‌نامند. برای رساندن CLS به صفر مطلق، تعیین ابعاد صریح (width و height) در سورس HTML تمام تصاویر الزامی است.
| شاخص عملکردی | محدوده عالی (سبز) | نیازمند بهبود (زرد) | ضعیف (قرمز) |
|---|---|---|---|
| LCP (سرعت لود المان اصلی) | کمتر از ۲.۵ ثانیه | ۲.۵ تا ۴.۰ ثانیه | بیشتر از ۴.۰ ثانیه |
| INP (پاسخگویی به تعاملات) | کمتر از ۲۰۰ میلی‌ثانیه | ۲۰۰ تا ۵۰۰ میلی‌ثانیه | بیشتر از ۵۰۰ میلی‌ثانیه |
| CLS (پرش ناخواسته چیدمان) | کمتر از ۰.۱ | ۰.۱ تا ۰.۲۵ | بیشتر از ۰.۲۵ |
پیوند سرعت سایت با سئو تکنیکال و طراحی اختصاصی
سرعت بالای سایت نه تنها رضایت خریداران را افزایش می‌دهد، بلکه باعث می‌شود گوگل صفحات بیشتری از سایت شما را در زمان کمتر ایندکس کند. اگر سایت فعلی شما در ابزار PageSpeed Insights امتیاز قرمز یا زرد دارد، با یک سئو کار و مهندس وب مشورت نمایید یا با طراحی سایت اختصاصی زیرساختی سبک و پایدار برای بیزینس خود پایه‌ریزی کنید. همچنین برای بررسی کامل ساختار به مقاله راهنمای سئو تکنیکال مراجعه نمایید.
نیاز به بهینه‌سازی سرعت و امتیاز ۱۰۰ سایت خود دارید؟
آدرس وب‌سایت خود را ارسال فرمایید تا گزارش موانع سرعت و زمان‌بندی ارتقای آن بررسی شود (پاسخگویی زیر ۱ ساعت):