Bagaimana Mengoptimalkan Gambar di WordPress?

Diterbitkan: 2021-09-08

Gambar adalah bagian penting dari situs web apa pun. Mereka dapat digunakan untuk menciptakan suasana hati, memamerkan produk, atau menambahkan minat visual ke halaman. Namun terkadang Anda mungkin tidak memiliki gambar terbaik untuk situs Anda yang akan membuatnya terlihat terbaik.

Untungnya, WordPress memiliki beberapa fitur bawaan yang akan membantu mengoptimalkan gambar sehingga memuat lebih cepat dan menggunakan lebih sedikit ruang di situs Anda tanpa mengurangi kualitas!


Temukan Gambar yang Tidak Dioptimalkan Di GTmetrix + PSI

Cara terbaik untuk menemukan gambar yang perlu dioptimalkan di situs Anda adalah dengan menggunakan alat online gratis, seperti GTmetrix atau PSI. Kedua alat ini merayapi file situs web Anda dan memberi Anda laporan yang mudah dipahami tentang apa yang perlu dioptimalkan agar memuat lebih cepat.

Beranda GT Metrix

Optimalkan Gambar Menggunakan Plugin + Layanan WordPress

Ada juga beberapa plugin pengoptimalan gambar WordPress di luar sana (berbayar dan gratis), seperti EWWW Image Optimizer, yang bekerja sangat baik dalam mengompresi gambar agar dimuat lebih cepat di situs web Anda.

Ada juga layanan di luar sana yang akan melakukan ini untuk Anda, seperti TinyPNG dan Kraken Image Optimizer, yang mengompresi gambar tanpa mempengaruhi kualitas sama sekali.

Tautan unduhan pengoptimal gambar

Gunakan Ukuran Gambar yang Benar

Sama seperti Anda harus mengubah ukuran grafik, video, dan media lain untuk lebar blog di editor WordPress sebelum mengunggahnya, Anda juga perlu memastikan bahwa file gambar juga diubah ukurannya. Melakukan hal ini memastikan bahwa tidak ada gambar Anda yang akan memakan lebih banyak ruang daripada yang seharusnya!

seseorang mengubah ukuran gambar

Gambar Tembolok

Cara lain untuk mengoptimalkan gambar adalah dengan menyimpannya. Ini memastikan bahwa situs Anda akan memuat lebih cepat bahkan jika banyak orang mengunjunginya pada saat yang bersamaan, karena pengunjung yang datang ke halaman dengan gambar yang di-cache di dalamnya tidak perlu menunggu file tersebut diunduh sebelum mereka dapat melihat apa pun!

Plugin WP Smush sebenarnya melakukan ini secara otomatis setelah Anda menginstal dan mengaktifkannya (dan Anda harus melakukan kedua hal ini!). Anda juga dapat menggunakan plugin, seperti Autoptimize atau Wp Super Cache, yang tidak hanya men-cache tetapi juga mengecilkan kode.

Plugin WP Super Cache

Gunakan LazyLoad untuk Menunda Gambar di Luar Layar

LazyLoad adalah fitur yang lebih baru dan kurang dikenal di WordPress yang memungkinkan Anda menunda pemuatan gambar hingga pengguna menggulir ke posisinya di situs Anda. Ketika mereka melakukannya, gambar-gambar ini kemudian akan dimuat dengan cepat karena mereka tidak dimuat saat halaman pertama kali diambil!

seseorang dengan wajah setengah buram

Gunakan Kompresi Gambar

Anda dapat menggunakan dua jenis kompresi gambar yang berbeda: LZW atau JPEG. Perbedaan di antara mereka lebih berkaitan dengan jenis file grafik apa yang akan digunakan daripada apa pun, jadi pilihlah yang mana yang masuk akal untuk situasi Anda!

Cara kerjanya adalah dengan mengurangi jumlah warna yang digunakan dalam gambar yang berarti lebih sedikit data yang perlu ditransfer dari sisi server ke sisi klien selama penelusuran. Ini mengurangi penggunaan bandwidth serta waktu buka.

Kompresi Gambar adalah bagian penting dari situs mana pun, dan WordPress memiliki sejumlah plugin kompresi yang akan mempermudah pembuatan situs dengan gambar berkualitas tinggi tanpa mengurangi kinerja!

optimasi gambar di photoshop

Sajikan Gambar Dalam Format Generasi Berikutnya

Penting untuk disadari bahwa ada banyak format gambar yang berbeda di luar sana, dan tidak semuanya akan berfungsi dengan baik untuk situs Anda. Jika Anda ingin meningkatkan kinerja di situs web apa pun, Anda perlu menggunakan format generasi berikutnya, seperti WebP atau JPEG XR, yang biasanya memiliki kompresi yang lebih baik daripada jenis lainnya.


Tentukan Dimensi Gambar

Dengan menentukan dimensi gambar, Anda memberi tahu WordPress berapa banyak ruang yang harus digunakan saat menempatkannya di situs Anda. Ini penting karena mengurangi beban bandwidth, yang berarti waktu buka halaman lebih cepat!


Sajikan Gambar dari CDN

CDN adalah cara cepat dan efisien untuk menyajikan gambar situs web Anda dari server yang secara geografis lebih dekat. Ini mengurangi latensi, yang berarti waktu muat lebih cepat bagi pengguna!


Gabungkan Gambar Menggunakan CSS Sprite

CSS Sprite adalah jenis gambar yang sebenarnya menggabungkan semua gambar kecil Anda menjadi satu file besar. Ini berguna karena mengurangi jumlah permintaan file, yang berarti waktu muat lebih cepat – terutama di perangkat seluler! Anda dapat menggunakan generator sprite CSS untuk membuatnya dan kemudian menambahkannya ke tema Anda dengan CSS.


Gunakan Gambar Adaptif untuk Seluler

Gambar adaptif adalah cara yang bagus untuk menyajikan ukuran gambar yang berbeda untuk pengguna di perangkat yang berbeda. Ini mengurangi penggunaan bandwidth dan waktu muat! Anda dapat melakukan ini dengan plugin WordPress, tetapi ada juga banyak cara lain untuk melakukannya sendiri secara gratis.

Perangkat Seluler

Nonaktifkan Tautan Panas Gambar

Saat Anda menautkan gambar, pada dasarnya yang Anda lakukan adalah menautkan ke file asli di server orang lain. Menonaktifkan ini menghentikan orang dari mencuri bandwidth Anda, jadi itu adalah sesuatu yang ingin Anda lakukan.

Anda dapat melakukan ini dengan banyak plugin WordPress, seperti WP Rocket. Anda biasanya juga dapat meminta tuan rumah untuk melakukan ini untuk Anda (jika Anda bersama tuan rumah yang baik).


Hapus Data EXIF

Data EXIF ​​​​adalah informasi tersembunyi yang tidak dapat Anda lihat di editor WordPress Anda, tetapi dapat dilihat oleh orang lain. Ini berisi info seperti merek dan model kamera serta pengaturan tanggal dan waktunya. Menghapus ini akan mengurangi penggunaan bandwidth!

Proses ini melibatkan penggunaan alat penggosok gambar seperti JPEGsnoop atau jhead, yang memungkinkan Anda menghapus semua data EXIF ​​dari gambar di situs Anda – tanpa harus mengunduhnya terlebih dahulu!


Sajikan Gambar Berkualitas Lebih Rendah Kepada Pengguna Pada Koneksi Lambat

Ini adalah sesuatu yang dapat Anda lakukan dengan gambar Anda, tetapi tidak setiap tema memiliki opsi untuk menyembunyikannya. Pada dasarnya apa yang dilakukannya adalah menyajikan gambar berkualitas rendah kepada orang-orang dengan koneksi lambat (seluler atau lainnya). Anda dapat melakukan ini dengan plugin Optimole.

kura-kura di atas pasir

Mengapa Penting untuk Menggunakan Gambar yang Dioptimalkan?

Gambar dapat menjadi bagian besar dari kinerja situs Anda, jadi penting untuk mengoptimalkannya! Ini akan memastikan bahwa gambar dimuat secepat dan seefisien mungkin.

Semakin cepat situs web Anda dimuat, semakin baik bagi pengguna dan mesin pencari! Waktu pemuatan baru-baru ini diberi bobot lebih dalam peringkat Google (tetapi hanya sedikit), tetapi meskipun ini tidak benar, Anda masih ingin memastikan semuanya dimuat secepat mungkin.

Orang tidak suka menunggu di situs, terutama pengguna seluler – yang menjadikan pengoptimalan gambar sebagai bagian penting dari situs WordPress mana pun. Ini juga membantu dengan SEO karena Google juga menyukai situs web yang memuat cepat (untuk alasan yang bagus).

SEO Dipahami dengan seni dinding keramik

Kesimpulan

Kesimpulannya, gambar adalah bagian penting dari situs web mana pun. Mereka dapat digunakan untuk menciptakan suasana hati, memamerkan produk, atau menambahkan minat visual ke halaman.

Namun, terkadang gambar asli mungkin tidak dioptimalkan dengan cukup baik dan dapat menghabiskan lebih banyak ruang daripada yang diperlukan. WordPress memiliki sejumlah fitur untuk mengoptimalkan file-file ini sehingga memuat lebih cepat tanpa mengurangi kualitas! Cara terbaik adalah dengan memasang plugin kompresi gambar, seperti LazyLoad atau PSI, yang secara otomatis akan mengompresi dan mengubah ukuran gambar Anda jika diperlukan. Anda juga dapat mengoptimalkan gambar dengan menentukan dimensinya, menggunakan sprite CSS, menggunakan cache gambar, dan