LCP, bir sayfanın görünür alanındaki en büyük içerik öğesinin (genellikle ana görsel ya da başlık bloğu) ekranda tam olarak belirmesine kadar geçen süredir; kullanıcının sayfanın yüklendiğini hissettiği anı ölçer.
LCP, Core Web Vitals metriklerinden ilkidir ve algılanan yükleme hızını ölçer. Tarayıcı, sayfa açılırken görünür alandaki en büyük görsel ya da metin bloğunu izler ve bu öğenin tamamen çizildiği anı kaydeder. Bu an, kullanıcının sayfa geldi dediği andır; sayfanın alt kısımlarının ya da arka plandaki kodların yüklenmesi ölçüme dahil değildir. Google'ın yayınladığı eşiğe göre 2,5 saniyenin altındaki LCP değerleri iyi kabul edilir. Metrik gerçek kullanıcıların cihazlarından toplanır; bu nedenle aynı sayfa hızlı bir bilgisayarda iyi, ortalama bir telefonda kötü çıkabilir.
İşletme sahibi için neden önemli
Ziyaretçi, boş ya da yarım bir ekrana bakarak beklerken karar verir: kalır ya da geri tuşuna basar. LCP, bu bekleme hissinin en yakın sayısal karşılığıdır. Reklam bütçesiyle getirilen bir ziyaretçinin ana görsel yüklenmeden ayrılması, doğrudan para kaybıdır. LCP çoğunlukla birkaç teknik nedene bağlıdır: yavaş sunucu yanıtı, sıkıştırılmamış büyük görseller, ana görselin geç keşfedilmesi ve çizimi engelleyen CSS ya da JavaScript dosyaları. Bunların her biri ölçülebilir ve düzeltilebilir.
Örnek
Bir mutfak dolabı üreticisinin ana sayfasında, tam ekran bir vitrin fotoğrafı bulunuyor. Fotoğraf 4 MB boyutunda ve orijinal çözünürlükte yükleniyor; ayrıca bir kaydırıcı eklentisi görseli ancak kendi kodu çalıştıktan sonra istiyor. Görsel modern formata çevrilip ekran boyutuna göre birkaç sürüm hazırlandığında ve HTML içinde öncelikli olarak işaretlendiğinde, mobil LCP değeri eşiğin altına iniyor.
Sık yapılan hata
En büyük öğenin ne olduğunu bilmeden genel hız iyileştirmesi yapmaktır. LCP öğesi sayfa tipine göre değişir: ana sayfada vitrin görseli, blog yazısında başlık, ürün sayfasında ürün fotoğrafı olabilir. İkinci hata, ana görsele lazy loading uygulamaktır; görünür alandaki görsel ertelenmemelidir. Üçüncüsü, bir kaydırıcı ya da video arka planı için tüm sayfayı ağır bir JavaScript kütüphanesine bağlamaktır.
Teklif alırken sorulacak soru
Her sayfa tipi için LCP öğesi belirlenip ona göre optimizasyon yapılacak mı? Görseller hangi formatta, hangi boyutlarda sunulacak ve ana görsel öncelikli yükleme ile işaretlenecek mi?
Sık sorulanlar
LCP değerimi nasıl öğrenirim?
PageSpeed Insights'a sayfa adresini yazdığınızda hem gerçek kullanıcı verisini hem laboratuvar sonucunu görürsünüz. Search Console ise sitenin tüm sayfalarını gruplayarak gösterir.
Sunucu değiştirmek LCP'yi düzeltir mi?
Yalnızca sorun sunucu yanıt süresinden kaynaklanıyorsa. Görsel boyutu ya da çizimi engelleyen kod kaynaklı bir LCP sorununu sunucu değişikliği çözmez.
