1. Ana səhifə
2. Şəkil formatları

Şəkil formatlarının müqayisəsi: JPEG, PNG, WebP və AVIF

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

Yan yana müqayisə

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

JPEG — univərsal temel

Necə işləyir

JPEG (Joint Photographic Experts Group) 1992’de standardize edildi və dört biçimin en eskisidir. 8×8 piksel bloklarda kayıplı ayrık kosinüs dönüşümü, ardından niceleme və entropi kodlaması kullanır. Keyfiyyət 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 vərim alır; her JPEG çözücü bunları okuyabilir.

Ən yaxşı istifadə

Pürüzsüz ton geçişleri və bol detay içeren fotoşəkilik içerik — portret, mənzərə, ürün fotoşəkilı, kahraman görüntüleri.

Üstünlüklər

• Dünyadaki neredeyse her şəkil şəkilleyici tarafından dəstəklenir.
• Neredeyse her yerde donanım hızlandırmalı çözme.
• Olgun optimallaşdırma ekosistemi (MozJPEG, jpegli).

Çatışmazlıqlar

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

PNG — itksiz və şəffaf

Necə işləyir

PNG (Portable Network Graphics) 1990’ların ortasında GIF’in pulsuz alternatifi olarak doğdu. Kesin itksizdı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 yaxşı istifadə

İnterfeys grafikleri, ikonlar, ekran şəkilləri, diyagramlar, çizim, düz renkli loqolar və gerçek alfa kanalı gereken her şey.

Üstünlüklər

• İtkisiz — pikseller gidiş-dönüşte aynen kalır.
• Tam 8 bit alfa, kanal başına 16 bit’e kadar.
• Univərsal dəstək.

Çatışmazlıqlar

• Fotoşəkillərda büyük — çoğu zaman JPEG/WebP/AVIF-dən kat kat fazla.
• Orijinal spesifikasyonda animasiya yok (APNG sonradan gelen bir genişləndirmədır).

WebP — Google-ın web öncelikli formatı

Necə işləyir

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 və animasyon destekler. İtkili 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 yaxşı istifadə

AVIF henüz güvənli olmayan genel web teslimi — fotoşəkillər, şəffaflıqlı interfeys sprite’ları, animasiyalu GIF alternatifleri və AVIF altında yedek katman.

Üstünlüklər

• Tek format fotoşəkil, grafik, alfa və animasiyau kapsar.
• Benzer keyfiyyətde JPEG və PNG-dən belirgin şekilde daha küçük.
• Geniş dəstək: 2020’den beri tüm güncel brauzerlar.

Çatışmazlıqlar

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

AVIF — sıxılmada güncel lider

Necə işləyir

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 və 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ı vərir.

Ən yaxşı istifadə

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

Üstünlüklər

• Sınıfının en iyi sıxılması — genelde JPEG-dən %40–60 daha küçük.
• Alfa, animasiya, HDR, geniş gam və 10/12 bit derinlik dəstəkler.
• Telifsiz və açık.

Çatışmazlıqlar

• Yavaş kodlanır — derleme zamanı və ya asenkron kodlama planlayın.
• Safari desteği yalnızca sürüm 16’da (2022) eklendi.
• Sentetik grafiklerde itksiz WebP və ya PNG kadar zarif değil.

Hansı formatı kullanmalıyım?

• Fotoşəkillər, tam genişlik kahraman görüntüler: Birincil AVIF, <picture> ilə WebP və JPEG yedekleri.
• Şəffaflıqlı interfeys (ikonlar, loqolar): Eski uyumluluk üçün PNG, daha küçük yük üçün itksiz WebP.
• Çizim, ekran şəkilsü, diyagram: PNG (və ya itksiz WebP) — JPEG/AVIF artefaktı keskin kenarlarda acımasızdır.
• Animasiyalu GIF değişimi: WebP və ya AVIF — ikisi de çok daha küçük və gerçek alfa sunar.
• Bugün her brauzer üçün tek format: Fotoşəkillər üçün JPEG, grafikler üçün PNG. En küçük seçenek değil, sıfır uyumluluk borcu.

Praktikada yalnız birini seçmək məcburiyyətində deyilsiniz. <picture> içinde önce AVIF, sonra WebP, en sonda JPEG vəya PNG sunun — her tarayıcı çözebildiği en küçük sürümü alır.