komputerdia.com - Loading blog atau kecepatan untuk merespon halaman suatu blog merupakan salah satu faktor yang cukup utama semoga blog yang kita kelola sanggup menjadi blog yang yang SEO dan user friendly. Kecepatan loading blog juga menjadi salah satu faktor yang sangat menghipnotis akan hadirnya visitor.
Jika respon loading yang diberikan blog kita sangat buruk, maka tentu juga hasil yang didapatkan juga akan buruk. Untuk itu, kecepatan loading suatu blog itu sangatlah penting.
Dalam tutorial kali ini saya akan menjelaskan beberapa point penting semoga kecepatan loading kalian menjai lebih maksimal, dan tentunya akan sanggup menarik visitor-visitor gres serta sanggup menciptakan pengunjung menjadi betah berlama-lama di blog kalian untuk melaksanakan ekplorasi isi konten yang sudah kalian buat
Baca Juga Artikel Lainnya :
- Cara Membuat Multi Tab Sidebar Responsive Di Blogger
- Cara Memasang Kode Agar Konten atau Artikel Blog Tidak Bisa Di Copy Paste
- Cara Direct atau Meneruskan Page Not Found 404 Ke Halaman Lain
Langkah Dasar Mempercepat Loading Blog
- Sebelum kalian melaksanakan "operasi" blog semoga lebih ringan dalam hal loading, silahkan kalian cek nilai kecepatan blog kalian di GTmetrix, atau juga di Google Page insight jika kesannya masih jelek silahkan kalian lakukan langkah - langkah dibawah ini
- Langkah pertama (1) yang sanggup kalian lakukan yaitu dengan memasang script LazyLoad, silahkan copy dan tempelkan aba-aba dibawah ini sempurna diatas aba-aba </body>
<script type='text/j4vascript'> //<;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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO1_rDjOZbO0K_YqEQL1LxxCjksNSPCp5OxacEu9kCkrd4-stkrfK4nXD3uFdC0uwNZ5FRfoEtMouPjsCPI6nyUEOsqH5VMWp34J6LjWMQtEzqsBmQSdjnqZAeHOvdcVgIELuYiX8PUkHs/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})}); //]]> </script> - Langkah ke dua (2), silahkan kalian cari kode <b:template-skin> atau aba-aba <b:template-skin><![CDATA[ .Jika di dalam template blog kalian tidak terdapat aba-aba menyerupai itu, silahkan lewati langkah kedua ini.
- Jika terdapat aba-aba tersebut diatas, silahkan kalian copy aba-aba yang terdapat didalam tag tersebut hingga batas ]]></b:template-skin>, lalu tempelkan aba-aba yang di kopi tersebut diatas aba-aba ]]></b:skin> atau </style>.
- Setelah aba-aba tersebut dipindahkan, silahkan kalian hapus kode <b:template-skin><![CDATA[ dan kode ]]></b:template-skin>. Ilustrasi gambar sanggup kalian lihat menyerupai dibawah ini
- Langkah Ke tiga (3), silahkan ganti aba-aba <head> dengan aba-aba dibawah ini
<head>
- Langkah ke empat (4), silahkan kalian ganti aba-aba </head> dengan aba-aba dibawah ini
</head><!--<head/>-->
- Langkah ke lima (5), silahkan kalian ganti aba-aba <html> atau <html . . . . . . . . .> dengan aba-aba dibawah ini
<HTML expr:dir='data:blog.languageDirection'>
- Langkah ke enam (6), silahkan kalian ganti aba-aba </html> dengan aba-aba dibawah ini
</HTML>
- Langkah Ke tujuh (7) jika kalian memakai widget facebook fanpage, silahkan kalian hapus widget tersebut
- Langkah Ke delapan (8) jika kalian memakai widget Histats, silahkan kalian hapus widget histats tersebut
- Langkah ke sembilan (9) jika kalian memakai widget DMCA Protected, silahkan kalian hapus widget tersebut
- Langkah ke sepuluh (10) silahkan kalian cari kode <script type="text/j4vascript"....../> , lalu kalian sisipkan kode async='async' disetiap baris aba-aba yang dicari diatas, sehingga format aba-aba tersebut menjadi menyerupai dibawah ini
<script async='async' type="text/j4vascript" src=" . . . . . . . "/> - Langkah Ke sebelas (11) kalian hapus fitur widget post by label, alasannya yaitu fitur ini memakai script pemanggilan feed yang akan memberatkan loading blog. Contoh fitur widget post by label ini yaitu menyerupai berikut
- Langkah Ke duabelas (12) silahkan kalian copy dan tempelkan aba-aba dibawah ini sempurna diatas aba-aba </head> atau <head>
<!-- Cache --> <meta content='public' http-equiv='Cache-control'/> <meta content='private' http-equiv='Cache-control'/> <meta content='no-cache' http-equiv='Cache-control'/> <meta content='no-store' http-equiv='Cache-control'/> <!-- Cache --> <include expiration='7d' path='*.css'/> <include expiration='7d' path='*.js'/> <include expiration='7d' path='*.gif'/> <include expiration='7d' path='*.jpeg'/> <include expiration='7d' path='*.jpg'/> <include expiration='7d' path='*.png'/> <meta content='sat, 01 mar 2100 00:00:00 GMT' http-equiv='expires'/>
- Langkah Ke tigabelas (13) silahkan kalian copy dan tempelkan aba-aba dibawah ini sempurna diatas kode </head> atau <head>
<link href='//1.bp.blogspot.com' rel='dns-prefetch'/> <link href='//28.2bp.blogspot.com' rel='dns-prefetch'/> <link href='//3.bp.blogspot.com' rel='dns-prefetch'/> <link href='//4.bp.blogspot.com' rel='dns-prefetch'/> <link href='//2.bp.blogspot.com' rel='dns-prefetch'/> <link href='//www.blogger.com' rel='dns-prefetch'/> <link href='//maxcdn.bootstrapcdn.com' rel='dns-prefetch'/> <link href='//fonts.googleapis.com' rel='dns-prefetch'/> <link href='//use.fontawesome.com' rel='dns-prefetch'/> <link href='//ajax.googleapis.com' rel='dns-prefetch'/> <link href='//resources.blogblog.com' rel='dns-prefetch'/> <link href='//www.facebook.com' rel='dns-prefetch'/> <link href='//plus.google.com' rel='dns-prefetch'/> <link href='//twitter.com' rel='dns-prefetch'/> <link href='//www.youtube.com' rel='dns-prefetch'/> <link href='//feedburner.google.com' rel='dns-prefetch'/> <link href='//www.pinterest.com' rel='dns-prefetch'/> <link href='//www.linkedin.com' rel='dns-prefetch'/> <link href='//feeds.feedburner.com' rel='dns-prefetch'/> <link href='//github.com' rel='dns-prefetch'/> <link href='//player.vimeo.com' rel='dns-prefetch'/> <link href='//platform.twitter.com' rel='dns-prefetch'/> <link href='//apis.google.com' rel='dns-prefetch'/> <link href='//connect.facebook.net' rel='dns-prefetch'/> <link href='//cdnjs.cloudflare.com' rel='dns-prefetch'/> <link href='//www.google-analytics.com' rel='dns-prefetch'/> <link href='//pagead2.googlesyndication.com' rel='dns-prefetch'/> <link href='//googleads.g.doubleclick.net' rel='dns-prefetch'/> <link href='//www.gstatic.com' rel='preconnect'/> <link href='//www.googletagservices.com' rel='dns-prefetch'/> <link href='//static.xx.fbcdn.net' rel='dns-prefetch'/> <link href='//tpc.googlesyndication.com' rel='dns-prefetch'/> <link href='//syndication.twitter.com' rel='dns-prefetch'/> <include expiration='7d' path='*.css'/> <include expiration='7d' path='*.js'/> <include expiration='3d' path='*.gif'/> <include expiration='3d' path='*.jpeg'/> <include expiration='3d' path='*.jpg'/> <include expiration='3d' path='*.png'/>
 |
| Hasil Test Dari GTmetrix |
 |
| Hasil Test Dari Google Page Insight |
Mempercepat Blog Dengan Lazy Load Adsense
Hal paling utama yang memperngaruhi loading blog atau situs menjadi usang yakni dengan adanya script dari iklan adsense. Jika pada situs atau blog kalian sudah terpasang iklan adsense, maka sebaiknya kalian gunakan meningkatkan secara optimal loading berikut ini.
- Lagkah pertama silahkan kalian masuk ke sajian Edit HTML, lalu cari aba-aba dibawah ini dengan cara menekan tombol CTRL+F
</body> atau <!--</body>--></body> - Setelah aba-aba diatas di temukan, langkah selanjutnya silahkan kalian copy aba-aba dibawah ini dan letakkan sebelum aba-aba diatas ( </body>)
<script type='text/j4vascript'> //<![CDATA[ // Lazy Load AdSense var lazyadsense=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyadsense||0!=document.body.scrollTop&&!1===lazyadsense)&&(!function(){var e=document.createElement("script");e.type="text/j4vascript",e.async=!0,e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyadsense=!0)},!0); //]]> </script> - Langkah selanjutnya silahkan kalian hapus semua aba-aba berikut ini
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
- Tahap ini sudah selesai
Mempercepat Blog Dengan Lazy Load Script
- Silahkan kalian masuk ke akun blogger kalian, lalu masuk ke sajian Tema dan pilih Edit Html
- Cari aba-aba </body>, dan silahkan copy aba-aba dibawah ini dan simpan sempurna diatas aba-aba body
<script type='text/j4vascript'> //<;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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO1_rDjOZbO0K_YqEQL1LxxCjksNSPCp5OxacEu9kCkrd4-stkrfK4nXD3uFdC0uwNZ5FRfoEtMouPjsCPI6nyUEOsqH5VMWp34J6LjWMQtEzqsBmQSdjnqZAeHOvdcVgIELuYiX8PUkHs/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})}); //]]> </script> - Selesai, dan semoga bermanfaat untuk kalian semuanya