Nov 18, 2012

Cara Mempercepat Loading Blog

Hy sahabat Didin blog ? kali ini saya share Percepat Loading Blog dengan Plugin Lazyload.ok langsung saya ke tutorialnya
Jika kalian mengunjungi Google untuk mencari gambar, mungkin kalian akan menemui situasi semacam ini saat hasil penelusuran gambar ditampilkan:

Lazyload pada Google
Halaman Penelusuran Gambar Google

Itu adalah salah satu sistem Google untuk mempercepat muat situsnya walau dengan hasil temuan gambar yang begitu banyak. Setiap gambar yang masih berada di bawah layar (sebut saja begitu) tidak akan diakses, melainkan hanya akan digantikan dengan sebuah gambar kelabu.

Sampai sesaat kemudian layar dinaikkan dan gambar-gambar kelabu di bawahnya muncul, gambar-gambar kelabu itupun akan menghilang lalu mengizinkan sistem untuk mengakses gambar aslinya. Dan, ya, itu adalah sistem Google yang sempat membuat Saya sangat terkesan.

Dengan cara ini, maka kita tidak perlu lagi mengeklik tautan Halaman Sebelumnya atauHalaman Berikutnya, kita cukup menggulung layarnya saja ke atas dan gambar-gambar di halaman sebelumnyapun masih tetap ada pada tempatnya. Tidak perlu membolak-balik halaman, dan tentu saja itu akan lebih menghemat waktu dan biaya.

Kamu juga bisa menerapkan sistem ini dalam blogmu. Diutamakan untuk blog-blog yang memiliki begitu banyak gambar dalam satu halaman.

Percaya tidak percaya, sistem ini hanya melibatkan JQuery!
Masuk ke tab Rancangan, kemudian pilih Edit HTML.
Pertama-tama, pastikan dulu bahwa blogmu sudah dilengkapi dengan JQuery:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
Jika belum ada, salinlah script tersebut, kemudian letakkan di atas kode </head>
Setelah itu salin juga kode ini, lalu letakkan tepat di bawah script tadi:
<script src='http://reader-download.googlecode.com/svn/trunk/lazyload.js' type='text/javascript'></script><script type='text/javascript'>$(function() {$('img').lazyload({ placeholder : "http://2.bp.blogspot.com/-sJ-tZahntLI/T9coeqmdqMI/AAAAAAAADUQ/ztxIT1Fht4g/s1600/grey.png", effect : "fadeIn", threshold : 500 });});</script>
Klik Simpan Template dan selesai sudah.

Kalian lihat URL gambar yang Saya beri tanda itu? Itu adalah gambar kelabu yang Saya maksud. Coba saja akses URL tersebut, Saya jamin kalian tidak akan mememukan apapun kecuali hanya sebuah titik kelabu. Ya, itu adalah gambarnya. Ukurannya hanya 1 × 1 piksel, jadi tidak akan memberatkan.

Source

Bagikan

Jangan lewatkan

Cara Mempercepat Loading Blog
4/ 5
Oleh

Subscribe via email

Suka dengan artikel di atas? Tambahkan email Anda untuk berlangganan.

Silahkan berkomentar Dengan Sopan dan Tidak Spam

Anda Juga Dapat Meninggalkan Link Aktif Di Dalam Komentar Tapi Jika Link Mengandung Unsur Porno , Terpaksa Saya HAPUS !

THANKs