1. Bosh sahifa
2. Rasm formatlari

Rasm formatlarini taqqoslash: JPEG, PNG, WebP va AVIF

Dört format modern webdeki görüntülerin %99’undan fazlasını kapsar. Siqish, şeffaflık, animasyon va tarayıcı desteği arasında çok farklı ödünleşimler sunarlar. Doğru olanı seçmek için pratik bir rehber.

Yan-yana muqayise

Önce kısa özet, aşağıda her biçimin tam açıklaması.

JPEG — evrensel temel

Qanday ishlaydi

JPEG (Joint Photographic Experts Group) 1992’de standardize edildi va dört biçimin en eskisidir. 8×8 piksel bloklarda kayıplı ayrık kosinüs dönüşümü, ardından niceleme va entropi kodlaması kullanır. Sifat tek bir 1–100 sayısıyla kontrol edilir. MozJPEG gibi modern kodlayıcılar bit akışını değiştirmeden biçimden %10–20 daha fazla varim alır; her JPEG çözücü bunları okuyabilir.

Ən yaxshi istifade

Pürüzsüz ton geçişleri va bol detay içeren fotosuratik içerik — portre, manzara, ürün fotosuratı, kahraman rasmleri.

Üstunlukler

• Dünyadaki neredeyse her rasm rasmleyici tarafından desteklenir.
• Neredeyse her yerde donanım hızlandırmalı çözme.
• Olgun optimizatsiya ekosistemi (MozJPEG, jpegli).

Çatishmazliqlar

• Alfa kanalı yoxdur — arka planlar düzleştirilmelidir.
• Metin, çizim va keskin kenarlarda blok artefaktları.
• Kanal başına yalnızca 8 bit.

PNG — kayıpsız va şeffaf

Qanday ishlaydi

PNG (Portable Network Graphics) 1990’ların ortasında GIF’in bepul alternatifi olarak doğdu. Kesin itkisızdır: satır başına piksel filtrelemesinin üzerinde DEFLATE sıkıştırması. oxipng (optipng’nin Rust portu) tek bir pikseli değiştirmeden en küçük temsili bulmak için filtre/sıkıştırma kombinasyonlarını dener.

Ən yaxshi istifade

Interfeys grafikleri, ikonkalar, ekran rasmlarni, diyagramlar, çizim, düz renkli logotiplar va gerçek alfa kanalı gereken her şey.

Üstunlukler

• Yo'qotishsiz — pikseller gidiş-dönüşte aynen kalır.
• Tam 8 bit alfa, kanal başına 16 bit’e kadar.
• Univarsal destek.

Çatishmazliqlar

• Fotosuratlarda büyük — çoğu zaman JPEG/WebP/AVIF dan kat kat fazla.
• Asl spesifikasyonda animasyon yok (APNG sonradan gelen bir uzantıdır).

WebP — Google’ın web öncelikli formatı

Qanday ishlaydi

WebP 2010’da Google tarafından VP8 video codec’ine dayalı olarak yayınlandı; sonra ayrı bir kayıpsız mod eklendi. Tek kapsayıcıda hem kayıplı hem kayıpsız sıkıştırma, isteğe bağlı alfa va animasyon destekler. Yo'qotishli modda genelde aynı algılanan kalitede JPEG’den %25–35 daha küçük dosyalar üretir; kayıpsız modda PNG’ye göre yaklaşık %20–30 kazanç sağlar.

Ən yaxshi istifade

AVIF henüz güvanli olmayan genel web teslimi — fotosuratlar, şeffaflıklı arayüz sprite’ları, animasyonlu GIF alternatifleri va AVIF altında yedek katman.

Üstunlukler

• Tek format fotosurat, grafik, alfa va animasyonu kapsar.
• Benzer kalitede JPEG va PNG dan belirgin şekilde daha küçük.
• Geniş destek: 2020’den beri tüm güncel brauzerlar.

Çatishmazliqlar

• Kanal başına 8 bit — HDR yoxdur.
• Bazı düşük uç cihazlarda JPEG’den daha yavaş çözülür.

AVIF — siqishda güncel lider

Qanday ishlaydi

AVIF (AV1 Image File Format), Alliance for Open Media’nın 2019’da yayınladığı AV1 video codec’inin durgun görüntü profilidir. 12 bit renk, tam alfa, HDR, geniş gam va film greni sentezi destekler. Referans kodlayıcı (aom-av1, libavif tarafından kullanılır) yavaştır ancak gerçek dünya fotoğraflarında bugünkü en iyi sıkıştırmayı varir.

Ən yaxshi istifade

Kahraman rasmler, foto galerileri va CPU süresinden çok bant genişliğinin önemli olduğu her yer. <picture> öğesinde üst katman olarak iyi çalışır.

Üstunlukler

• Sınıfının en iyi siqishsı — genelde JPEG’den %40–60 daha küçük.
• Alfa, animasyon, HDR, geniş gam va 10/12 bit derinlik destekler.
• Telifsiz va açık.

Çatishmazliqlar

• Sekin kodlanır — derleme zamanı yoki asenkron kodlama planlayın.
• Safari desteği yalnızca sürüm 16’da (2022) eklendi.
• Sentetik grafiklerde itkisız WebP yoki PNG kadar zarif değil.

Hansi formatı kullanmalıyım?

• Fotosuratlar, tam genişlik kahraman rasmler: Birincil AVIF, <picture> bilan WebP va JPEG yedekleri.
• Shaffofliklı arayüz (ikonkalar, logotiplar): Eski uyumluluk uchun PNG, daha küçük yük uchun itkisız WebP.
• Çizim, ekran rasmsü, diyagram: PNG (yoki itkisız WebP) — JPEG/AVIF artefaktı keskin kenarlarda acımasızdır.
• Animatsiyalu GIF değişimi: WebP yoki AVIF — ikisi de çok daha küçük va gerçek alfa sunar.
• Bugün her brauzer uchun tek format: Fotosuratlar uchun JPEG, grafikler uchun PNG. En küçük seçenek değil, sıfır uyumluluk borcu.

Praktikada yalniz birini sechmek mecburiyyetinde deyilsiniz. <picture> içinde önce AVIF, sonra WebP, en sonda JPEG vaya PNG sunun — her tarayıcı çözebildiği en küçük sürümü alır.