❌ در گوگل لایت‌هاوس امتیاز LCP سایت افت کرده است. اولین کاری که بیشتر ما انجام می‌دهیم این است که تصاویر را فشرده کنیم یا سراغ ارتقای سرور برویم.
🧲اما جان مولر از گوگل به یک مطالعه جالب اشاره کرده که می‌گوید در خیلی از سایت‌ها مشکل جای دیگری است.
گاهی مرورگر اصلا تصویر یا المان اصلی صفحه را به عنوان LCP تشخیص نمی‌دهد. در نتیجه شما ساعت‌ها روی بهینه‌سازی یک بخش کار می‌کنید اما امتیاز LCP تغییری نمی‌کند.
در بررسی فروشگاه‌ساز Nuvemshop مشخص شد انیمیشن‌های CSS روی اسلایدرها باعث شده بودند مرورگر به جای تصویر اصلی بالای صفحه یک بنر پایین‌تر را LCP در نظر بگیرد. یعنی تمام بهینه‌سازی‌های قبلی روی المان اشتباه انجام شده بود.
👇 راهکار هم ساده بود:
• انیمیشن‌های ابتدای صفحه حذف شدند.
• ویژگی loading="lazy" از اولین تصویر برداشته شد تا بلافاصله بارگذاری شود.
• برای همان تصویر fetchpriority="high" تنظیم شد تا مرورگر آن را در اولویت دانلود قرار دهد.
📈 نتیجه قابل توجه بود. سهم فروشگاه‌هایی که LCP مناسبی داشتند از ۵۷٪ به ۹۶٪ رسید و نرخ قبولی Core Web Vitals هم از ۴۸٪ به ۷۲٪ افزایش پیدا کرد.
📝 پس اگر هر کاری برای بهبود LCP انجام می‌دهید اما نتیجه نمی‌گیرید قبل از هر چیز بررسی کنید مرورگر دقیقا کدام المان را به عنوان LCP تشخیص داده است.
‼️ گاهی مشکل از تصاویر یا سرور نیست. مشکل این است که مرورگر و شما روی دو المان متفاوت تمرکز کرده‌اید.