Salam Ngerapik Blog, apa kabar hari ini teman teman blogger semoga selalu sehat, amiin. Kali ini saya akan membahas tentang Loging Blog, dikarenakan banyaknya memasang widget animasi keren seperti efek hujan matrix dan hujan hujan laiinya, jam analog, atau hiasan bergerak di blog saya membuat loading saat membuka terasa berat dab lama. Memang bikin tampilan blog menjadi lebih jadi unik dan beda dari yang lain. Tapi, dibalik itu terbyata ada harga mahal yang harus dibayar: blog saya menjadi sangat lemot saat dibuka!
Untuk megatasinya saya menanyakan masalah ini ke Mode Ai Google yang pintar dan ada solusinya teman teman dan work, sekarang lumayan blog saya tidak terlalu lemot dan ada smooth gambarnya terasa saat di gulirkan. Apabila teman teman mau mempraktekan untuk blog kesayangannya silahkan baca ulasan artikel dibawah ini, cekidot wae..
Blog yang lambat adalah musuh utama pengunjung dan juga Google AdSense. Berdasarkan data dari Google Analytics, blog yang butuh waktu lebih dari 3 detik untuk terbuka biasanya akan langsung ditinggalkan pembaca. Akibatnya, rasio pantulan (bounce rate) blog kita akan melonjak tinggi.
Lalu, apakah kita harus menghapus semua animasi kesayangan tersebut? Belum tentu! Dalam panduan ini, kita akan membahas trik rahasia cara mempercepat loading Blogspot kita tanpa harus mematikan semua widget animasi.
1. Gunakan Teknik Lazy Load untuk Skrip Animasi
Penyebab blog macet saat pertama kali dibuka adalah karena browser dipaksa memuat seluruh kode animasi JavaScript di awal. Solusinya adalah menggunakan teknik Lazy Load.
Teknik ini membuat widget animasi teman teman baru akan dimuat (load) setelah pengunjung menggulir layar ke bawah atau setelah halaman utama selesai terbuka sempurna. Teman teman blogger bisa mencari skrip lazyload.js khusus Blogger yang banyak dibagikan secara gratis untuk menunda pemuatan widget yang berat.
2. Pindahkan Kode JavaScript ke Bagian Bawah Template
Banyak tutorial salah kaprah yang menyuruh kita menempelkan kode widget animasi di bawah kode <head>. Ini salah besar karena akan menahan teks artikel muncul sebelum animasi selesai dimuat (render-blocking).
Cara yang benar:
- Masuk ke Blogger > Tema > Edit HTML.
- Cari kode
</body>(biasanya berada di bagian paling bawah template). - Pindahkan semua kode JavaScript animasi widget kita di mode edit html template tepat di atas baris
</body>tersebut.
Dengan cara ini, artikel blog teman teman akan muncul secepat pitaran gasing..wkwk, baru kemudian disusul oleh efek animasinya.
3. Batasi Jumlah Animasi (Maksimal 1 atau 2 Saja)
Kita harus realistis. Jika blog kita dipasang efek animasi hujan, kursor bertabur bintang, musik otomatis, sekaligus jam dinding bergerak secara bersamaan, perangkat HP pengunjung yang spesifikasinya rendah bisa langsung macet total (lag).
Pilihlah satu animasi yang paling ikonik dan menjadi ciri khas blog kita. Hapus sisanya. Estetika itu penting, namun kenyamanan membaca pengunjung jauh lebih utama.
4. Kompres Semua Gambar dan Gunakan Format WebP
Jika widget animasi kita menggunakan aset gambar (misalnya animasi ikon bergerak), pastikan ukuran gambar tersebut sangat kecil.
- Jangan gunakan format GIF jika ukurannya terlalu besar.
- Kompres gambar teman teman menggunakan alat gratis seperti TinyPNG sebelum diunggah.
- Jika memungkinkan, ubah format gambar menjadi WebP yang ukurannya 3 kali lebih ringan dari JPG atau PNG tetapi tetap tajam.
5. Bersihkan Kode CSS yang Tidak Terpakai
Widget animasi sering kali membawa kode gaya (CSS) bawaan yang panjang. Jika kita mengganti-ganti widget, pastikan kode lama yang sudah tidak terpakai dihapus dari dalam HTML template kita agar tidak menjadi sampah digital yang memperberat kinerja blog.
Adalah cara yang lebih Effiesien dan Mudah?
Jika teman teman blogger takut atau malas membongkar kode HTML template karena takut blog berantakan, teman teman bisa menggunakan fitur Tata Letak (Layout) bawaan Blogger. Cara ini 100% aman dan hanya perlu klik-geser saja! (ini khusus dalam kondisi template yang sudah suport mode geser dan pindah widger ya..)
Cara Paling Mudah: Geser Posisi Widget ke Bagian Footer
Secara sistem, browser akan membaca isi blog kita dari atas ke bawah. Jika widget animasi diletakkan di bagian atas (Header atau Sidebar atas), blog otomatis akan terasa lemot. Solusi mudahnya adalah menggesernya ke bawah:
- Masuk ke dashboard Blogger, lalu klik menu Tata Letak (Layout) di bilah kiri.
- Cari kotak widget animasi Anda (biasanya berupa gadget bernama HTML/JavaScript).
- Klik, tahan, lalu seret (drag & drop) kotak widget tersebut ke posisi paling bawah blog, yaitu di bagian Footer (Kaki Halaman).
- Klik ikon Simpan (gambar disket) di pojok kanan bawah halaman.
Dengan trik sederhana ini, teks artikel blog kita akan muncul duluan secepat kilat, sementara widget animasi baru akan dimuat belakangan setelah pengunjung menggulir layar ke bawah. Pengunjung senang, Google AdSense pun menyukai blog yang responsif seperti ini cena!
Tips Tambahan: Sembunyikan Widget Sementara Waktu
Jika teman teman ingin mengetes apakah blog teman teman sudah cukup cepat tanpa harus menghapus kode animasi, gunakan fitur nonaktifkan sementara:
- Di menu Tata Letak, klik tombol Edit (ikon pensil) pada widget animasi teman teman.
- Matikan tombol opsi "Tampilkan Widget ini" hingga warnanya berubah menjadi abu-abu.
- Klik Simpan.
Sekarang teman teman bisa mengecek kecepatan blog teman teman kembali. Jika terbukti jauh lebih cepat, berarti teman teman tahu widget mana yang harus dikurangi kodenya demi kenyamanan pembaca dam pengunjung blog.
Kesimpulan
Memiliki blog yang cantik dengan animasi menarik itu sah-sah saja, asalkan kita tahu cara mengoptimalkan kode, posisi dan fungsinya. Dengan memindahkan posisi skrip kode ke bawah (di atas </body>) dan membatasi jumlah widget, blog kita dijamin 100% kan tetap terasa ringan, cepat, dan disukai oleh robot peninjau Google AdSense.
Coba praktikkan trik di atas sekarang, lalu lakukan tes kecepatan blog teman teman semua di Google PageSpeed Insights. Jika ada langkah yang membuat template teman teman eror, jangan ragu untuk menuliskan kendala nya ya di kolom komentar di bawah! Mari kita diskusikan bersama, agar menjadi pengalaman yang baik dan berguna untuk para pengguna blogger terutama menggunakan platform Blogspot. Akhir kata saya ucapakan Salam Ngerapik Blog!