Cara Lazy Load Gambar di WordPress

Cara Lazy Load Gambar di WordPress

Apakah anda ingin mengetahui cara melakukan lazy load gambar di WordPress?

Lazy load memungkinkan website anda hanya memuat gambar ketika pengguna menggulir ke bawah pada gambar tertentu, sehingga mengurangi waktu buka dan meningkatkan kinerja website.

Saat ini sudah banyak situs populer yang menggunakan gambar berukuran besar sudah menggunakan lazy load untuk meningkatkan kecepatan dan kinerja situs.

Pada artikel ini, kami akan menunjukkan cara mudah memuat gambar di WordPress.

Alasan Melakukan Lazy Load Gambar di WordPress

Dengan lazy load gambar WordPress anda dapat mempercepat website sehingga bisa membuat pengalaman pengguna menjadi lebih baik.

Tentunya ini sangat mendukung sekali, karena para pengunjung tidak menyukai website yang lambat. Hal ini dibuktikan pada sebuah studi kinerja yang menghasilkan penundaan satu detik waktu buka halaman menghasilkan 7% lebih sedikit konversi, 11% lebih sedikit tampilan halaman, dan 16% penurunan kepuasan pelanggan.

Bahkan mesin pencari Google juga tidak menyukai website yang dimuat dengan lambat. Inilah sebabnya banyak situs yang memiliki waktu buka lebih cepat bisa mendapatkan peringkat lebih tinggi dalam hasil pencarian.

Cara kerja lazy load ini hanya mengunduh gambar yang terlihat di layar pengguna, dan tidak memuat seluruh gambar sekaligus yang dapat memberatkan loading halaman.

Saat pengguna menggulir ke bawah, website akan memuat gambar yang terlihat di area tampilan browser.

Catatan: Meskipun lazy load akan membantu meningkatkan kecepatan pemuatan website, anda harus tetap mengoptimalkan gambar untuk website sebelum mengunggahnya ke WordPress untuk mendapatkan kinerja maksimal.

Metode 1: Lazy Load Images di WordPress Dengan WP Rocket

Kami merekomendasikan menggunakan plugin WP Rocket untuk memuat gambar dengan lambat di WordPress. Ini adalah plugin caching WordPress terbaik dan memungkinkan anda dengan mudah mengaktifkan lazy load gambar.

Selain itu, ini adalah plugin powerfull yang dapat membantu dalam mengoptimalkan kecepatan website tanpa pengetahuan teknis yang rumit.

Langsung dari dalam dasbor, semua pangaturan caching default yang direkomendasikan sangat berguna untuk mempercepat situs WordPress anda.

Untuk mengaktifkan lazy load gambar, yang harus anda lakukan adalah mencentang beberapa kotak. Anda bahkan dapat mengaktifkan lazy load ini untuk video.

WP Rocket lazy load gambar

Metode 2: Lazy Load Gambar di WordPress Dengan Optimole

Metode ini menggunakan plugin Optimole versi gratis dengan fitur yang terbatas. Jika dan memiliki pengunjung lebih dari 5.000 perbulan, maka anda memerlukan versi premium. Ini adalah salah satu plugin kompresi gambar WordPress terbaik dan memungkinkan anda untuk dengan mudah mengaktifkan lazy load gambar.

Pertama yang perlu anda lakukan adalah menginstal dan mengaktifkan plugin.

Setelah aktivasi, buka Media > Optimole dan kemudian anda perlu mendaftar untuk mendapatkan kunci API.

Mendaftar untuk kunci API

Cukup masukkan email yang anda miliki, kemudian klik Send me the API key dan email yang berisi API akan segera dikirim.

Periksa email anda, setelah itu salin dan masukkan kunci API yang anda dapatkan melalui email ke kolom ‘Add your API Key’ dan klik Connect to Optimole.

Masukkan kunci API Optimole

Setelah itu, klik tab ‘Settings’.

Disini anda dapat melihat pengaturan, ‘Scale images & Lazy load’ diaktifkan. Ini akan menghasilkan gambar berdasarkan ukuran layar pengunjung dan meningkatkan kecepatan pemuatan.

Pengaturan lazy load

Selanjutnya, klik menu Advanced dan pilih Lazyload.

Di halaman ini, ada beberapa pengaturan berbeda yang memungkinkan anda menyesuaikan bagaimana gambar akan dimuat dengan lambat.

Pertama, anda dapat menyesuaikan pengaturan ‘Exclude first X of images from lazyload’. Ini akan menghentikan gambar di bagian atas postingan atau halaman dari proses lazy loading, sehingga gambar di setengah bagian atas akan selalu muncul.

Kecualikan gambar untuk lazy load

Anda dapat mengatur ini ke 0 jika anda ingin setiap gambar dimuat dengan lambat.

Selanjutnya, anda dapat mengaktifkan ‘Sclale Images’.

Aktifkan Scale Image

Ini akan menskalakan gambar ke ukuran layar pengunjung dan membuat halaman anda dimuat lebih cepat.

Setelah itu, anda dapat mengaktifkan pengaturan ‘Enable lazyload for background images’.

Lazy load gambar di latar belakang

Ini akan memuat gambar di latar belakang, yang memperkecil gambar besar di website anda.

Pengaturan lain yang dapat anda aktifkan adalah lazy loading untuk video dan iframe yang disematkan. Jika anda memiliki banyak konten video yang disematkan, sebaiknya aktifkan setelan ini.

Lazy load video

Ini akan memuat gambar placeholder sebagai pengganti video. Saat diklik, video penuh akan dimuat.

Anda dapat lebih menyesuaikan pengaturan ini dan melihat apa yang terbaik untuk website dan gambar.

Sebelum anda menutup halaman pengaturan plugin, pastikan untuk mengklik tombol Save Changes.

Kami harap artikel ini membantu anda mempelajari cara melakukan lazy loading gambar di WordPress. Jika anda masih memiliki pertanyaan terkait panduan ini, silahkan tinggalkan pada kolom komentar di bawah.

Komentar

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments