Sayılarla ne demek?
Tembel yükleme, sayfadaki görsellerin hepsini baştan indirmek yerine, yalnızca kullanıcının görmek üzere olduklarını yüklemektir. 60 ürünlük bir kategori sayfasında ilk ekranda 6 ürün görünür; kalan 54 ürün görseli kullanıcı aşağı kaydırdıkça indirilir. Böylece ilk yükte indirilen veri ve istek sayısı büyük ölçüde azalır.
Bugün tembel yükleme için JavaScript kütüphanesine gerek yoktur. Görsel ve iframe etiketlerine eklenen loading="lazy" özniteliği bütün güncel tarayıcılarda desteklenir ve tarayıcı yükleme zamanını kendisi belirler. Özel davranış gerekiyorsa IntersectionObserver ile yapılan uygulamalar da arama motorlarıyla uyumludur; eski tip kaydırma olayına bağlı betikler ise risklidir.
En sık hata, tembel yüklemenin her görsele uygulanmasıdır; bu, görsel optimizasyonunda en çok ters tepen adımdır. İlk ekrandaki ana görsel tembel yüklenirse tarayıcı onu geç keşfeder ve LCP birkaç yüz milisaniye, hatta saniyeler uzayabilir. Doğru kural basittir: ilk ekranda görünen görseller normal ve gerekirse fetchpriority="high" ile, ekran dışındakiler tembel yüklenir.
Tembel yükleme karar tablosu
| Öğe | Tembel yükleme? | Not |
|---|---|---|
| İlk ekrandaki ana görsel (LCP) | Hayır | fetchpriority="high" düşünülebilir |
| İlk ekrandaki logo ve küçük simgeler | Hayır | Hemen görünmeli |
| Ekran dışındaki ürün görselleri | Evet | width/height ile yer ayrılmalı |
| Gömülü video ve haritalar (iframe) | Evet | Büyük kazanç sağlar |
| Sayfanın altındaki yorum ve öneri blokları | Evet | İçerik HTML'de olmalı |
Tembel yüklenen her görsele boyut verilmezse, yüklendiğinde yer açar ve düzen kayması yaratır.
Tembel yükleme uygularken
- İlk ekran görsellerini ayır. Şablon bazında hangi görseller görünür?
- Yerel özniteliği kullan. loading="lazy".
- Boyut ver. width ve height ya da aspect-ratio.
- Görsel adresini HTML'de tut. src ya da srcset içinde.
- İşlenmiş sayfayı kontrol et. URL denetiminde görseller görünüyor mu?
Uygulamada ne oluyor?
En sık durum, temanın bütün görsellere loading="lazy" eklemesi. Ana görsel de tembel yükleniyor ve LCP gereksiz yere uzuyor.
İkinci gözlem, eski kaydırma tabanlı betikler. Görseller yalnızca kaydırma olayında yükleniyor; Googlebot kaydırmadığı için görselleri görmüyor.
Üçüncüsü, görsel adresinin data-src gibi özel bir öznitelikte saklanması. JavaScript çalışmazsa ya da geç çalışırsa görsel hiç yüklenmiyor; görsel aramada sayfa zayıf kalıyor.
Dördüncüsü, tembel yüklenen görsellerin boyutsuz olması. Kullanıcı kaydırdıkça görseller yer açıyor, CLS puanı yükseliyor ve içerik zıplıyor.
Beşincisi, metin içeriğinin de tembel yüklenmesi. Ürün açıklamaları ve yorumlar kullanıcı kaydırınca API'den geliyor; bu içerik dizine eklenmekte zorlanıyor.
Altıncısı, gömülü videoların tembel yüklenmemesi. Sayfanın en altındaki bir video oynatıcı, ilk yükte megabaytlarca JavaScript indiriyor ve INP değerini bozuyor.
Yedincisi, bulanık yer tutucuların ağırlaşması. Her görsel için ayrıca büyük bir önizleme dosyası yükleniyor; kazanç kısmen kayboluyor.
Sekizincisi, sonsuz kaydırmayla tembel yüklemenin karıştırılması. Görsellerin tembel yüklenmesi sorun değil; asıl sorun ürünlerin kendisinin adres üretmeden yüklenmesi ve bu fark görülmüyor.
Dokuzuncusu, yavaş bağlantılarda görsellerin geç gelmesi. Kullanıcı hızlı kaydırdığında boş kutular görüyor; tarayıcının yerel eşik mesafesi çoğu durumda bunu dengeliyor.
Onuncusu, arka plan görsellerinin tembel yüklenememesi. CSS arka planları loading özniteliğini desteklemiyor; önemli görseller için img etiketi daha uygun.
On birincisi, mobil ve masaüstünde ilk ekranın farklı olması. Masaüstünde ilk ekranda olan görsel mobilde ekran dışında; şablon tek bir kuralla iki durumu karşılayamıyor.
On ikincisi, kazancın ölçülmemesi. Tembel yükleme sonrası sayfa ağırlığı ve LCP karşılaştırılmıyor; değişikliğin yardımcı mı zararlı mı olduğu bilinmiyor.
Neyi çözmez?
Tembel yükleme, büyük ve optimize edilmemiş görselleri küçültmez. Görseller yine WebP gibi modern formatlarla doğru boyut ve formatta hazırlanmalıdır.
Sıkça sorulan sorular
Lazy load SEO'ya zarar verir mi?
Doğru uygulandığında hayır; kaydırma olayına bağlı ya da görsel adresini gizleyen uygulamalar sorun yaratabilir.
LCP görseli tembel yüklenmeli mi?
Hayır; ilk ekrandaki ana görsel öncelikli yüklenmelidir.
JavaScript kütüphanesi gerekli mi?
Çoğu durumda hayır; loading="lazy" özniteliği bütün güncel tarayıcılarda desteklenir.
Bu kavramın bütün resim içindeki yerini SEO Danışmanlığı Rehberi içinde ayrıntılı anlattım.
Teknik SEO, içerik stratejisi, kategori mimarisi, otorite ve organik trafiği dönüşüme çeviren bütünsel SEO danışmanlığı.
