Baru

recent

Percepat Performa Website Dengan Format Gambar Webp

Percepat Performa Website Dengan Format Gambar Webp

Rumahit.ID - WebP adalah salah satu dari "generasi berikutnya" dari format gambar yang mencakup JPEG XR dan JPEG 2000. Format tersebut relevan seiring zaman berubah. GIF keluar di ‘87, diikuti oleh standar JPEG pertama di ‘92, dan kemudian PNG menjadi Rekomendasi W3C di ‘96. Di sini kita berada tiga puluh tahun kemudian - dan dunia digital kita tidak seperti dulu. Kita memiliki banyak situs web, blog dan halaman web yang tak terhitung jumlahnya, toko online bermunculan sepanjang waktu. Jadi untuk tetap menjadi yang terdepan dalam mengikuti perkembangan website, ada baiknya menggunakan format gambar modern ini dengan kemampuan kompresi yang unggul.

Apa itu WebP?

WebP adalah format gambar (saat ini dikembangkan oleh Google) yang memungkinkan ukuran file yang lebih kecil dengan tetap menjaga kualitas gambar. Blogger, perancang web, dan pengembang situs dapat menggunakan WebP pada JPEG, gambar grafis dan transparan untuk meningkatkan kecepatan situs web secara signifikan. Bagaimana? Semakin sedikit kilobyte yang dimiliki gambar, semakin cepat memuat saat pengguna mengeklik laman, dan semakin menyenangkan menjelajahi situs Anda.

Saat ini, browser web umum seperti Google Chrome (versi desktop dan Android), Firefox, Microsoft Edge dan Opera mendukung WebP. Cukup nyaman, pengembang telah membuatnya kompatibel dengan berbagai alat pengeditan gambar seperti Photoshop, serta alat untuk mengkonversi, menyesuaikan dan melihat gambar WebP.


Biasanya gambar WebP mengalami kompresi lossy atau lossless, dengan masing-masing jenis memiliki kelebihan dan kekurangan sendiri.

Percepat Performa Website Dengan Format Gambar Webp
Image : Seomelbourne

WebP "Lossy" Compression (Kehilangan Kualitas)

Kompresi lossy menghasilkan gambar di mana data cukup banyak dalam posisi perkiraan yang sama seperti aslinya. Ukuran file turun jauh lebih banyak daripada kompresi lossless. Gambar yang hilang sekitar 25-34% lebih kecil dari gambar JPEG yang sebanding berdasarkan indeks kualitas SSIM yang setara. Demi kecepatan situs, hal itu pasti berguna.

Apa sisi baiknya? Gambar kompresi yang hilang cenderung kehilangan kualitasnya karena ukurannya yang lebih kecil. Mereka juga rentan terhadap "kehilangan generasi", yang berarti bahwa setiap kali Anda mengkompres ulang gambar yang sama dalam mode lossy, itu menjadi semakin tidak dapat dikenali.

Namun, Anda dapat menyesuaikan kompresi gambar yang hilang dengan cara yang cukup kecil namun tetap kaya kualitas. Dan untungnya, file WebP memiliki kompresi rata-rata 30% lebih tinggi dari pada file JPEG atau JPEG 2000 yang setara.

WebP "Lossless" Compression (Tanpa Kehilangan Kualitas)

Sedangkan  kompresi lossless sama sekali berbeda. Bertujuan untuk mendekati posisi data, lossless menggunakan pencocokan tepat untuk menempatkan semua titik data di tempat masing-masing dan tepat. Lossless melibatkan  fragmen gambar yang sudah terlihat untuk dapat mereplikasi piksel baru. Lossless menghasilkan gambar yang tidak mengorbankan kualitas pasca kompresi, tetapi dengan ukuran yang jauh lebih besar daripada file kompresi yang hilang.

Beberapa Website yang Menggunakan Format Gambar WebP

WebP masih memiliki cara yang cukup untuk masuk pasar, dan tidak semua browser web mendukungnya (belum). Namun, Anda akan terkejut dengan jumlah perusahaan teknologi yang telah belajar untuk menerimanya. Jelas ada Google, dan pada kenyataannya, Anda cenderung menemukan gambar WebP saat melihat gambar mini di YouTube atau saat menjelajahi Google Play store. Di antara nama-nama besar lainnya adalah Netflix, Yahoo, Amazon, Ebay, Pinterest dan Walmart. Bahkan The Verge membuat situsnya memuat sebanyak 3 detik lebih cepat dengan hanya beralih sebagian ke WebP.

Kompresi mana yang paling cocok untuk gambar di situs seluler Anda?

Lossy. Jawabannya di sini sebenarnya tidak mengejutkan. Tentu, gambar kompresi lossless terlihat lebih baik dari pada lossy. Tetapi ketika tujuan Anda adalah untuk meningkatkan lalu lintas situs web Anda dan membuat pengunjung Anda tetap terlibat, hal terakhir yang Anda inginkan adalah memberi pengguna alasan untuk menjadi tidak sabar dan frustrasi ketika menjelajah situs itu sendiri.

Dan sebenarnya seberapa besar perbedaan kualitas ketika orang melihat, atau menggulir sebagian besar gambar di smartphone mereka? Tidak banyak - kecuali jika mereka memutuskan untuk memperbesar tentu saja (di situlah JPEG berguna untuk gambar produk). Tapi secara umum, ini soal efisiensi dari pada kualitas. Jadi lossy adalah pilihan terbaik Anda.

Percepat Performa Website Dengan Format Gambar Webp

Browser Tidak Mendukung WebP? Gunakan Java Decoder

Jika Anda berada dalam situasi yang tidak mungkin menggunakan browser situs web dengan gambar WebP yang masih tidak kompatibel, inilah hal yang harus Anda ketahui. Format WebP sebenarnya memiliki decoder Java, yang dapat Anda jalankan di browser apa pun yang telah mengaktifkan Java sebagai cara untuk melihat apa yang konten WebP yang tidak dapat dilihat.

Kesimpulan Mengenai Format Gambar WebP


  1. Gambar WebP selalu berukuran lebih kecil dari JPEG, PNG, dan GIF tetapi kualitas gambar tetap konsisten.
  2. Gambar WebP serba guna karena mereka berbagi kemampuan JPEG, PNG, dan GIF dalam satu format tunggal. Anda dapat mengonversi PNG, GIF, atau JPEG apa pun menjadi WebP yang sering berfungsi sebagai pengganti konten web yang baik.
  3. Kompresi WebP yang hilang menghasilkan gambar yang sebanding dengan JPEG, kecuali ukurannya 25-34% lebih kecil. Ini mendukung transparansi (saluran alpha), tidak seperti format JPEG.
  4. Kompresi WebP lossless menghasilkan gambar yang mirip dengan PNG, tetapi ukurannya 26% lebih kecil. Ini juga mendukung transparansi, meskipun dengan tambahan 22% byte.
  5. Kecuali jika Anda benar-benar membutuhkan gambar berkualitas tinggi, pilih kompresi lossy daripada lossless ketika datang ke gambar situs seluler Anda. Ukuran file yang lebih besar cenderung membuat memuat situs web lebih lambat dari biasanya. Juga, mereka berpotensi menghambat server Anda.

No comments:

Powered By Blogger

Contact Form

Name

Email *

Message *

Powered by Blogger.