Tutorial

Gambar WEBP : Format Baru Pengganti JPG dan PNG

Pendahuluan

Pasti anda pernah menjelajahi sebuah website yang memiliki banyak file gambar didalamnya. Web tentang makanan atau tentang fotografi misalnya. Dimana web tersebut dapat berisi banyak file gambar dalam kualitas HD (High Definition). Lalu,apa perbedaan paling mencolok dibanding anda menjelajahi web yang mayoritas hanya berisi file teks saja, wikipedia misalnya?

Ya, perbedaan paling tampak dari web tersebut adalah performa loadingnya. Loading halaman yang mayoritas hanya berisi teks, akan lebih cepat dibanding dengan web yang berisi banyak file gambar. Hal tersebut terjadi karena transfer data dari website yang hanya berisi file teks lebih sedikit daripada web yang berisi banyak file gambar didalamnya.

Mayoritas web developer tidak akan meletakkan file gambar sesuai size aslinya pada halaman web. Sehingga, gambar tersebut di resize terlebih dahulu sebelum di upload di halaman web. Rata-rata ukuran gambar berformat JPG atau PNG dengan resolusi sebesar 1200×1200 piksel adalah sebesar 200kb. Dan itu masih bisa membengkak lagi seiring banyaknya warna pada gambar tersebut.

Bayangkan saja, jika dalam satu halaman web terdapat 10 file gambar dengan ukuran 200 kb. maka transfer data tersebut menghabiskan 2000kb atau 2 mb data hanya untuk me-load gambar saja. Belum lagi elemen lain seperti css, script, video, widget dsb. Oleh karena itu, proses kompresi gambar menjadi sangat penting dalam membangun sebuah halaman web.

Apa Itu Format WEBP

Webp adalah format gambar yang pertama kali di release dan dikembangkan oleh google pada tahun 2010. Format tersebut mendukung dua encoding gambar sekaligus yaitu format lossless dan lossy, sehingga membuat format WebP dapat digunakan diberbagai media visual. Serta menjadikannya sebagai format alternatif pengganti JPEG dan PNG.

Baca Juga :   Cara Mengatasi Windows Cannot be Installed to This Disk (MBR/GPT)

Menurut sang developer (red:google), webp dapat memiliki ukuran 26% lebih kecil dari format PNG dan 25-34% lebih kecil dari format JPEG dengan kualitas gambar yang sama. Berikut adalah perbandingan file WEBP, JPG dan PNG.

detail-jpg
jpg size 19kb
detail-png
png size 112kb
detail-webp
webp size 6kb

Pada gambar diatas, kualitas gambarnya hampir sama. Akan tetapi, kapasitas ukuran gambarnya lah yang berbeda. Format JPEG di kolom sebelah kiri memiliki ukuran sebesar 19kb. Format PNG dibagian tengah memiliki ukuran sebesar 112kb. Sedangkan format WEBP pada kolom sebelah kanan hanya memiliki ukuran sebesar 6kb. Tidak begitu buruk bukan, melihat perbandingan kualitas gambar yang hampir sama.

Nah, dengan menggunakan gambar berformat webp, seorang web developer dapat membuat gambar berkualitas sama dengan format JPEG dan PNG akan tetapi dengan ukuran yang lebih kecil, sehingga membuat web buatannya memiliki performa lebih cepat.

Dukungan Web Browser Terhadap Format WEBP

Nah, karena format webp masih tergolong asing,  apakah semua web browser sekarang sudah mendukung file format tersebut? Jawabannya adalah tidak. Meskipun format webp merupakan besutan perusahaan raksasa google, nyatanya sampai artikel ini ditulis, masih ada 4 web browser yang belum mendukung format webp. Berikut tabel lengkapnya.

Browser Support
Browser yang telah support format webp per April 2020

Penting diketahui bahwa format webp bukanlah pengganti format jpeg dan png. Format webp hanya dapat dipergunakan pada web yang sedang anda kembangkan. Selain itu, karena masih ada web browser yang belum support format webp, maka anda tetap harus menyimpan file format jpeg atau png untuk mengakomodir user yang menggunakan web browser yang masih belum support format webp.

Show More
Rekomendasi Untuk Anda

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button

Matikan Adblock !!!

Untuk melanjutkan, silahkan matikan adblock anda terlebih dahulu. Atau masukkan website ini kedalam whitelist anda. Kami memberi garansi, bahwa tidak ada malware di semua iklan yang tayang dalam website ini. Dengan menonaktifkan adblock pada situs ini, anda telah membantu kami agar terus semangat menulis artikel bermanfaat. Terima kasih.