Kecepatan loading juga menambah SEO sebuah blog, disini saya akan membahas cara mempercepat loading blog dengan lazy load, dimana cara ini akan menambah kecepatan blog hingga 99% di Google Page Speed.
Apa Itu Google Page Speed ?
Google Page Speed adalah sebuah tools yang disediakan oleh google untuk mengecek kecepatan sebuah situs.
Selain Google Page Speed ada 1 tools lagi yang sering digunakan oleh para blogger untuk mengecek kecepatan blog mereka yaitu GTmetrix.
Meskipun kedua situs di atas sama-sama berfungsi untuk mengecek kecepatan situs, namun hasil laporan kecepatannya bisa berbeda, saya pribadi lebih suka menggunakan Google Page Speed.
Cara mempercepat loading blog ini work pada semua template blogger.
Daftar Isi :
Cara Mempercepat Loading Blog Blogspot
Cara mempercepat loading blog ini hanya berlaku bagi pengguna blog platform Blogspot dan tidak berlaku bagi pengguna blog WordPress.
Menambahkan Lazy Load Untuk Iklan Adsense
Kecepatan blog sebelum ada iklan dan setelah ada iklan akan berbeda, blog yang di pasang iklan kecepatannya akan berkurang hingga 50%.
Meskipun adsense dapat memperlambat loading blog, namun kode iklan harus tetap di pasang, agar bisa menghasilkan uang dari blog.
Agar iklan adsense tidak memperlambat kecepatan loading blog, maka kita perlu memasang kode lazy load untuk iklan adsense dan ini bisa digunakan pada semua template yang belum memberikan lazy load untuk iklan adsense.
Memasang Kode Lazy Load Untuk Adsense
Kode lazy load di bawah ini harus anda tempel pada template atau tema blog anda.
<script>
//<![CDATA[
var lazyadsense = false;
window.addEventListener("scroll", function(){
if ((document.documentElement.scrollTop != 0 && lazyadsense === false) || (document.body.scrollTop != 0 && lazyadsense === false)) {
(function() { var ad = document.createElement('script'); ad.type = 'text/javascript'; ad.async = true; ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'; var sc = document.getElementsByTagName('script')[0]; sc.parentNode.insertBefore(ad, sc); })();
lazyadsense = true;
}
}, true)
//]]>
</script>- Pada Blogger Pilih Tema
- Pilih Edit HTML
- Cari Tag </body> Dengan Cara Menekan CTRL + F
- Tempelkan Kode Lazy Load Adsense Di Atas Tag </body>
- Simpan
Cara kerja lazy load untuk iklan adsense adalah, iklan hanya ditampilkan jika pengunjung melakukan scrol ke bawah.
Menambahkan Lazy Load Untuk Gambar
Selain iklan, gambar juga dapat memperlambat loading blog, apalagi gambar tersebut tidak di kompress sebelum di posting.
Memasang Kode Lazy Load Gambar
<script async='async'>
//<;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:"https://4.bp.blogspot.com/-oA8G9t61JXk/VtLrtkAzObI/AAAAAAAAFTY/EjT6jl2MEFM/s1600/bloggersstand.gif",effect:"fadeIn",threshold:"-50"})});//]]>
</script>- Masuk Ke Tema Blogger
- Pilih Edit HTML
- Cari Tag </body>
- Tempel Kode Lazy Load Gambar Di Atas Tag </body>
- Simpan
Setelah memasang kode lazy load iklan adsense dan kode lazy load gambar, silahkan periksa kembali kecepatan blog anda menggunakan Google Page Speed atau Gtmatrix.
