Blogger Görseller İçin Lazy Load | E L M A

Blogger Görseller İçin Lazy Load

Blogger Görseller İçin Lazy Load


Blogger görseller için lazy load eklentisi sayesinde blog hızını arttırabilirsiniz. Blogunuza eklediğiniz resimler ziyaretçinin ekranına geldiği zaman görünü olacaktır. Görseller için lazy load kurulumuna geçmeden önce site hızınızı pagespeed ile test edebilirsiniz.

Google aramalarda sıralamada daha üst sıralarda yer almak isteyenler tabiki seo uyumlu olması gerekmektedir. Seo uyumlu bir site için önemli seo kriterleri arasında site yüklenme süresinde önemli seo kriterleri arasında yer almaktadır.

Blogger sitenizi daha üst sırada görmek için sizde blogunuzu pagespeed aracılığı ile test edin ve blogunuzun açılış hızına olumsuz etki eden etkenleri tespit edebilirsiniz.

Blogunuzda resim kullanıyor iseniz resimlerinizi blog hızınızı düşürmemesi için resim sıkıştırma veya görsellerin boyutunu küçültme gibi işlemler yapılsa da yeterinde blog hızını artırmaya yardımcı olmayabiliyor. Blogger sitenizde görseller için lazy load ile site hızına olumlu hız artışı sağlanabilir.

Blogger görseller için lazy load kullanmadan önce bir test edin siteyi eğer "Ekran dışındaki resimleri ertele" gibi bir uyarı var ise bu eklenti tam size göre olacaktır. Görseller için lazy load ise ekran dışındaki resimleri erteleyecek ve site açılış hızınız artacaktır.

Blogger Siteniz İçin Görselleri Tembel Yükleme Kodları

Blogger Görseller için lazy load eklenti kodlarını </body> etiketinin hemen üstüne ekleyiniz.

<script type='text/javascript'>//<![CDATA[ (function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"http://i22.servimg.com/u/f22/15/42/72/40/grey10.gif",effect:"fadeIn",threshold:"-50"})})//]]></script>{codeBox}

Kodları blogger sitenize ekledikten sonra pagespeed testinde artık ekran dışındaki resimleri ertele uyarısı kalkmış olacaktır. Görseller için eklediğiniz lazy load ile blog hızınızda artış sağlanacaktır.

Resimler için kullanacağınız lazy load eklentisi site hızınızı olumlu yönde etkileyecek ve daha iyi bir sıralama kazanmanıza yaracaktır. Blogunuza ekleyeceğiniz eklenti ekranda olmayan görselleri yüklemediğini unutmayın. Yani görünmeyen alan yüklenmeyecek görünen alanda görseller yüklenecektir.

Ekran dışındaki resimleri erteleme işlemi yaptığınız için resimleri optimize etmekten vazgeçmeyin. Büyük boyutlu ve kilobaytı fazla olan görselleri sıkıştırın ve uygun biçimde ayarlayınız. Ayrıca sitenizde reklam yayınlayarak para kazanıyor iseniz adsense lazy load ile site hızınızı artırabilirsiniz.

Blogger resimler için lazy load eklentisi sizi tatmin eden bir hıza kavuşturmadı ise iyi optimize edilmiş bir tema kullanabilirsiniz. Blogger sitelerde tema değiştirmek oldukça basit seo uyumlu, hızlı, kaliteli tema ihtiyacınız var ise ücretsiz blogger temaları arasında blogunuz için uygun bir tasarıma geçebilirsiniz.

Yorum Gönder

Daha yeniDaha eski