Enkode gambar secara efisien

Bagian Peluang dalam laporan Lighthouse Anda mencantumkan semua gambar yang tidak dioptimalkan, dengan potensi penghematan dalam kibibyte (KiB). Optimalkan gambar ini agar halaman dimuat lebih cepat dan menghabiskan lebih sedikit data:

Screenshot audit Encode gambar secara efisien di Lighthouse

Cara Lighthouse menandai gambar sebagai dapat dioptimalkan

Lighthouse mengumpulkan semua gambar JPEG atau BMP di halaman, menyetel tingkat kompresi setiap gambar ke 85, lalu membandingkan versi asli dengan versi yang dikompresi. Jika potensi penghematan adalah 4 KiB atau lebih, Lighthouse akan menandai gambar sebagai dapat dioptimalkan.

Cara mengoptimalkan gambar

Ada banyak langkah yang dapat Anda lakukan untuk mengoptimalkan gambar, termasuk:

Mengoptimalkan gambar menggunakan alat GUI

Pendekatan lain adalah menjalankan gambar melalui pengoptimal yang Anda instal di komputer dan jalankan sebagai GUI. Misalnya, dengan ImageOptim, Anda menarik lalu melepas gambar ke UI-nya, lalu ImageOptim akan otomatis mengompresi gambar tanpa mengurangi kualitasnya secara signifikan. Jika Anda menjalankan situs kecil dan dapat menangani pengoptimalan semua gambar secara manual, opsi ini mungkin sudah cukup.

Squoosh adalah opsi lainnya. Squoosh dikelola oleh tim Google Web DevRel.

Panduan khusus stack

Drupal

Sebaiknya gunakan modul yang otomatis mengoptimalkan dan mengurangi ukuran gambar yang diupload melalui situs dengan tetap mempertahankan kualitas. Selain itu, pastikan Anda menggunakan Responsive Image Styles native yang disediakan dari Drupal untuk semua gambar yang dirender di situs.

Joomla

Sebaiknya gunakan plugin pengoptimalan gambar yang mengompresi gambar Anda dengan tetap mempertahankan kualitas.

Magento

Sebaiknya gunakan ekstensi Magento pihak ketiga yang mengoptimalkan gambar.

WordPress

Sebaiknya gunakan plugin WordPress untuk pengoptimalan gambar yang mengompresi gambar Anda dengan tetap mempertahankan kualitas.

Resource