Langkau ke kandungan
LocalMedia Tools

PNG vs JPG vs WebP — format imej mana patut saya gunakan?

LocalMedia Tools ·

Hampir setiap imej di web adalah salah satu daripada tiga format, dan setiap satu mengorbankan sesuatu yang berbeza untuk mencapainya. JPG memampatkan fotograf secara agresif dengan membuang perincian yang jarang disedari oleh mata anda, PNG mengekalkan setiap piksel tepat seperti asalnya dan menambah ketelusan, dan WebP ialah format Google yang lebih baharu yang cuba melakukan kedua-dua tugas — dengan kehilangan dan tanpa kehilangan kualiti, dengan ketelusan — dalam fail yang lebih kecil berbanding yang biasa dihasilkan oleh mana-mana format lama. Memilih yang salah jarang menjadi bencana, tetapi ia bermakna sama ada masa muat halaman yang bengkak atau imej yang jelas kabur dan berblok. Panduan ini menghuraikan apa sebenarnya yang dilakukan oleh setiap format di sebalik tabir, di mana HEIC (format yang digunakan iPhone untuk menyimpan foto) sesuai dalam gambaran ini, dan cara menukar atau memampatkan mana-mana daripadanya tanpa memuat naik sebarang fail ke mana-mana.

Apakah itu JPG dan bilakah anda patut menggunakannya?

JPG (juga ditulis JPEG) menggunakan pemampatan kehilangan (lossy): ia menganalisis imej dalam blok, membuang perincian halus dan variasi warna yang jarang disedari oleh mata manusia, dan membina semula anggaran semasa penyahkodan. Pertukaran itu adalah tepat sebabnya JPG kecil — fotograf yang mengambil beberapa megabait tanpa mampatan sering dimampatkan kepada beberapa ratus kilobait pada tetapan kualiti yang kebanyakan orang tidak dapat bezakan daripada yang asal. JPG tiada saluran ketelusan, jadi ia sentiasa dipaparkan pada latar belakang legap, dan ia bukan padanan yang baik untuk tangkapan skrin, seni garisan, atau teks, di mana kekaburan lembut di sekeliling tepi tajam menjadi jelas. Gunakan JPG untuk fotograf dan imej seperti foto — gambar produk, potret, pemandangan — di mana saiz fail penting dan latar belakang dijangka wujud.

Apakah itu PNG dan bilakah anda patut menggunakannya?

PNG menggunakan pemampatan tanpa kehilangan (lossless): setiap piksel yang anda simpan adalah piksel yang tepat sama yang anda dapat kembali, tanpa sebarang anggaran. Ini menjadikan PNG pilihan yang tepat untuk tangkapan skrin, mock-up UI, logo, gambar rajah, dan mana-mana imej yang mengandungi teks tajam atau tepi keras, di mana artifak kehilangan akan segera kelihatan sebagai kekaburan atau bunyi bising berblok di sekeliling tepi. PNG juga menyokong saluran alfa (ketelusan) penuh, jadi logo atau ikon boleh mempunyai latar belakang yang benar-benar telus berbanding kotak putih atau berwarna di sekelilingnya. Kosnya ialah saiz: kerana PNG tidak boleh membuang perincian, fotograf yang disimpan sebagai PNG lazimnya beberapa kali lebih besar berbanding foto yang sama disimpan sebagai JPG, tanpa sebarang peningkatan kualiti yang kelihatan pada subjek fotografi.

Apakah itu WebP dan bagaimanakah ia berbeza daripada JPG dan PNG?

WebP ialah format yang lebih baharu yang dibina untuk menggantikan kedua-dua format lama sekali gus. Ia menyokong kedua-dua pemampatan kehilangan dan tanpa kehilangan dalam format fail yang sama, ditambah saluran ketelusan penuh seperti PNG — jadi satu format sahaja boleh mengendalikan foto termampat, tangkapan skrin tanpa kehilangan, dan logo telus. Pada praktiknya, fail WebP lazimnya 25-35% lebih kecil berbanding JPG berkualiti setara, dan WebP tanpa kehilangan biasanya lebih kecil berbanding imej yang sama disimpan sebagai PNG juga. Sokongan pelayar telah hampir sejagat sejak awal 2020-an (setiap pelayar utama memaparkannya secara asli), yang menghapuskan bantahan sejarah utama terhadap penggunaannya. Masalah yang masih tinggal ialah keserasian di luar pelayar: sesetengah penyunting imej lama, plugin CMS warisan, dan aliran kerja cetak atau reka bentuk masih tidak membuka WebP secara terus, jadi berbaloi untuk menyemak rantaian alat khusus anda sebelum menyeragamkannya di mana-mana.

Di manakah kedudukan HEIC, dan patutkah anda menukarnya?

HEIC ialah format yang digunakan iPhone secara lalai untuk foto sejak iOS 11 — ia memampatkan dengan lebih cekap berbanding JPG pada kualiti yang setara, itulah sebabnya ia mengambil ruang yang lebih sedikit pada telefon anda. Masalahnya ialah keserasian, bukan kualiti: banyak perisian Windows, aplikasi Android lama, borang web, dan pelanggan e-mel sama ada langsung tidak dapat membuka fail .heic atau mengendalikannya dengan janggal. Jika anda berkongsi foto ke suatu tempat yang mungkin tidak menyokong HEIC — memuat naik ke laman web, menghantar e-mel kepada seseorang pada peranti yang tidak diketahui, memuat naik ke perisian lama — tukar ia kepada JPG terlebih dahulu untuk keserasian paling meluas, atau kepada PNG hanya jika anda khusus memerlukan kualiti tanpa kehilangan atau ketelusan (jarang untuk foto kamera). Penukar HEIC ke JPG LocalMedia mengendalikan penukaran ini sepenuhnya dalam pelayar anda, jadi foto tersebut dibaca daripada peranti anda, ditukar, dan disimpan semula tanpa dimuat naik ke mana-mana.

Format manakah sepatutnya anda pilih, mengikut kes penggunaan?

Keputusan biasanya bergantung pada apa yang dikandungi imej tersebut dan ke mana ia akan pergi. Untuk fotograf atau imej yang menyerupai foto yang ditujukan untuk web, gunakan WebP jika platform anda menerimanya, atau JPG jika tidak. Untuk tangkapan skrin, dokumen yang diimbas, gambar rajah, atau apa-apa sahaja yang mengandungi teks, gunakan PNG (atau WebP tanpa kehilangan) supaya tepi kekal tajam. Untuk logo, ikon, atau grafik yang memerlukan latar belakang telus, gunakan PNG atau WebP — jangan sekali-kali JPG, kerana ia langsung tidak dapat mewakili ketelusan. Untuk keserasian maksimum dengan perisian lama, pelanggan e-mel, atau aliran kerja cetak, JPG dan PNG kekal sebagai pilihan sejagat yang paling selamat, kerana sokongan WebP di luar pelayar moden masih tidak konsisten.

Mengapakah menyimpan semula JPG berulang kali menjadikannya lebih teruk?

Kerana pemampatan JPG bersifat kehilangan, setiap kali anda membuka JPG, menyuntingnya, dan menyimpannya semula sebagai JPG, format tersebut menganalisis semula dan membuang semula perincian di atas apa yang sudah dibuang buat kali pertama. Sunting-dan-simpan-semula beberapa kali dan kehilangan yang terkumpul menjadi kelihatan sebagai kekaburan lembut, jalur warna, atau artifak berblok di sekeliling tepi — masalah yang sering dipanggil kehilangan generasi. Ini tidak berlaku dengan PNG, kerana pemampatan tanpa kehilangan tidak pernah membuang perincian tidak kira berapa kali anda menyimpannya semula. Jika anda perlu menyunting foto berkali-kali, simpan salinan induk PNG atau tanpa kehilangan lain semasa penyuntingan dan hanya eksport kepada JPG sekali, pada akhirnya, untuk penghantaran akhir.

Bagaimanakah anda menukar atau memampatkan imej tanpa memuat naiknya?

Menukar antara JPG, PNG, WebP, dan HEIC, atau mengecilkan fail yang terlalu besar, langsung tidak memerlukan penghantaran imej ke pelayan — pelayar boleh menyahkod dan mengekod semula kebanyakan format imej biasa dengan sendirinya. Penukar format imej LocalMedia bertukar antara JPG, PNG, dan WebP terus dalam tab pelayar anda, dan pemampat imej mengurangkan saiz fail dengan melaraskan kualiti atau dimensi, kedua-duanya tanpa fail tersebut sekali-kali meninggalkan peranti anda. Anda boleh mengesahkan ini sendiri: buka DevTools pelayar anda (F12), pergi ke tab Network, dan perhatikan sebarang permintaan muat naik semasa anda menukar atau memampatkan fail — alat yang benar-benar tempatan tidak menghantar apa-apa.

Alat berkaitan

Soalan Lazim

Adakah PNG atau JPG lebih baik?
Tiada satu pun yang lebih baik secara sejagat — kedua-duanya dibina untuk kandungan yang berbeza. Pemampatan kehilangan JPG menjadikannya jauh lebih kecil untuk fotograf, manakala pemampatan tanpa kehilangan PNG mengekalkan tangkapan skrin, teks, dan grafik bebas daripada kekaburan serta menambah sokongan ketelusan yang langsung tiada pada JPG. Gunakan JPG untuk foto, PNG untuk apa-apa sahaja yang bertepi tajam, mengandungi teks, atau latar belakang telus.
Adakah WebP lebih baik daripada JPG?
Dari segi saiz fail dan kualiti, secara umumnya ya: WebP lazimnya menghasilkan fail 25-35% lebih kecil berbanding JPG berkualiti setara, dan ia juga menyokong ketelusan serta pemampatan tanpa kehilangan, yang langsung tidak dapat dilakukan oleh JPG. Satu-satunya sebab untuk masih memilih JPG berbanding WebP ialah keserasian dengan perisian lama atau aliran kerja yang tidak membuka fail WebP.
Adakah WebP menyokong ketelusan?
Ya. WebP mempunyai saluran ketelusan alfa penuh dalam kedua-dua mod kehilangan dan tanpa kehilangannya, jadi ia boleh menggantikan PNG untuk logo dan ikon telus sambil biasanya menghasilkan fail yang lebih kecil.
Patutkah saya menukar HEIC kepada JPG atau PNG?
Tukar kepada JPG dalam hampir semua kes — ia lebih kecil dan serasi secara sejagat, yang sepadan dengan apa yang diperlukan oleh foto kamera. Hanya tukar kepada PNG jika anda khusus memerlukan kualiti tanpa kehilangan atau latar belakang telus, yang jarang berlaku untuk foto biasa.
Format manakah menghasilkan fail paling kecil?
Untuk fotograf, WebP kehilangan biasanya paling kecil, diikuti oleh JPG, dengan PNG jauh lebih besar. Untuk tangkapan skrin, teks, atau seni garisan, WebP tanpa kehilangan biasanya paling kecil, diikuti oleh PNG, kerana pemampatan kehilangan JPG tidak sesuai untuk tepi tajam tidak kira saiz fail sekalipun.
Bolehkah saya menukar antara PNG, JPG, dan WebP tanpa kehilangan kualiti?
Menukar daripada format tanpa kehilangan (PNG) kepada tetapan tanpa kehilangan lain mengekalkan kualiti dengan tepat. Menukar kepada atau antara format kehilangan (JPG, WebP kehilangan) sentiasa memampatkan semula imej tersebut, jadi sedikit kualiti hilang pada setiap penukaran — simpan salinan induk tanpa kehilangan jika anda menjangka akan menukar atau menyunting sesuatu imej lebih daripada sekali.