Konverter Gambar

Memilih di antara tiga format

PNG bersifat lossless. Setiap piksel kembali persis seperti aslinya, mendukung transparansi alpha penuh, dan memampatkan area warna datar dengan sangat baik. Karena itu PNG tepat untuk tangkapan layar, diagram, logo, gambar garis, apa pun yang berisi teks, dan apa pun yang memerlukan transparansi. PNG kurang cocok untuk foto, karena kompresi lossless hanya menemukan sedikit yang bisa dibuang dan file-nya jadi beberapa kali lebih besar dari yang diperlukan.

JPG bersifat lossy dan dibuat untuk foto. JPG membuang detail yang sulit ditangkap mata, terutama variasi warna yang halus, dan mampu memperkecil gambar bernada kontinu secara besar-besaran. JPG sama sekali tidak mendukung transparansi, dan buruk dalam menangani tepi yang tajam - teks dan gambar garis dalam JPG akan memiliki pinggiran kabur yang terlihat, yang tidak bisa dihilangkan sepenuhnya oleh pengaturan kualitas apa pun.

WebP bisa keduanya. WebP lossy biasanya 25-35% lebih kecil daripada JPG dengan kualitas setara, WebP lossless mengalahkan PNG sekitar seperempat, dan tidak seperti JPG, WebP mendukung transparansi. Kini semua browser mendukungnya, dan alasan utama yang tersisa untuk memilih JPG adalah sebagian perangkat lunak desktop lama dan alur kerja cetak masih belum menerima WebP.

Apa yang dilakukan penggeser kualitas

JPG dan WebP lossy bekerja dengan mentransformasi gambar per blok, lalu mengkuantisasi hasilnya - menyimpan struktur kasarnya secara tepat dan detail halusnya secara perkiraan. Angka kualitas mengatur seberapa agresif pembulatan itu dilakukan. Angka ini bukan persentase dari apa pun, dan angka yang sama bermakna berbeda di encoder yang berbeda.

Dalam praktiknya rentang yang berguna itu sempit. Di atas sekitar 90, ukuran file naik cepat demi perbedaan yang hampir tidak terlihat siapa pun. Di bawah sekitar 60, artefaknya menjadi jelas: kotak-kotak di gradasi halus seperti langit, dan riak di sekitar tepi yang tajam. Nilai antara 75 dan 85 biasanya titik terbaik untuk foto di web, dan cara yang tepat untuk memilih adalah membandingkan hasilnya dengan aslinya dalam ukuran penuh, bukan memercayai angkanya.

Hal lain yang perlu diketahui adalah generation loss. Setiap kali di-encode ulang secara lossy, sedikit lagi informasi yang dibuang, dan kerugiannya menumpuk - JPG yang dibuka, disunting sedikit, lalu disimpan sepuluh kali akan terlihat menurun kualitasnya. Selalu encode ulang dari file asli, bukan dari hasil ekspor sebelumnya, dan simpan master lossless jika gambarnya akan direvisi.

Apa yang hilang saat di-encode ulang

Konversi mendekode gambar menjadi piksel lalu menulis file baru dari piksel tersebut, sehingga semua yang berupa metadata, bukan data gambar, akan dibuang: EXIF, termasuk model kamera, lensa, waktu pengambilan, dan koordinat GPS; keterangan dan kolom hak cipta IPTC; thumbnail; serta riwayat penyuntingan yang disisipkan perangkat lunak asalnya.

Biasanya ini justru menguntungkan. Foto langsung dari ponsel umumnya membawa koordinat persis lokasi pengambilannya, dan menghapusnya sebelum diunggah ke publik adalah kebiasaan yang bijak. Tetapi ini merugikan jika Anda memerlukan kolom hak cipta atau tanggal pengambilan, jadi simpan file aslinya jika salah satunya penting.

Ada satu kasus yang perlu diperhatikan. Penanda orientasi dibaca dan diterapkan sebelum di-encode ulang, sehingga foto potret yang tampil miring di sebagian penampil akan keluar dalam posisi tegak yang benar. Tetapi profil warna ICC yang tertanam tidak ikut terbawa, dan foto di ruang warna gamut lebar seperti Display P3 akan sedikit bergeser warnanya saat diperlakukan sebagai sRGB. Untuk gambar web biasa ini tidak terlihat; untuk pekerjaan yang sangat bergantung pada akurasi warna, konversi dengan alat yang mengelola profil warna.

Yang tidak bisa dilakukan konversi

Mengonversi ke format lossless tidak memulihkan apa pun. JPG yang disimpan sebagai PNG tetap membawa semua artefak yang sudah ada di JPG, hanya saja disimpan tanpa kehilangan lebih lanjut, dalam file yang jauh lebih besar. Jika gambar sudah melewati kompresi berat, kerusakan itu kini ada di pikselnya.

Mengganti format juga tidak mengurangi dimensi. Foto 4000 piksel yang dikonversi ke WebP tetap selebar 4000 piksel; jika tujuannya file lebih kecil untuk halaman web, mengubah ukurannya ke ukuran tampil sebenarnya menghemat jauh lebih banyak daripada memilih format apa pun. Kedua operasi ini cocok dipasangkan - ubah ukuran dulu, lalu encode - dan alat pengubah ukuran gambar adalah separuh lain dari pekerjaan itu.

Apa yang sebenarnya dibuang JPEG

JPEG bekerja dalam blok berukuran delapan kali delapan piksel. Setiap blok diubah lewat transformasi kosinus diskret menjadi sekumpulan koefisien frekuensi - satu menggambarkan nada rata-rata, sisanya menggambarkan detail yang makin halus - lalu koefisien-koefisien itu dibagi dengan tabel kuantisasi dan dibulatkan. Koefisien berfrekuensi tinggi biasanya membulat menjadi nol, dan deretan nol sangat mudah dimampatkan. Pembulatan itulah kehilangannya.

Sebelum semua itu, gambar dikonversi dari RGB menjadi satu kanal luminans dan dua kanal warna, dan kanal warna biasanya disimpan pada setengah resolusi di tiap arah. Inilah chroma subsampling, ditulis 4:2:0, yang memanfaatkan kenyataan bahwa penglihatan manusia jauh lebih peka terhadap detail kecerahan daripada detail warna.

Kedua langkah itu menjelaskan artefak yang muncul. Efek kotak-kotak pada langit yang mulus adalah kisi delapan kali delapan yang menjadi kelihatan ketika terlalu banyak koefisien membulat ke nol. Pinggiran berwarna di sekitar teks merah pada latar putih berasal dari chroma subsampling: tepinya tajam pada luminans tetapi kabur pada warna. Tidak ada pengaturan kualitas yang menghapus pinggiran itu sepenuhnya, dan karena itulah teks lebih pantas disimpan sebagai PNG atau WebP.

Format di luar ketiganya

AVIF, yang diturunkan dari codec video AV1, memampatkan jauh lebih baik daripada WebP pada kualitas rendah dan menengah, mendukung gamut warna luas dan transparansi, serta kini didukung semua peramban versi terkini. Proses encoding-nya lebih lambat, dan AVIF berkualitas sangat rendah menghaluskan detail menjadi tekstur seperti lilin alih-alih memunculkan kotak-kotak, yang bagi sebagian orang terasa lebih buruk daripada JPEG setara.

HEIC adalah format bawaan yang dihasilkan iPhone modern. Format ini efisien tetapi terikat paten dan tidak didukung peramban, sehingga gambar yang diambil dengan ponsel sering harus dikonversi dulu sebelum bisa dipasang di situs web. SVG sama sekali bukan format raster: ia adalah markup yang menjelaskan bentuk, sehingga ideal untuk logo dan ikon pada ukuran berapa pun, dan tidak berguna untuk foto.

GIF bertahan karena satu alasan saja: kebiasaan lama. Ia hanya punya 256 warna, tidak punya kanal alfa yang layak disebut demikian, dan untuk animasi menghasilkan berkas beberapa kali lebih besar daripada video setara. MP4 atau WebM mengerjakan tugas yang sama dengan ukuran jauh lebih kecil.

Menyajikan gambar di sebuah halaman

Pilihan format tidak sepenting menyajikan ukuran yang tepat. Foto selebar 4000 piksel yang ditampilkan dalam kolom selebar 600 piksel membuang sebagian besar byte-nya, apa pun codec-nya. Atribut srcset membuat peramban bisa memilih dari beberapa lebar, dan sizes memberitahunya seberapa lebar gambar itu benar-benar akan dirender; keduanya bersama-sama biasanya menghemat lebih banyak daripada proses encoding ulang apa pun.

Elemen picture melangkah lebih jauh dengan menawarkan format yang berbeda-beda, sehingga peramban mengambil AVIF bila bisa, WebP bila tidak, dan JPEG sebagai batas bawah. Menyusun semua kombinasi itu secara manual melelahkan; CDN gambar atau komponen gambar bawaan framework bisa membangkitkannya untuk Anda.

Ada dua atribut yang layak dipasang pada setiap gambar: width dan height yang eksplisit, supaya peramban menyediakan ruangnya dan halaman tidak bergeser saat gambar dimuat, serta loading=lazy pada apa pun yang berada di bawah layar pertama. Gambar yang pertama terlihat jangan dibuat lazy, karena menundanya langsung memperburuk largest contentful paint.

Profil warna, transparansi, dan cetak

Profil ICC memberi tahu penampil bagaimana harus menafsirkan angka-angka di dalam sebuah berkas. Foto dari ponsel modern sering ditandai Display P3, dan ketika tanda itu hilang angka yang sama dibaca sebagai sRGB, sehingga setiap warna jenuh bergeser. Konversi ini mendekode gambar menjadi piksel lalu menulis berkas baru, jadi profilnya tidak ikut bertahan - tidak masalah untuk gambar web biasa, tetapi tidak memadai untuk pekerjaan yang menuntut ketepatan warna.

Transparansi punya celah serupa. Mengonversi PNG dengan kanal alfa menjadi JPEG akan menggabungkannya di atas sebuah latar, dan hasil yang lazim adalah lingkaran cahaya hitam atau putih di sekeliling tepi yang dihaluskan. WebP dan AVIF mempertahankan kanal tersebut, jadi keduanya adalah tujuan yang tepat ketika transparansi penting.

Cetak adalah alur yang sama sekali berbeda. Layar bersifat RGB aditif dan mesin cetak bersifat CMYK subtraktif, hasil konversinya bergantung pada tinta, kertas, dan profil mesin cetak, dan warna cerah di layar kerap tidak punya padanan yang bisa dicetak. Nilai CMYK apa pun yang ditampilkan sebuah alat di peramban hanyalah perkiraan, berguna untuk gambaran kasar dan bukan untuk proof.

Metadata, privasi, dan asal-usul

Sebuah foto membawa jauh lebih banyak daripada piksel. EXIF mencatat kamera dan lensa, pengaturan eksposur, tanggal dan waktu, serta sering pula koordinat GPS tempat foto itu diambil. Platform media sosial umumnya membersihkannya saat unggah, tetapi berkas yang dikirim lewat surel, dilampirkan pada tiket, atau diunggah ke situs Anda sendiri biasanya masih menyimpannya.

Menghapus metadata adalah perilaku bawaan dari setiap proses encoding ulang, termasuk yang satu ini. Sebagian besar waktu hasil itu justru baik bagi privasi, tetapi menjengkelkan ketika hak cipta, keterangan gambar, atau tanggal pengambilan ternyata penting. Jika salah satunya merupakan bagian dari catatan resmi, simpan berkas aslinya dan perlakukan salinan hasil konversi sebagai turunan.

Ada satu bidang yang layak dipertahankan dengan sengaja: orientasi. Kamera menyimpan rotasi sebagai penanda alih-alih benar-benar memutar pikselnya, sehingga foto potret bisa tampak miring di perangkat lunak yang mengabaikan penanda itu. Menerapkan rotasi sebelum melakukan encoding ulang, seperti yang terjadi di sini, itulah yang membuat berkas hasil konversi tampil dengan benar di mana pun.