Görsel dosya biçimleri: JPEG, PNG, WebP ve hangisini nerede kullanmalı

Görsel biçimi seçmek teknik bir ayrıntı gibi görünür, ama sonucu her yerde hissedilir: siteniz yavaş açılır, fotoğraflarınız bulanıklaşır ya da diskiniz gereksiz dolar. Karar aslında tek bir soruya dayanıyor — veri kaybetmeye izin var mı?

Kayıplı ve kayıpsız

Kayıpsız sıkıştırma, tekrarları daha verimli saklar; açtığınızda dosya bit bit aynıdır. Kayıplı sıkıştırma ise gözün fark etmediği bilgiyi atar. İnsan gözü parlaklık değişimlerine renk değişimlerinden daha duyarlı olduğu için, kayıplı biçimler önce renk bilgisinden keser.

Kayıplı sıkıştırmanın en önemli sonucu nesil kaybı: bir fotoğrafı açıp tekrar kaydettiğinizde kayıp birikir. Beş kez düzenlenip kaydedilmiş bir görselde bozulma gözle görünür hâle gelir. Bu yüzden düzenleme sırasında kayıpsız bir biçimde çalışıp yalnızca son çıktıyı kayıplı kaydetmek doğru yöntem.

Klasik üçlü

• JPEG: fotoğraflar için kurulmuş düzen. Görüntüyü küçük bloklara ayırıp frekans bileşenlerine çevirir ve ince ayrıntıları atar. Kalite ayarı tam olarak bu atmanın miktarını belirler. Zayıf yanları: şeffaflık desteklemez, keskin kenarlarda ve yazıda halkalanma üretir, düz renk alanlarında bantlaşma yapar.
• PNG: kayıpsız ve şeffaflık destekli. Ekran görüntüsü, arayüz öğesi, çizgi grafik ve yazı içeren görseller için doğru seçim. Fotoğrafta ise dosya boyutu JPEG’in kat kat üstüne çıkar — çünkü fotoğrafta tekrar az.
• GIF: yalnızca 256 renk taşır ve animasyonu çok verimsiz sıkıştırır. Bugün animasyon için video ya da modern biçimler her açıdan daha iyi; GIF yalnızca uyumluluk gerekçesiyle kullanılıyor.

Yeni nesil biçimler

1. WebP: hem kayıplı hem kayıpsız çalışır, şeffaflık ve animasyon destekler. Aynı görsel kalitede JPEG’e göre belirgin biçimde küçük dosyalar üretir ve artık her yerde destekleniyor. Web için güvenli varsayılan.
2. AVIF: video sıkıştırma teknolojisinden türetilmiş; aynı kalitede WebP’den de küçük olabiliyor, geniş renk ve yüksek dinamik aralığı iyi taşıyor. Bedeli, kodlamanın yavaş olması ve bazı eski araçlarda açılmaması.
3. SVG: piksel değil, çizim talimatı saklar. Logo, ikon ve grafikler için ideal: her boyutta keskin kalır ve dosya küçücüktür. Fotoğraf için uygun değil. Dışarıdan gelen SVG dosyalarının betik barındırabileceğini unutmamak gerekir.
4. HEIC: telefonlarda yaygın, verimli ama uyumluluk sorunları çıkarabiliyor. Paylaşım öncesi dönüştürmek pratik bir alışkanlık.

RAW neden bu kadar büyük

RAW bir görsel biçimi değil, sensörün ham verisi. İçinde henüz beyaz dengesi, keskinlik ve renk işlemesi uygulanmamış bilgi durur; işte düzenleme payı buradan gelir. Pozlaması bir miktar kaçmış bir kareyi kurtarabilmenizin nedeni, o bilginin atılmamış olması.

Karşılığında dosyalar on kat büyük ve her RAW biçimi üreticiye özgü. Telefon kameralarının hesaplamalı fotoğraf yöntemleri de bu veriyi kullanıyor; nasıl çalıştığını kamera yazısında anlattık.

Boyut, sıkıştırmadan önce gelir

En sık yapılan hata: 4000 piksel genişliğindeki bir fotoğrafı siteye yükleyip tarayıcıya küçültmesini bırakmak. Ziyaretçi, ekranda 800 piksel olarak göreceği bir görselin tamamını indirir.

Doğru sıra şu:

1. Görseli kullanılacağı boyuta yeniden boyutlandır.
2. Uygun biçime çevir (fotoğraf için WebP ya da AVIF, arayüz öğesi için PNG, logo için SVG).
3. Kaliteyi gözle kontrol ederek düşür — fotoğrafta genellikle yüzde 75-85 bandı fark edilmez.
4. Farklı ekran boyutları için birkaç ayrı sürüm sun; tarayıcıya hangisini indireceğini seçtir.

Bu dört adım, sunucu paketini yükseltmekten çok daha fazla hız kazandırıyor; aynı tespiti barındırma yazısında da yapmıştık.

Üstverinin gizlilik tarafı

Fotoğraf dosyaları içinde çekim tarihi, cihaz modeli ve çoğu zaman GPS konumu saklanır. Paylaşım platformlarının çoğu bu veriyi temizler, ama doğrudan gönderdiğiniz bir dosya (e-posta eki, mesaj, siteye yükleme) konumu taşıyabilir.

Evden çekilmiş bir fotoğrafın adresinizi vermesi gerçek bir risk; paylaşım öncesi üstveri temizlemek basit bir önlem. Konum verisinin nasıl üretildiğini GPS yazısında ele aldık.

Sıkıştırmanın görünür izleri

Hangi bozulmanın nereden geldiğini bilmek, ayarı doğru seçmeye yarıyor: blok şeklinde kareler aşırı kayıplı sıkıştırmanın, keskin kenar çevresindeki hayalet çizgiler halkalanmanın, gökyüzündeki basamaklar ise renk derinliği ve bantlaşmanın işareti. Aynı sorunları hareketli görüntüde de görürüz — bit hızı bütçesinin nasıl paylaştırıldığını yayın yazısında anlatmıştık.

Doğru biçim yoktur; doğru eşleşme vardır. Fotoğrafa JPEG ailesi, yazıya ve şeffaflığa PNG, çizime SVG.