Wordpress Lazy Load Eklentisi

WPCİNWordpress HızlandırmaYorum Yaz

Google PageSpeed Insights hız testi aracında web sitenizi test ederken şu hatayı almış olabilirsiniz. “Ekran dışındaki resimleri ertele” (Offscreen Images).

Alt açıklama olarak ise “Etkileşimli hale gelme süresini kısaltmak için ekran dışındaki ve gizli resimleri, tüm kritik kaynakların yüklenmesi bittikten sonra gecikmeli olarak yükleme seçeneğini değerlendirin.” yazmakta.

Bu uyarının açıklamasını şöyle yapabiliriz; herhangi bir websiteye girdikten sonra karşınıza gelen belirli ölçüde bir görüntü vardır. Bu görüntü genellikle şunlardan oluşur, logo, menüler ve makale başlığı. Siteden siteye değişiklik göstermekle birlikte genelde bu şekilde karşılaşırız.

Makalenin geri kalanını görmek için aşağı inmemiz gerekir. Makalenin içerisinde veya altında bulunan resimleri, ancak aşağı inersek görürüz. O halde, bu siteye giriş yaptıktan sonra makale içerisinde bulunan resimleri siteye giriş yaparken yüklemenin bir anlamı yok.

İşte Google’ın anlatmak istediği de bu. Görseller, yük bakımından websiteniz de en çok yer alan nesnelerdir. O halde görsellerin yüklenme işlemini ertelersek, websitemizi ilk açışımızda sunucuya binen istek sayısı azalacak ve websitemiz daha hızlı açılacaktır. Aynı yöntemi Css ve Js dosyalarınız için de kullanabilirsiniz. Bunun için Oluşturmayı Önleyen JavaScript ve CSS Kodlarını Kaldırma konumuza göz atabilirsiniz.

Peki görselleri nasıl erteleyeceğiz? Bunun için sizin yerinize bu işi yapacak Lazy Load (Tembel Yük) sisteminden ve eklentilerinden faydalanacağız.

Lazy Load Nedir?

Lazy Load kısaca ekranın alt kısmında görünen içeriğin indirilmesini ve oluşturulmasını geciktiren bir optimizasyon tekniğidir.

Lazy Load Nasıl Çalışır?

  • Tarayıcılar, görselleri ve videoları indirmeden önce web sayfasına istek gönderir.
  • JavaScript, hangi resimlerin indirileceğini ve hangi videoların önceden yükleneceğini belirlemek için kullanılır. Bu görüntüler ve videolar indirilir ve uygun şekilde önceden yüklenir.
  • Diğer görsellerin indirilmesi ve görüntülenmesi, bir site ziyaretçisi sayfayı aşağı kaydırıp içerik görüntülenene kadar ertelenir.

Sonuçta, görüntüler gerçekten indirilmeden yüklenemez. Bu, çok sayıda yüksek çözünürlüklü görüntü ve gömülü video içeren siteler için performansta önemli bir artış sağlayabilir.

Lazy Load Eklentisinin Avantajı

Lazy Load eklentisi temel avantajı zaten bellidir; Daha hızlı yükleme süreleri. Sayfa ağırlığınızın büyük bir bölümünü ortadan kaldırabildiğiniz için doğal olarak tarayıcıda çok daha hızlı görünecektir.

Bunun güzel bir yan etkisi de ziyaretçilerinizi kayda değer bir bant genişliğinden kurtarmanızdır. Özellikle mobil cihazlarında veri bağlantısını kullananlar size borçlu olacaktır 🙂

Lazy Load Eklentisinin Dezavantajı

Siteniz hızlı yüklendiği için sayfalarınızı çok hızlı bir şekilde aşağı kaydırırken, görselleriniz hemen yüklenmeyeceği için, sayfa içeriğinin farklı görünmesine sebep olur, bu da can sıkıcı olabilir.

WordPress Lazy Load Eklentileri

Lazy Load tekniğini WordPress’e manuel olarak eklemek mümkün olsa da daha kolay olan alternatif, aşağıdaki eklentilerden birini kullanmaktır.

WordPress eklenti dizininde görüntülerin ve videoların yüklenmesini ertelemek için kullanılabilecek birçok ücretsiz eklenti var. Fakat biz bunlar arasında ki en iyi eklentileri seçip sunucağız.

1. Lazy Load by WP Rocket

Wprocket Lazy Load

WpRocket Lazy Load eklentisi, bir web sayfasındaki görüntüleri yalnızca ziyaretçiler tarafından görülebildiklerinde gösteren ücretsiz bir eklentidir. Bu, HTTP istekleri mekanizmasının azalmasına ve dolayısıyla yükleme süresinin iyileştirilmesine neden olur.

Lazy Load eklentisi bir yazıdaki resimlerde, avatarlarda, iframe’lerde ve gülen yüzlerde çalışıyor. Ayrıca, web sitesinin yükleme süresini daha da hızlandırabilmeniz için Youtube iframe’lerini önizleme küçük resmiyle değiştirmenize olanak tanır.

2. a3 Lazy Load Eklentisi

a3 Lazy Load

a3 Lazy Load, en iyi Lazy Load eklentilerinden biri. Eklenti, yazılardaki, sayfalardaki, widget’lardaki, videolar ve iframe’ler, küçük resimlerdeki ve avatarlardaki tembel yükleme görüntüleri için uygun. Aynı zamanda WooCommerce ile uyumlu.

a3 Lazy Load, komut dosyasını headera mı, footera mı yükleneceğine ve istediğiniz görüntüleri veya videoları yoksaymayı seçmenize izin verir.

3. Lazy Loader

Wordpress Lazy Load

Lazy Loader, görüntülerin, videoların, ses öğelerinin ve iFrame’lerin tembel yüklenmesini de destekleyen bir başka basit WordPress Lazy Load eklentisidir. Hafif bir komut dosyası kullanır. Ayrıca, işaretlemenin manuel olarak değiştirilmesiyle arka plan resimlerinin, stillerin ve komut dosyalarının tembel yüklenmesini sağlar.

4. Zedna Lazy Load Eklentisi

Zedna Lazy Load

Zedna, CSS arka plan resimlerini destekliyor. WordPress için görüntüleri aşamalı olarak yükleyerek sayfa yükleme süresini çok azaltır. Ayrıca CSS arka plan görüntülerini de tembel olarak yükleyebilir. Bu eklenti aynı zamanda Visual Composer ile de uyumludur ve bazı özel sınıflardaki elemanları atlamayı seçmenize izin veriyor.

5. JCH Optimize

JCH Optimize

JCH Optimize eklentisi sadece lazy load tekniği için yapılmamış. Ayrıca web sitenizin hızını artıran ve birçok optimizasyon seçeneği sunan özellik dolu bir eklenti. Toplam HTTP isteklerini azaltmak için CSS / JS dosyalarını birleştirir ve ayrıca HTML’nizi küçültür.

Yukarıda sıraladığımız eklentilerden herhangi birini rahatlıkla kullanabilirsiniz. Böylece Google PagesPeed aracındaki “ekran dışındaki resimleri ertele” uyarısı da kalkmış olacaktır. Bu uyarıdan ziyade, websiteniz hızlanacak ve kullanıcılarınız için daha iyi bir deneyim sunmuş olacaksınız.

Benzer Yazılar

WordPress Sunucu Yanıt Süresini Kısaltın Neredeyse tüm WordPress kullanıcılarının yaşadığı en büyük endişelerden biri, web sitesinin daha hızlı çalışmasını sağlamaktır. Aslında, sunucu yanıt ...
Site Açılış Hızını Arttırmak İçin Ücretsiz Bir Yol: PHP 7 Bana bazı sorular geliyor. "Her şeyi yaptım, resimleri sıkıştırdım, dosyaları sıkıştırdım, temayı değiştirdim vs. ama sitemin açılış süresi halen 3 sa...
Google PageSpeed Web Yazı Tipi Yüklemesi Sorunu Çözümü Web sitenizi Google PageSpeed Insights hız testi aracında test ederken genellikle şu hata alınmakta: "Web yazı tipi yüklemesi sırasında metnin görünü...
WordPress Hızlandırma Yolları Site açılış hızını arttırma için çeşitli optimizasyon yöntemleri kullanmak gerekir. WordPress çok hafif bir sistem, ancak doğru şekilde optimize edilm...

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir