Görsel sıkıştırma: kalite kaybı nerede başlar

"Kalite 80" neyin yüzde 80'i

Hiçbir şeyin. JPEG kodlayıcılarında kalite değeri bir yüzde değil, nicemleme (quantization) tablosunu ölçekleyen bir sayıdır. Kodlayıcı görüntüyü 8 × 8 bloklara ayırıp her bloğu frekans katsayılarına çevirir, sonra bu katsayıları tablodaki bölenlere bölüp yuvarlar. Kalite değeri o bölenleri büyütür ya da küçültür. İki farklı kodlayıcının 80'i aynı tabloyu vermez, aynı kodlayıcının 80'i farklı alt örnekleme ayarıyla aynı görsel sonucu vermez.

Bunun pratik karşılığı şu: bir projede işe yarayan sayıyı başka projeye taşımak güvenli değil. Taşınabilir olan şey ayar değil, yöntemdir. Aşağıdaki sıra da bu yüzden önemli.

En büyük kazanç sıkıştırmada değil, ölçüde

4000 × 3000 piksel bir fotoğraf 12 megapiksel taşır. Aynı görseli sitede 800 × 600 kutuda gösteriyorsanız ihtiyacınız 0,48 megapiksel; yani 25 kat fazla veri sıkıştırıyorsunuz. Yüksek yoğunluklu ekranlar için iki katı çözünürlük verseniz bile 1600 × 1200 = 1,92 megapiksel, hâlâ altıda bir. Hiçbir kalite ayarı bu oranı yakalayamaz ve ölçü düşürmek görüntüyü bozmaz, sadece küçültür.

Bu yüzden akışın ilk adımı daima yeniden boyutlandırma olmalı, gerekiyorsa kırpma ile birlikte. Sıkıştırma ayarıyla uğraşmak, görsel zaten doğru ölçüye indikten sonra anlamlı hale gelir.

Piksel olmayan baytlar

Fotoğraf makinesinden çıkan bir JPEG'in içinde piksel dışında epey şey vardır: EXIF blokları, GPS kaydı, üretici notları, bazen XMP ve neredeyse her zaman gömülü bir önizleme görüntüsü. O önizleme kendi başına tam bir JPEG'dir ve makineye göre birkaç kilobayttan birkaç yüz kilobayta kadar çıkabilir. Web için hazırlarken bunların hiçbiri gerekmez ve EXIF temizleyici ile hepsi tek adımda gider.

Tek istisna ICC renk profilidir. Görsel sRGB ise profili atmak güvenlidir. Display P3 gibi geniş gamlı bir profille kaydedilmişse profili silmeyin: tarayıcı profilsiz görseli sRGB varsayar ve renkler, özellikle doygun kırmızı ve yeşiller, gözle görülür biçimde kayar. Doğru yol profili silmek değil, görseli sRGB'ye dönüştürüp öyle kaydetmektir.

Kroma alt örnekleme: ucuz kazanç, keskin tuzak

İnsan gözü parlaklık değişimine renk değişiminden çok daha duyarlıdır, kayıplı kodlayıcılar da bunu kullanır. 4:4:4'te her piksel için üç örnek (Y, Cb, Cr) saklanır. 4:2:0'da 2 × 2'lik bir blokta dört parlaklık örneğine karşılık yalnızca bir Cb ve bir Cr örneği vardır: 12 yerine 6 örnek, yani sıkıştırma başlamadan önce veri yarıya iner.

Fotoğrafta bu bedel neredeyse görünmez. Görünür olduğu yerler bellidir: beyaz zemin üzerinde kırmızı ya da mavi yazı, ince renkli çizgiler, keskin kenarlı logolar ve arayüz ekran görüntüleri. Bu içerik tiplerinde 4:4:4'e geçmek, kaliteyi düşürüp alt örneklemeyi açık bırakmaktan daha iyi bir takastır. Kayıplı WebP'nin bu seçeneği hiç olmadığını da hesaba katın; formatların sınırlarını WebP mi AVIF mi yazısında karşılaştırdık.

Gözle bakmak yerine ölçmek

"Bana iyi göründü" ölçeklenmeyen bir yöntemdir: ekranınıza, yakınlaştırma oranınıza ve o gün ne kadar dikkatli olduğunuza bağlıdır. Ölçülebilir alternatifi perceptual metriklerdir. Butteraugli ve onun üzerine kurulu SSIMULACRA 2, iki görüntü arasındaki farkı insan görüşünün duyarlılığına göre ağırlıklandırır.

SSIMULACRA 2'nin ölçeği kullanışlı, çünkü skorları somut kodlayıcı ayarlarına bağlıyor:

• 90 puan: görsel olarak kayıpsız. Fark, iki görüntüyü hızla değiştirip bakan bir titreşim testinde bile ayırt edilemiyor. Karşılığı yaklaşık libjpeg-turbo 4:4:4 kalite 95.
• 85 puan: mükemmel. Yan yana koyup 1:1 bakan ortalama bir gözlemci farkı görmüyor. Yaklaşık 4:4:4 kalite 90.
• 80 puan: çok yüksek. Yaklaşık 4:2:2 kalite 85.
• 70 puan: yüksek. Artefaktlar seçilebilir ama rahatsız etmiyor; orijinali görmeyen biri fark etmiyor. Yaklaşık 4:2:0 kalite 70.

Web için pratik hedef bandı 70 ile 85 arası. Sayfanın en üstündeki tanıtım görseli ve ürün fotoğrafı için 85, listelerdeki küçük resimler için 70 civarı makul. Arşiv ve baskı öncesi kopyada ise 90'ın altına inmeyin.

Merdiven kurun, tek sayı aramayın

Temsili beş görselinizi seçin, her birini 95, 90, 85, 80, 75 ve 70'te üretip boyutları bir tabloya yazın. Göreceğiniz şey neredeyse her zaman aynıdır: eğri üst uçta çok diktir. 95'ten 90'a inmek dosyayı belirgin şekilde küçültür ve görsel fark bırakmaz; 75'ten 70'e inmek az bayt kazandırır ama artefaktı belirgin biçimde artırır. Diz noktası genelde 80 ile 85 arasındadır, ama kataloğunuzun içeriğine göre kayar. Toplu üretim için görsel sıkıştırma aracı bu merdiveni kurmanın en hızlı yolu.

İlk nerede bozulur

Bir çıktıyı denetlerken rastgele bakmayın. Bozulma hep aynı dört yerde başlar, doğrudan oralara gidin ve %100 yakınlaştırmada, hedef cihazda inceleyin.

1. Düz gradyanlar: gökyüzü, stüdyo arka planı, yumuşak gölge. Önce bantlanma, sonra 8 × 8 bloklanma görünür.
2. Metin ve logo kenarları: keskin geçişin iki yanında hayalet halkalar (ringing) oluşur.
3. Koyu alanlar ve ten tonları: renk kayması ve bloklaşma en çok burada göze batar.
4. Alfa kenarları: saydam kenarlarda hale ve kirli piksel sırası.

Bantlanmayı gürültüyle kırmak

8 bit bir kanalda bir gradyan zaten yalnızca 256 kademeye sahiptir. Nicemleme bu kademelerin bir kısmını birleştirince geçiş şeritlere ayrılır. Sezgiye aykırı ama işe yarayan çözüm, kodlamadan önce çok hafif bir gürültü ya da dither eklemektir: rastgelelik kademe sınırını dağıtır ve şerit algısı kaybolur. Bedeli birkaç kilobayttır ve kaliteyi bir basamak yükseltmekten daha ucuza aynı sorunu çözer.

Asıl tehlike: ikinci kodlama

Kayıplı bir dosyayı açıp yeniden kaydetmek jenerasyon kaybı üretir. Burada ince bir ayrım var. Aynı kodlayıcı, aynı ayar ve aynı piksel boyutuyla yeniden kaydederseniz sonuç şaşırtıcı biçimde kararlıdır, çünkü sinyal zaten o nicemleme ızgarasına oturmuştur. Boyutu tek piksel değiştirin ya da döndürün: 8 × 8 blok ızgarası kayar, her blok yeni komşularla yeniden nicemlenir ve bozulma hızla birikir.

Bu yüzden tek kural şu: çıktıyı her zaman orijinal masterdan türetin, daha önce teslim ettiğiniz dosyadan değil. Kaliteyi yükseltmek kaybı geri getirmez; yalnızca mevcut artefaktları daha sadık saklar ve dosyayı büyütür. Aynı mantık format değişiminde de geçerli: JPEG'i AVIF'e çevirirken kaynak JPEG'in artefaktları da kodlanır, bu yüzden kazanç orijinalden dönüştürmeye kıyasla daha azdır.

PNG'de "sıkıştırma" iki ayrı iştir

PNG kayıpsızdır, yani "PNG sıkıştırma" dendiğinde iki farklı şeyden biri kastedilir. Birincisi filtre seçimi ve deflate optimizasyonudur: pikseller bit bit aynı kalır, kazanç mütevazıdır ama risksizdir. İkincisi palet nicemlemesidir; görüntü 256 renge indirgenir, bu işlem kayıplıdır ama ikon, arayüz grafiği ve düz renkli çizimlerde çoğu zaman gözle ayırt edilmez ve kazanç büyüktür.

Fotoğraf için PNG en baştan yanlış tercihtir. Saydamlık gerekmiyorsa kayıplı bir formata, gerekiyorsa alfa destekleyen modern bir formata geçin; PNG'den WebP'ye aracı hem kayıplı hem kayıpsız modu denemenize izin verir.

Sıralı akış

1. Orijinali dokunulmamış şekilde saklayın, tüm çıktıları ondan üretin.
2. Servis edeceğiniz ölçüye indirin, gerekiyorsa kırpın.
3. EXIF ve gömülü önizlemeyi temizleyin, gerekli olan tek profili koruyun.
4. İçerik tipine göre alt örneklemeyi seçin: fotoğrafta 4:2:0, metin ve grafikte 4:4:4.
5. Kalite merdivenini üretin, hedef skoru tutturan basamağı seçin.
6. Formatı içeriğe göre belirleyin, gerekiyorsa yedekli servis edin.
7. Dört kritik bölgeyi gerçek cihazda kontrol edin.