Web Görüntü Formatları İçin Eksiksiz Bir Kılavuz — PNG, JPEG, WebP, AVIF
Web Görüntü Formatları İçin Eksiksiz Bir Kılavuz
Doğru görüntü formatını seçmek, web sitesi performansı için yapabileceğiniz en basit ancak en etkili kararlardan biridir. Her format, dosya boyutu, görsel kalite, özellik desteği ve tarayıcı uyumluluğunu farklı şekilde dengeler. Bu kılavuz, yayınladığınız her görüntü için bilinçli bir seçim yapabilmeniz amacıyla dört ana web görüntü formatını ayrıntılı olarak inceler.
JPEG: Evrensel İş Makinesi
JPEG, Joint Photographic Experts Group'un kısaltmasıdır ve otuz yılı aşkın süredir baskın web görüntü formatı olmuştur. İnsan gözünün algılamakta zorlandığı renk bilgilerini atarak küçük dosya boyutları elde etmek için kayıplı sıkıştırma kullanır.
Güçlü yönleri:
- Şimdiye kadar üretilmiş her cihaz ve tarayıcıda evrensel tarayıcı desteği.
- Pürüzsüz renk geçişlerine sahip fotoğrafik içerik için mükemmel sıkıştırma.
- 0'dan 100'e kadar ayarlanabilir kalite, dosya boyutu üzerinde ince ayarlı kontrol sağlar.
- Neredeyse tüm cihazlarda donanım kod çözme hızlandırması mevcuttur.
Zayıf yönleri:
- Şeffaflık desteği yoktur. JPEG, şeffaf arka plana sahip görüntüleri oluşturamaz.
- Kayıplı sıkıştırma, düşük kalite ayarlarında, özellikle kenarlarda bloklanma ve geçişlerde bantlanma gibi gözle görülür artefaktlar oluşturur.
- Keskin metin, düz renkler veya sert kenarlar içeren görüntülerde düşük performans.
En iyi kullanım durumları: Fotoğraflar, çok renkli karmaşık illüstrasyonlar, ürün görüntüleri, hero banner'ları ve evrensel uyumluluğun gerekli olduğu tüm görüntüler.
PNG: Hassasiyet ve Şeffaflık
PNG veya Portable Network Graphics, GIF'e ücretsiz ve açık bir alternatif olarak oluşturulmuştur. Kayıpsız sıkıştırma kullanır, yani her piksel orijinalinde göründüğü gibi tam olarak yeniden üretilir.
Güçlü yönleri:
- Kayıpsız sıkıştırma, tekrarlanan kaydetmelerden sonra bile sıfır kalite bozulmasını garanti eder.
- Tam alfa şeffaflık desteği, pürüzsüz kenarlar ve saydam arka planlar sağlar.
- Ekran görüntüleri ve düz grafikler gibi geniş düz renk alanlarına sahip görüntüler için mükemmel sıkıştırma.
- Daha küçük dosya boyutları için 24 bit renk (16,7 milyon renk) ve 8 bit indekslenmiş renk (256 renk) destekler.
Zayıf yönleri:
- Fotoğrafik içerik için dosya boyutları JPEG'den önemli ölçüde daha büyüktür — genellikle iki ila beş kat daha büyük.
- Yerel animasyon desteği yoktur. Animasyonlu içerik için bunun yerine GIF veya WebP kullanın.
- PNG olarak kaydedilen kamera ve telefon fotoğrafları önemli ölçüde bant genişliği israfına neden olur.
En iyi kullanım durumları: Logolar, simgeler, ekran görüntüleri, UI maketleri, metin içeren görüntüler, şeffaflık gerektiren grafikler ve piksel mükemmelinde yeniden üretimin tartışılmaz olduğu tüm senaryolar.
WebP: Modern Çok Yönlü Format
WebP, Google tarafından geliştirilen modern bir görüntü formatıdır. JPEG, PNG ve GIF'in yerini, tüm ana kullanım durumlarını daha verimli bir şekilde ele alan tek bir formatla değiştirmek üzere tasarlanmıştır.
Güçlü yönleri:
- Tek bir formatta hem kayıplı hem de kayıpsız sıkıştırmayı destekler.
- Kayıplı WebP, eşdeğer görsel kalitede JPEG'den tipik olarak yüzde 25 ila 35 daha küçüktür.
- Kayıpsız WebP, PNG'den yüzde 20 ila 25 daha küçüktür.
- Hem kayıplı hem de kayıpsız modlarda alfa şeffaflığını destekler.
- Animasyonu destekler, çok daha küçük dosya boyutlarıyla GIF'in doğrudan yerine geçer.
- Geniş tarayıcı desteği: Chrome, Firefox, Edge ve Safari 14 ve sonrası.
Zayıf yönleri:
- Internet Explorer ve Safari 13 ve öncesi dahil eski tarayıcılar WebP'yi desteklemez.
- Kodlama hızı JPEG'den daha yavaştır, ancak kod çözme hızı karşılaştırılabilir düzeydedir.
- Tüm görüntü düzenleme araçları WebP'yi yerel olarak desteklemez.
En iyi kullanım durumları: Dosya boyutunun öncelikli olduğu web görüntüleri, modern web uygulamaları, destekleyen tarayıcılar için JPEG ve PNG'yi tek bir formatla değiştirme.
AVIF: Yeni Nesil
AVIF (AV1 Image File Format), AV1 video kodlayıcısı üzerine inşa edilmiş en yeni formattır. Yaygın olarak desteklenen herhangi bir görüntü formatının en iyi sıkıştırma verimliliğini sunar.
Güçlü yönleri:
- Aynı görsel kalitede JPEG'den yüzde 50'ye kadar daha küçük.
- WebP'den yüzde 30'a kadar daha küçük.
- Kayıplı ve kayıpsız sıkıştırmayı destekler.
- Geniş renk gamı ile tam şeffaflık ve HDR desteği.
- Telifsiz ve açık standart.
Zayıf yönleri:
- Tarayıcı desteği hala büyümektedir. Chrome ve Firefox AVIF'i destekler; Safari, sürüm 16'da destek eklemiştir.
- Kodlama hesaplama açısından maliyetlidir, JPEG veya WebP'den daha yavaş sıkıştırır.
- Görüntü düzenleme ve tasarım araçlarında sınırlı destek.
- Özel donanım olmadan gerçek zamanlı veya yüksek hacimli kodlama senaryoları için uygun değildir.
En iyi kullanım durumları: Modern tarayıcıları hedefleyen son teknoloji web projeleri, maksimum sıkıştırmanın gerekli olduğu senaryolar, HDR içeriği ve kodlama süresinin kabul edilebilir olduğu büyük ölçekli görüntü dağıtımı.
Yan Yana Format Karşılaştırması
| Özellik | JPEG | PNG | WebP | AVIF | |---------|------|-----|------|------| | Sıkıştırma türü | Kayıplı | Kayıpsız | Kayıplı ve kayıpsız | Kayıplı ve kayıpsız | | Şeffaflık | Hayır | Evet (alfa) | Evet (alfa) | Evet (alfa) | | Animasyon | Hayır | Hayır | Evet | Evet | | HDR desteği | Hayır | Hayır | Hayır | Evet | | 24-bit renk | Evet | Evet | Evet | Evet | | Göreceli dosya boyutu | Referans | JPEG'in %200-500'ü | JPEG'in %65-80'i | JPEG'in %50-70'i | | Tarayıcı desteği | Evrensel | Evrensel | Kullanıcıların %95'ten fazlası | Kullanıcıların %85'ten fazlası | | Kodlama hızı | Hızlı | Orta | Orta | Yavaş |
Format Nasıl Seçilir
Yayınladığınız her görüntü için bu karar ağacını izleyin:
- Şeffaflık ihtiyacı olmayan bir fotoğraf mı? Maksimum sıkıştırma için JPEG veya AVIF kullanın.
- Şeffaflığa ihtiyacı var veya metin ve keskin kenarlar içeriyor mu? Evrensel destek için PNG veya modern tarayıcılar için WebP kullanın.
- Animasyon gerekli mi? Önemli ölçüde daha küçük dosyalar için GIF yerine WebP kullanın.
- Mutlak maksimum sıkıştırma hedef mi? Kitleniz modern tarayıcılar kullanıyorsa AVIF kullanın.
Görüntülerinizi Orijinal Formatlarında Sıkıştırın
Kullanım durumunuz için doğru formatı seçtikten sonra, başka bir formata dönüştürmeden dosya boyutunu optimize edin. Ücretsiz çevrimiçi görüntü sıkıştırıcımız PNG, JPEG, WebP ve AVIF'i destekler — görüntünüzü yükleyin ve orijinal formata sadık kalan sıkıştırılmış bir sürüm indirin. Kaliteyi bozan dönüşüm zincirleri yok, gereksiz adımlar yok.