WebP'i 'sıkıştırma' yapmak isteyenler arasında farklar var:
Bazıları bir sürü JPG, PNG'yi WebP'ye dönüştürmek istiyor; bazıları zaten WebP'leri elinde ve onları daha küçültmek istiyor; bazıları ise hareketli WebP'leri işlemek istiyor.
Araçlar mutlak olarak iyi veya kötü değildir; sadece uygun olanıdır. Bu yazı senaryoya göre araçlar önerir, her senaryoda en kolayı verir.
Başlamadan Önce: WebP'i 2 Dakikada Öğrenin
WebP aslında üç türdür:
- Kayıplı WebP: JPEG'e benzer, kalite parametresine göre detayları atar, küçüktür, fotoğraflar ve bannerlar için uygundur.
- Kayıpsız WebP: PNG'ye benzer, pikseller tamamen değişmez, ekran görüntüleri ve UI materyalleri için uygundur.
- Dinamik WebP: Çok kareli animasyon, kayıplı veya kayıpsız olabilir, genellikle GIF'den dönüştürülen memeler ve sunum animasyonlarıdır.
Ne tür bir dosya olduğundan emin değilseniz, Google'ın resmi webpinfo komutunu kullanın:
bash
brew install webp
webpinfo image.webp
Çıktıda VP8 kayıplıdır, VP8L kayıpsızdır ve ANIM / ANMF varsa animasyonlu bir dosyadır.
Bilmeniz gereken bir şey daha var: Kayıplı WebP için daha yüksek kalite parametresi ile yeniden kodlama, dosya boyutunu büyüterek ancak kaliteyi artırmaz - atılan detaylar geri dönmez. Bu nedenle zaten WebP olan dosyalar için iyi bir sıkıştırma aracı, 'sıkıştırılamazsa sıkıştırma yapmaz' kararını verebilmelidir.
Senaryo 1: JPG / PNG'leri Toplu Olarak WebP'ye Dönüştürmek
Bu, çoğu insanın WebP ile ilk tanıştığında yaptığı iştir.
Arayüz için XnConvert seçin. Ücretsiz, çoklu platformlu, bir grup dosyayı sürükleyip bırakabilir, WebP kalitesini veya kayıpsız modunu ayarlayabilir, aynı zamanda boyutu ve dosya adını değiştirebilir. Format değiştirmek işi en az zahmetle yapan budur.
Build sürecine yazmak için cwebp veya sharp seçin. Web sitesi projelerinde manuel dönüştürmek yerine, paketleme veya CDN yüklerken otomatik olarak işleyin:
bash
cwebp: Kalite 75, en yavaş en verimli kodlama yöntemi, renk profilini korur
cwebp -q 75 -m 6 -metadata icc input.jpg -o output.webp
js
// sharp (Node.js)
await sharp('input.jpg').webp({ quality: 75, effort: 6 }).toFile('output.webp')
Parametrelerden emin değilsiniz mi? Önce Squoosh ile deneyin. Google'ın çevrimiçi aracı, tek tek işler ancak yan yana bölümler ve kaliteyi kaydırarak anlık sonuç görebilirsiniz. 'Bu tür görüntüler için ne kadar kalite yeterli'yi anlamak için önce bu aracı kullanın, ardından parametreleri yukarıdaki toplu araçlara girin.
Senaryo 2: Zaten WebP, Daha Küçültmek İstiyorum
Web sitesi zaten WebP'ye geçti, ancak Lighthouse hala 'görüntüler daha fazla sıkıştırılabilir' diyor; veya materyal klasöründe WebP'ler var ve yer kaplıyor. Bu durumda dönüşüme değil, orijinal dosyaları yerinde küçültmeye ihtiyacınız var.
Mac Kullanıcıları: ImgZilla
ImgZilla, bizim macOS görüntü sıkıştırma aracımızdır, bu senaryo tam olarak onun uzmanlık alanıdır:
- Yerinde sıkıştırma, yol değişmez.
banner.webpsıkıştırıldığında yinebanner.webpkalır, web sitesi, kod veya belgelerdeki referansları tek satır bile değiştirmeden. - Tüm klasörü sürükleyip bırakın. Alt dizinleri özyinelemeli olarak tarama, gizli dosyaları ve
node_modules'i otomatik olarak atlar; WebP ve JPG, PNG, GIF, AVIF, HEIC, SVG'leri karışık olarak tek seferde işleyebilir. - Parametre ayarlamaya gerek yok. Google libwebp kodlamasını kullanır, kalite 75, kodlama çabası 4, Squoosh'un varsayılan parametreleriyle aynıdır; transparan kanal en yüksek kalitede korunur, transparan arka planlar bulanıklaşmaz.
- Sıkıştırılamayanı zorla sıkıştırmaz. Yeniden kodlandıktan sonra daha küçük olmazsa (sıkıştırma oranı %0.4'ten az), 'en küçüktür' olarak işaretlenir ve orijinal dosya korunur, daha büyük bir dosya vermez ve ücretsiz krediyi kesmez.
- Geriyi alma. Orijinal dosyalar varsayılan olarak çöp kutusuna taşınır, hangi dosyayı beğenmediğinizi görmek için sağ tıklayın 'Orijinaline geri getir' diyerek.
- Tamamen yerel çalışır, hiçbir sunucuya yüklenmez.
👉 ImgZilla'yı Mac App Store'dan indirin
Diğer Platformlar: Caesium veya TinyPNG
- Caesium Image Compressor: Açık kaynak, ücretsiz, Windows, macOS ve Linux'ta çalışır, WebP toplu sıkıştırmasını destekler, kalite ve meta verileri koruma seçenekleri vardır.
- TinyPNG: Web aracı, aynı zamanda WebP'yi destekler. Sürükle ve bırak, ancak ücretsiz sürümde dosya sayısı ve boyut sınırları vardır; resimler karşı taraftaki sunucuya yüklenir.
Senaryo 3: Dinamik WebP
Animasyonlar iki ihtiyaç türüne ayrılır:
GIF'yi Dinamik WebP'ye Dönüştürme: Google'ın resmi gif2webp komutunu kullanın (cwebp ile aynı libwebp araç setinde, Mac'te brew install webp ile yüklenebilir). Aynı animasyon, genellikle GIF'ten çok daha küçüktür.
bash
gif2webp -q 75 -m 6 input.gif -o output.webp
Mevcut Dinamik WebP'yi Daha Küçültme: Çoğu araç animasyonu görürse hata verir veya sadece ilk kareyi korur. ImgZilla, dinamik WebP'leri yeniden sıkıştırma için destekler - kare kare yeniden kodlama, kare sayısı, kare süresi, döngü sayısı ve tuval boyutu sabittir; animasyon aynı kalır ancak dosya daha küçüktür. Statik görüntüler gibi, sıkıştırılamayanlar 'en küçüktür' olarak işaretlenir ve orijinal dosya korunur.
Senaryo 4: Pikseller Değişmemeli
UI kesimlerinin tasarıma tam olarak uyması, ekran görüntülerinin piksel düzeyinde karşılaştırılması veya materyallerin ileride düzenlenmesi gerekiyorsa kayıpsız sıkıştırma gerekir.
cwebp kullanın:
bash
Tamamen kayıpsız
cwebp -lossless -z 9 input.png -o output.webp
Yakın kayıpsız: Piksellerde çok küçük değişiklikler, ancak tamamen kayıpsızdan çok daha küçüktür, ekran görüntüleri ve UI için uygundur
cwebp -near_lossless 60 input.png -o output.webp
Not: ImgZilla, WebP için her zaman kayıplı kodlama kullanır, orijinal olarak kayıpsız olan WebP'leri de içerir. Boyut genellikle belirgin şekilde küçülür ancak pikseller artık birebir aynı değildir. Ayrıca WebP'deki meta verileri (renk profili dahil) kaldırır; normal sRGB görüntüler etkilenmez, ancak Display P3 gibi geniş renk profili olan görüntülerde renk yönetimi yazılımlarında renklerde ufak farklar olabilir. Pikseller ve renklerde katı gereksinimleriniz varsa, cwebp kullanın veya sıkıştırma yapmadan önce bunları ayıklayın.
Özet Tablo
| Yapılacak İşlem | Önerilen | Yedek |
|---|---|---|
| JPG / PNG'leri Toplu Olarak WebP'ye Dönüştürme | XnConvert | cwebp, sharp (build süreci) |
| Parametre Denemek / Tek Dosya İşleme | Squoosh | — |
| Zaten WebP'yi Yerinde Daha Küçültme (Mac) | ImgZilla | Caesium |
| Zaten WebP'yi Daha Küçültme (Windows / Linux) | Caesium | TinyPNG |
| GIF'yi Dinamik WebP'ye Dönüştürme | gif2webp | — |
| Zaten Dinamik WebP'yi Daha Küçültme | ImgZilla | libwebp ile kendi betiğinizi yazın |
| Pikseller Değişmemeli Gerekiyorsa | cwebp -lossless / -near_lossless |
— |
İndirme Linkleri
| Araç | Platform | Fiyat | İndirme |
|---|---|---|---|
| ImgZilla | macOS 12.3+ | Ücretsiz, günlük 10 dosya | Mac App Store |
| XnConvert | Windows / macOS / Linux | Kişisel Ücretsiz | xnview.com |
| Caesium Image Compressor | Windows / macOS / Linux | Açık Kaynak Ücretsiz | saerasoft.com |
| cwebp / gif2webp / webpinfo | Komut Satırı | Açık Kaynak Ücretsiz | Google Resmi İndirme, Mac: brew install webp |
| sharp | Node.js | Açık Kaynak Ücretsiz | sharp.pixelplumbing.com, npm install sharp |
| Squoosh | Web | Ücretsiz | squoosh.app |
| TinyPNG | Web | Ücretsiz Sınırı Var | tinypng.com |
Son
WebP zaten çok verimli bir formattır. WebP'niz CDN veya build aracı tarafından uygun parametrelerle oluşturulduysa, sıkıştırılabilir alan büyük olmayabilir, 'en küçüktür' görmek normaldir; gerçekten çok tasarruf sağlayan, genellikle yüksek kalite parametreleriyle dışa aktarılan, PNG'den kayıpsız olarak dönüştürülen veya GIF'den doğrudan dönüştürülen ancak işlenmemiş dosyalardır.
Önce webpinfo ile elinizdeki dosyanın ne olduğunu netleştirin, ardından senaryoya göre aracı seçin, on araç arasında deneme yapmaktan çok daha zaman kazandırır.
ImgZilla şu anda sadece macOS (12.3 ve üzeri) desteklemektedir, Mac App Store üzerinden indirilebilir. Ücretsiz sürümde günlük olarak 10 dosya sıkıştırılabilir, sadece başarıyla sıkıştırılan sayı hesaplanır - dolu bir WebP klasörünü sürükleyip bırakın, ne kadar tasarruf sağlayabileceğinizi görün.