Core Web Vitals چیست و چطور سرعت سایت را برای گوگل و کاربر افزایش دهیم؟

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

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

در این راهنما با معیارهای LCP، INP و CLS آشنا می شوید، یاد می گیرید چطور تست سرعت سایت را انجام دهید و با هفت راهکار عملی برای بهینه سازی عملکرد سایت آشنا خواهید شد.

چرا سرعت سایت روی رتبه و فروش اثر می گذارد؟

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

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

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

سرعت سایت فقط زمان باز شدن صفحه نیست

برای ارزیابی عملکرد، باید چند مسئله متفاوت را از هم جدا کنید:

• سرعت نمایش محتوا: کاربر چه زمانی محتوای اصلی صفحه را می بیند؟
• سرعت تعامل: دکمه ها، منوها و فرم ها چه زمانی به ورودی کاربر پاسخ می دهند؟
• ثبات چیدمان: آیا عناصر صفحه در زمان بارگذاری جابه جا می شوند؟
• عملکرد در دستگاه های مختلف: آیا سایت روی موبایل و اینترنت ضعیف هم تجربه قابل قبولی دارد؟

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

Core Web Vitals چیست؟ آشنایی با LCP، INP و CLS

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

محدوده های زیر معیارهای مرجع گوگل هستند. برای ارزیابی تجربه کاربران، داده ها معمولا در صدک ۷۵ بازدیدها بررسی می شوند؛ یعنی باید عملکرد تجربه های واقعی را در نظر گرفت، نه فقط نتیجه یک بار تست.

LCP؛ محتوای اصلی چه زمانی نمایش داده می شود؟

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

اگر LCP صفحه اصلی سایت شما ۴ ثانیه باشد، کاربر برای مشاهده محتوای اصلی بیشتر از محدوده پیشنهادی گوگل منتظر می ماند. علت ممکن است تصویر بسیار حجیم، پاسخ کند سرور، فایل CSS مسدودکننده رندر یا دیر کشف شدن منبع تصویر باشد.

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

INP؛ سایت چقدر سریع به کاربر پاسخ می دهد؟

INP مخفف Interaction to Next Paint است و پاسخ گویی صفحه به تعاملات کاربر را در طول بازدید ارزیابی می کند. تعامل می تواند کلیک روی یک دکمه، لمس منو یا وارد کردن اطلاعات در یک فیلد باشد.

فرض کنید کاربر روی دکمه «ثبت درخواست مشاوره» کلیک می کند، اما صفحه برای مدتی واکنش قابل مشاهده ای نشان نمی دهد. اجرای طولانی کدهای JavaScript، پردازش سنگین در رشته اصلی مرورگر یا کدهای شخص ثالث می توانند در چنین وضعیتی نقش داشته باشند.

برای بهبود INP باید تعاملات کند را در شرایط واقعی بررسی کنید. تقسیم وظایف طولانی JavaScript، کاهش کدهای غیر ضروری و سبک کردن اسکریپت های ردیابی می توانند به پاسخ گویی بهتر کمک کنند. معیار INP از مارس ۲۰۲۴ جایگزین FID به عنوان یکی از Core Web Vitals شد؛ بنابراین، در ارزیابی های فعلی باید INP را معیار اصلی پاسخ گویی در نظر بگیرید.

CLS؛ چرا عناصر صفحه جابه جا می شوند؟

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

علت های متداول CLS عبارت اند از:

• تصاویر و ویدیوهایی که ابعاد مشخصی ندارند.
• تبلیغات یا محتوای پویا که بدون رزرو فضا اضافه می شوند.
• بارگذاری فونت هایی که باعث تغییر اندازه یا چیدمان متن می شوند.
• درج عناصر جدید بالای محتوای موجود.

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

چطور سرعت سایت را اندازه بگیریم؟

پیش از هر تغییری، باید وضعیت فعلی سایت را ثبت کنید. اگر بدون اندازه گیری شروع به نصب افزونه های بهینه سازی کنید، ممکن است زمان زیادی صرف تغییراتی شود که تاثیر چندانی بر مشکل اصلی ندارند.

تست سرعت سایت با PageSpeed Insights

ابزار PageSpeed یکی از گزینه های مناسب برای شروع است. آدرس صفحه را وارد کنید و گزارش موبایل و دسکتاپ را جداگانه بررسی کنید. گزارش این ابزار دو نوع اطلاعات دارد:

• داده های میدانی (Field Data): اطلاعات ثبت شده از تجربه واقعی کاربران، در صورت وجود داده کافی.
• داده های آزمایشگاهی (Lab Data): نتیجه آزمایش کنترل شده ای که برای بررسی عملکرد و پیدا کردن مشکلات احتمالی انجام می شود.

این دو گزارش قابل جایگزینی با یکدیگر نیستند. ممکن است تست آزمایشگاهی نتیجه مناسبی نشان دهد، اما کاربران واقعی روی گوشی های ضعیف تر تجربه کندتری داشته باشند. از طرف دیگر، یک تست آزمایشگاهی نامطلوب لزوما به این معنا نیست که تمام کاربران همان تجربه را دارند. مستندات رسمی گوگل نیز بر بررسی هر دو نوع داده تاکید می کنند.

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

Google Search Console چه کمکی می کند؟

گزارش Core Web Vitals در سرچ کنسول وضعیت صفحات را بر اساس داده های واقعی کاربران نمایش می دهد. این گزارش برای شناسایی گروهی از URLهایی که تجربه مشابهی دارند مفید است؛ برای مثال، ممکن است صفحات محصول فروشگاه همگی مشکل LCP داشته باشند، در حالی که صفحات مقاله عملکرد قابل قبولی دارند.

برای بررسی دقیق تر، این مراحل را انجام دهید:

1. صفحه اصلی، صفحات خدمات یا دسته بندی و چند صفحه مهم دیگر را آزمایش کنید.
2. نتایج موبایل را جدا از دسکتاپ بررسی کنید.
3. معیار ضعیف را مشخص کنید: LCP، INP یا CLS.
4. علت احتمالی را با جزئیات گزارش و ابزارهای توسعه مرورگر بررسی کنید.
5. پس از اصلاح، دوباره تست بگیرید و نتیجه را با وضعیت قبلی مقایسه کنید.

اگر INP در گزارش آزمایشگاهی مستقیما قابل اندازه گیری نباشد، معیار Total Blocking Time یا TBT می تواند برای شناسایی بخشی از مشکلات مرتبط با مسدود شدن رشته اصلی مرورگر کمک کننده باشد؛ اما TBT معادل INP نیست و جای داده های واقعی کاربران را نمی گیرد.

هفت راهکار عملی برای افزایش سرعت سایت

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

۱. بهینه سازی تصاویر را جدی بگیرید

تصاویر حجیم می توانند حجم دانلود صفحه را افزایش دهند و نمایش محتوای اصلی را به تاخیر بیندازند. برای بهینه سازی تصاویر:

• ابعاد تصویر را متناسب با اندازه نمایش آن انتخاب کنید.
• از فرمت های مدرن مانند WebP یا AVIF در صورت سازگاری استفاده کنید.
• میزان فشرده سازی را طوری تنظیم کنید که کیفیت تصویر بیش از حد افت نکند.
• برای تصاویر، ابعاد مشخص در HTML یا CSS تعریف کنید تا فضای آن ها از ابتدا رزرو شود.
• تصاویر خارج از محدوده اولیه نمایش را در صورت مناسب بودن با بارگذاری تنبل (Lazy Loading) بارگذاری کنید.

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

۲. زمان پاسخ سرور را کاهش دهید

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

برای بررسی این بخش، زمان پاسخ اولیه سرور، وضعیت منابع میزبانی، کوئری های پایگاه داده و پردازش های سمت سرور را ارزیابی کنید. در سایت های وردپرسی، افزونه های سنگین، درخواست های تکراری و تنظیمات نامناسب کش ممکن است در کندی نقش داشته باشند.

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

۳. کش مرورگر و کش سرور را درست تنظیم کنید

کش به مرورگر یا سرور اجازه می دهد برخی منابع را برای درخواست های بعدی دوباره از ابتدا دریافت یا تولید نکند. این روش برای فایل های CSS، JavaScript، تصاویر و سایر منابع ثابت می تواند مفید باشد.

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

۴. فایل های CSS و JavaScript غیر ضروری را کاهش دهید

هر فایل اضافی می تواند درخواست شبکه یا پردازش بیشتری به مرورگر تحمیل کند. کدهای استفاده نشده، افزونه های غیر ضروری، کتابخانه های تکراری و اسکریپت های تبلیغاتی را بررسی کنید.

اقدام های کاربردی عبارت اند از:

• حذف کدهایی که دیگر استفاده نمی شوند.
• کوچک سازی فایل های CSS و JavaScript.
• بارگذاری غیر مسدودکننده برای اسکریپت هایی که به اجرای فوری نیاز ندارند.
• تقسیم کدهای حجیم به بخش های کوچک تر، در صورت امکان.
• محدود کردن اسکریپت های شخص ثالثی که ارزش مشخصی برای کسب و کار ندارند.

در سایت های وردپرسی، غیرفعال کردن چند افزونه به صورت تصادفی راهبرد مناسبی نیست. ابتدا اثر هر افزونه را روی عملکرد و قابلیت های سایت بررسی کنید؛ ممکن است حذف یک ابزار ضروری، عملکرد فرم یا سیستم پرداخت را مختل کند.

۵. فونت ها و منابع مسدودکننده رندر را مدیریت کنید

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

فقط وزن های مورد نیاز را نگه دارید، در صورت امکان فونت ها را با فرمت مناسب ارائه دهید و نحوه بارگذاری فونت را بررسی کنید. فایل های ضروری برای نمایش اولیه باید به موقع در دسترس مرورگر قرار بگیرند؛ منابع غیر ضروری می توانند با اولویت پایین تر بارگذاری شوند.

برای LCP، به ویژه بررسی کنید که مرورگر منبع محتوای اصلی را چه زمانی کشف می کند. اگر تصویر اصلی در CSS یا ساختار پیچیده ای پنهان شده باشد، ممکن است دیرتر از حد انتظار بارگذاری شود.

۶. از CDN و فشرده سازی انتقال استفاده کنید

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

فشرده سازی پاسخ های متنی با روش هایی مانند Brotli یا Gzip نیز حجم انتقال HTML، CSS و JavaScript را کاهش می دهد. البته تاثیر هر کدام به نوع محتوا، زیرساخت فعلی و محل کاربران بستگی دارد. برای سایتی با مخاطبان محدود و زیرساخت مناسب، ممکن است اصلاحات دیگری اولویت بیشتری داشته باشند.

۷. نسخه موبایل و تجربه واقعی کاربر را آزمایش کنید

بهینه سازی صرفا برای دسکتاپ کافی نیست. در بسیاری از سایت ها، نسخه موبایل با شبکه کندتر، فضای نمایش محدودتر و توان پردازشی متفاوت استفاده می شود.

صفحات مهم را با عرض های مختلف نمایش آزمایش کنید. منوها، فرم ها، پنجره های بازشو و دکمه های اصلی را لمس کنید و بررسی کنید آیا پاسخ قابل مشاهده به موقع ارائه می شود. برای کاهش CLS، فضای تصاویر و بنرها را از قبل مشخص کنید؛ برای بهبود INP نیز تعاملات کند و اسکریپت هایی را که رشته اصلی مرورگر را مشغول می کنند، شناسایی کنید.

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

اشتباهات رایج در بهینه سازی سرعت سایت

حتی زمانی که ابزارهای تست سرعت سایت در دسترس هستند، بعضی تصمیم ها می توانند زمان و هزینه را هدر دهند. چند خطای مهم را در نظر بگیرید.

تمرکز روی امتیاز ۱۰۰ به جای تجربه کاربر

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

نصب چند افزونه بهینه سازی بدون بررسی تداخل

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

حذف منابع ضروری برای گرفتن امتیاز بهتر

به تاخیر انداختن همه اسکریپت ها یا حذف فایل های CSS بدون بررسی، ممکن است منو، فرم تماس، سبد خرید یا بخش های تعاملی را از کار بیندازد. هدف، کاهش هزینه پردازش و بارگذاری منابع غیر ضروری است؛ نه حذف بی برنامه هر چیزی که در گزارش ابزار دیده می شود.

آزمایش یک صفحه و تعمیم نتیجه به کل سایت

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

برای تحلیل دقیق، چند الگوی اصلی صفحه را آزمایش کنید و مشکلات مشترک را از ایرادهای اختصاصی هر URL جدا نگه دارید.

جمع بندی: برای افزایش سرعت سایت از کجا شروع کنیم؟

برای افزایش سرعت سایت، ابتدا با PageSpeed Insights و Google Search Console وضعیت صفحات مهم را بررسی کنید. سپس مشخص کنید مشکل اصلی به نمایش محتوا، پاسخ گویی تعاملات یا جابه جایی عناصر مربوط است. بهینه سازی تصاویر، اصلاح کدهای اضافی، بهبود پاسخ سرور و تنظیم درست کش می توانند بخشی از راه حل باشند؛ اما انتخاب اقدام مناسب باید بر اساس داده ها انجام شود.

اگر سرعت پایین سایت روی تجربه مشتری یا عملکرد صفحات مهم اثر گذاشته است، بررسی تخصصی می تواند مسیر اصلاح را کوتاه تر کند.

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

سوالات متداول درباره افزایش سرعت سایت

آیا افزایش سرعت سایت باعث بهتر شدن رتبه گوگل می شود؟

Core Web Vitals در سیستم های رتبه بندی گوگل استفاده می شوند، اما سرعت تنها عامل تعیین کننده نیست. کیفیت محتوا، ارتباط آن با جستجوی کاربر و عوامل دیگر نیز اهمیت دارند.

بهترین ابزار برای تست سرعت سایت چیست؟

PageSpeed Insights برای بررسی یک صفحه و مشاهده داده های آزمایشگاهی و میدانی مناسب است. Google Search Console نیز برای مشاهده وضعیت گروهی از صفحات بر اساس داده های کاربران کاربرد دارد.

LCP مناسب چند ثانیه است؟

برای تجربه خوب، LCP باید در صدک ۷۵ بازدیدها حداکثر ۲٫۵ ثانیه باشد. اگر این معیار ضعیف است، تصویر اصلی، زمان پاسخ سرور و منابع مسدودکننده رندر را بررسی کنید.

آیا افزونه های افزایش سرعت برای وردپرس کافی هستند؟

نه همیشه. افزونه ها می توانند کش، فشرده سازی و برخی تنظیمات را مدیریت کنند؛ اما مشکلات هاست، کدهای سنگین، تصاویر نامناسب یا اسکریپت های شخص ثالث ممکن است به اصلاحات دیگری نیاز داشته باشند.

هر چند وقت یک بار باید سرعت سایت را بررسی کنیم؟

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