Bloga dön

Yayın tarihi · 8 dk okuma

JPG, PNG, WebP, AVIF: 2026'da Hangi Resim Formatı Ne Zaman?

2026'da web icin onemli olan dort goruntu formatinin pratik karsilastirmasi. Sikistirma yontemleri, dosya boyutlari, seffaflik, animasyon, tarayici destegi ve donanimsal kod cozme acilarindan JPG PNG WebP fark ne, AVIF nedir, hangi resim formati ne zaman secilmeli sorularina net cevaplar.

Web'de gorsel yayinliyorsaniz, sectiginiz format sayfa agirligini neredeyse her seyden daha fazla etkiler. 4 MB'lik bir hero gorseli ile 180 KB'lik bir hero gorseli arasindaki fark, dalgali bir 4G hattinda orta segment Android telefonda anlik acilan bir site ile suruncemede kalan bir site arasindaki farktir. 2026 itibariyla onemsemeniz gereken dort ana aday var: koklu JPG, kayipsiz PNG, artik her yerde calisan WebP ve giderek olgunlasan AVIF.

Bu yazida her formatin perde arkasinda nasil calistigina, bayt tasarrufunun nereden geldigine, hangi tavizleri kabul ettiginize ve ne zaman hangisini secmeniz gerektigine net bir sekilde bakacagiz. Sonunda "web icin en iyi resim formati hangisi" sorusuna 2026 kosullarinda elinizi sallamadan cevap verebilmeniz gerekiyor; ayrica bir tasarimcinin cuma aksamustu size 28 MB'lik PNG ekran goruntusu uzattigi anda ne yapmaniz gerektigini de bileceksiniz.

Oyuncular kim

JPG (bazen JPEG yazilir) 1992'de standartlasti ve hala fotograf makinelerinin coklugunda varsayilan formattir. 8x8'lik bloklara discrete cosine transform (DCT) uygular, frekans katsayilarini niceler ve Huffman ile kodlar. Tasarim geregi kayipli bir formattir ve alfa kanali yoktur; ama hizli, kod cozmesi ucuzdur ve son otuz yilda uretilen hemen her cihaz tarafindan desteklenir.

PNG, GIF'in patent baskisindan kurtulmak icin 1996'da geldi. DEFLATE algoritmasini (zip ve gzip ile aynisi) opsiyonel satir filtreleriyle birlikte kullanir; tamamen kayipsizdir. 8 bitlik gercek bir alfa kanali, indeksli paletler ve hatta kanal basina 16 bit renk destegi vardir. Bedeli ise dosya boyutudur: fotografik icerik DEFLATE ile kotu sikisir.

WebP, Google tarafindan 2010'da yayinlandi ve 2020 dolaylarinda tum tarayicilarda calisir hale geldi. Kayipli WebP, duz DCT yerine VP8 video kodekinin intra-frame tahmin modlarini kullanir. Kayipsiz WebP ise VP8L adli, renk onbellegi ve tahmin donusumleri gibi numaralar iceren ozel bir formattir. Hem kayiplisi hem kayipsizi alfa destekler ve animasyon da vardir.

AVIF, 2018'de tamamlanan ve 2024'e gelindiginde herkesin destekledigi AV1 video kodekinin sabit gorsel profilidir. Cok daha buyuk ve akilli tahmin bloklari, daha fazla donusum secenegi ve VP8'inkinden cok daha iyi bir entropi kodlayicisi vardir. 12 bit renk derinligine, alfaya, HDR'a ve animasyona kadar her seyi tasir.

Sikistirma gercekte nasil calisiyor

JPG, gorseli 8x8 bloklara boler, her bloga DCT uygular, sonra cikan katsayilari bir niceleme matrisine boler. Insan gozu ince detaylara daha az duyarli oldugu icin yuksek frekanslar, dusuk frekanslara gore cok daha sert ezilir. Dusuk kalite ayarlari aslinda bu matrisi daha buyuk bir sayi ile carpar. JPG'deki blok blok cinleyen kenar artefaktlarinin sebebi tam olarak budur: kodlayici, kenari tarif eden yuksek frekansli katsayilari saklamaya butce ayiramaz.

PNG hicbir algisal sikistirma yapmaz. Her piksel satirinin onune bir bayt filtre eki konur (None, Sub, Up, Average veya Paeth), her piksel komsularindan tahmin edilir ve kalanlar DEFLATE ile sikistirilir. Eger gorsel bir fotografsa, kalanlar hala yuksek entropili gurultu olur ve cok az tasarruf saglarsiniz. Eger sabit renkler ve net kenarlardan olusan bir ekran goruntusu ise tasarruf devasadir.

WebP kayipli kipi VP8'in mekansal intra tahminini odunc alir: her 4x4 ya da 16x16 blok, daha once cozulen komsu piksellerden on tahmin moddan biriyle tahmin edilir; donusturulup nicelenen sadece kalandir. Daha iyi tahmin, daha kucuk kalan, daha az bit demektir. Kayipsiz WebP (VP8L) buna ozel renk onbellegi, palet donusumleri ve baglama duyarli entropi kodlayicisi ekler.

AVIF pratikte modern bir video anahtar karesi kodlayicisinin tamamini kullanir. Blok boyutlari 4x4'ten 128x128'e kadar gider, donusumler arasinda farkli boyutlarda DCT, ADST ve birim donusum bulunur ve elliyi askin intra tahmin modu ince acisal cozunurlukle calisir. CABAC tarzi aritmetik kodlayici, JPG'nin Huffman tablolarindan bit basina ciddi olcude daha fazla bilgi paketler. Sonuc: ayni gorsel kalitede JPG'ye gore yaklasik yuzde 50 daha kucuk dosyalar; karsiliginda cok daha agir bir kodlama maliyeti.

Bir bakista dosya boyutlari

Ayni 4000x3000 fotograf (gun isigi manzara, seffaflik yok):
JPG  (q=85)   ->  1.180 KB
JPG  (q=92)   ->  1.940 KB
PNG  (24 bit) -> 12.420 KB
WebP (q=85)   ->    810 KB
WebP (kayipsiz) -> 9.860 KB
AVIF (q=60)   ->    495 KB
AVIF (q=80)   ->    760 KB

Ayni 1920x1080 arayuz ekran goruntusu (duz renkler, keskin yazi):
JPG  (q=92)   ->    410 KB  (yazi kenarlarinda halka)
PNG  (8 bit indeksli) ->  92 KB
PNG  (24 bit) ->    280 KB
WebP (kayipsiz) ->  74 KB
AVIF (kayipsiz) ->  88 KB

Bu sayilardan iki sonuc cikar. Birincisi, dogal fotograflarda AVIF, ayni algilanan kalitede JPG'den yaklasik yuzde 40 ila 60, WebP'den de yuzde 30 ila 40 daha kucuktur. Ikincisi, ekran goruntusu ve arayuz ihracati gibi sentetik iceriklerde kayipsiz WebP genelde acik ara onde olur; palet sigdiginda PNG-8 onun hemen ardindadir.

2026'da tarayici destegi

JPG ve PNG: yuzde 100. Tartisilacak bir sey yok. Tarayicinin oldugu her yerde, on yillik Android tabletler ve unuttugunuz gomulu WebView'lar dahil, calisir.

WebP: pratik olarak tarayici trafiginin yuzde 100'u. Safari iOS 14 ve macOS Big Sur'de 2020'de destegi acti, Chrome ile Firefox cok daha uzun suredir destekliyor, simdi cogu uygulama ici tarayici da WebP cozuyor. 2026'da tipik bir tuketici sitesinde JPG yedegi olmadan WebP sunmak artik delice degil.

AVIF: 2026'da tarayicilarin kabaca yuzde 95 ila 97'si. Chrome, Edge, Firefox, Safari (16.4+) ve onemli Android WebView'lari onu cozer. Geri kalan bosluk cogunlukla cok eski Android, bazi eski akilli televizyonlardaki gomulu WebView'lar ve uzun bir kuyrugu olusturan kurumsal kilitli cihazlardir. Halka acik bir site icin WebP veya JPG yedegiyle birlikte AVIF kullanmak guvenli bir varsayilandir.

Seffaflik, animasyon ve renk derinligi

JPG'nin alfa kanali hic yoktur. Herhangi bir tur seffafliga ihtiyaciniz varsa onu kullanamazsiniz. Tasarimcilarin gerek yokken PNG'ye sarilmasinin en yaygin sebebi tam olarak budur.

PNG, gercek 8 bitlik bir alfa kanali sunar ve kanal basina 16 bite kadar renk destekler; bu da onu grafik boru hatlarinda yuksek hassasiyetli ara format olarak kullanisli kilar. Standart PNG'de animasyon yoktur; APNG var ama destek, etiket ve emoji disinda inisli cikislidir.

WebP hem kayipli hem kayipsiz kipte alfa destekler ve animasyonlu GIF'e gore cok daha verimli bir animasyon destegi vardir. Renk derinligi kanal basina 8 bittir; web icerigi icin bu fazlasiyla yeterlidir.

AVIF alfa, animasyon, 10 ve 12 bit renk, genis renk gamlari ve HDR transfer fonksiyonlarini destekler. HDR fotograf veya genis gamli sanat eseri yayinliyorsaniz, AVIF su anda bu veriyi sadakatle tasiyabilen tek ana akim web formatidir.

Donanimsal kod cozme ve enerji

Modern donanimda JPG kod cozme o kadar ucuz ki onemli bile degil; 2015 model bir telefon bile JPG'leri ekranin gosterebileceginden hizli cozer. PNG, piksel basina daha agirdir cunku DEFLATE paralele yatkin degildir; ama PNG dosyalari ekran goruntusu tipi kullanimda zaten kucuktur, yani pratikte fark yoktur.

WebP kayipli kod cozumu, mobil yongalarin on yili askin suredir tasidigi VP8 silikon yolunu kullanir. Hizli ve enerji verimlidir. WebP kayipsiz kod cozumu cogu yongada salt yazilimdir, ama yine de butce icindedir.

Asil ilginc kisim AVIF'tedir. Yazilim kod cozumu JPG veya WebP'den belirgin sekilde daha agirdir; tek bir gorselde uc bes kat fark gorebilirsiniz. Iyi haber, 2022 sonrasi cikan cogu telefonda donanimsal AV1 kod cozumu vardir ve tarayici sabit gorselleri oraya yonlendirebilir; bu cihazlarda AVIF aslinda JPG kadar hizlidir, hatta daha hizli olabilir. AV1 silikonu olmayan eski dizustulerinde bir duvar dolusu AVIF kucuk resmi cozmek CPU profilinde gorunur, dolayisiyla onu olculu kullanin ve responsive image isaretlemesine yaslanip her zaman en kucuk varyantin cozulmesini saglayin.

Hangisini ne zaman: kisa surum

  • Mutlak en yuksek uyumluluk istiyor ve birden fazla varyanti yonetmek istemiyorsaniz fotograflarda JPG. Genelde 82 ila 88 kalite araligi en iyi noktadir.
  • Ekran goruntuleri, arayuz ihracatlari, keskin kenarli logolar ve hizli bir cozum gerektigindeki kayipsiz seffaflik icin PNG. Palet sigdiginda 8 bit indeksli PNG'yi tercih edin.
  • 2026 icin varsayilan web formati olarak WebP. Fotograflarda kayipli WebP, daha once PNG olarak kullandiginiz arayuz varliklari ve simgeler icin kayipsiz WebP.
  • Bant genisligi ve Core Web Vitals en kritik oldugunda, HDR veya genis gamli icerik sunarken ya da olabilecek en kucuk LCP gorseli istediginizde AVIF. Daima picture etiketi ile WebP veya JPG yedegi koyun.
  • GIF'i tamamen birakin. Animasyonlu WebP ve AVIF, ayni bayt butcesinde daha kucuktur ve daha iyi gorunur.

Pratik bir donusturme akisi

Cogu ekibin modern formatlardan yararlanmak icin sasaali bir build hattina ihtiyaci yoktur. Asgari calisan akis basittir: orijinal kamera ya da tasarim aracinin ihracatini hakikat kaynagi olarak saklayin, yayim sirasinda JPG, WebP ve AVIF varyantlarini uretin. Tek seferlik donusumler icin bir CLI saniyeler icinde isi bitirir.

# Tek bir fotografi uc modern varyanta donustur
cwebp -q 85 hero.jpg -o hero.webp
avifenc --min 20 --max 30 -s 6 hero.jpg hero.avif

# picture etiketiyle tarayicinin anladigini secmesini saglayin
# <picture>
#   <source srcset="hero.avif" type="image/avif">
#   <source srcset="hero.webp" type="image/webp">
#   <img src="hero.jpg" alt="..." width="1600" height="900">
# </picture>

Komut satiri araclari kurmak istemiyor ve elinizde sadece birkac gorsel varsa, Multilities tarayicida calisan bir donusturucuyu /tools/image-convert adresinde sunar; JPG, PNG, WebP ve AVIF arasinda her yone donusum yapar ve dosyalariniz hicbir yere yuklenmez, her sey sekmenizde calisir. Mevcut bir JPG veya PNG'den format degistirmeden ekstra bayt sikmak icin /tools/image-compress sectiginiz kalitede yeniden kodlar ve oncesi sonrasi bayt sayilarini gosterir.

WebP vs PNG: bir turlu olmeyen soru

2026'da hala en yaygin karisiklik WebP vs PNG sorusudur. Kisa cevap: kayipsiz WebP neredeyse her web kullanim senaryosunda PNG'den kesin olarak daha iyidir. Daha kucuktur, ayni alfa kanalini destekler ve onemsediginiz her tarayici onu cozer. Bugun PNG kullanmaya devam etmek icin tek gercekci sebepler, WebP'yi kabul etmeyen alt boru hatlari (bazi reklam aglari, eski CMS eklentileri, bazi baski isleyisleri) ve tasarimcilar arasinda PNG'nin fiili degis tokus formati olmasidir.

Yeni bir urunu sifirdan kuruyorsaniz, varlik boru hattinizi varsayilan olarak arayuz icin kayipsiz WebP, fotograflar icin kayipli AVIF olacak sekilde ayarlayin; ancak bir sey modern formati kabul etmediginde PNG ve JPG'ye geri donun.

Sik karsilasilan tuzaklar

  • Bir JPG'yi daha yuksek kalitede tekrar JPG olarak kaydedip dosyanin daha iyi gorunmesini beklemeyin. Orijinal niceleme zaten bilgiyi atti; yapacaginiz tek sey dosyayi buyutmek olur.
  • Ekran goruntulerini JPG olarak kaydetmeyin. Yazinin etrafindaki blok blok halka karakteristiktir ve duzeltilemez. PNG ya da kayipsiz WebP kullanin.
  • Renk profiline dikkat edin. AVIF ve modern WebP kodlayicilari ICC profilini varsayilan olarak korur; eski araclar onu siyirir ve gorseliniz genis gamli ekranlarda renk kayar.
  • AVIF kodlayicinizin kalite olceginin nasil calistigini test edin. Farkli kodlayicilar farkli yontemler kullanir: libavif 0 ila 100 arasi kalite, avifenc ise tarihsel olarak dusugun iyi oldugu 0 ila 63 arasi nicelendirici min/max degerleri kullanir.
  • Anlik yeniden kodlayan bir CDN kullaniyorsaniz, gercekten Accept basligi uzerinden AVIF pazarligi yaptigindan emin olun. Cogu CDN bir ayar acmadiginiz surece sadece WebP sunar.

Peki ya JPEG XL

JPEG XL teknik acidan AVIF ile rekabet eden, gercekten iyi bir formattir; ek olarak mevcut JPG'leri kayipsiz olarak yaklasik yuzde 20 daha kucuk hale donusturebilme gibi essiz bir numarasi vardir. 2026 itibariyla Safari onu sunuyor, Firefox bayrak arkasinda destekliyor, Chrome hala varsayilan olarak acmiyor. Bu degisene kadar JXL'i konuslandirmaktan cok izlenecek bir format olarak gorun. Bugun cross-browser destegi olan modern format AVIF'tir.

30 saniyelik karar agaci

Fotografsa AVIF ve WebP uretin, JPG'ye yedek olarak donun. Seffaflik veya keskin kenarlar varsa kayipsiz WebP uretin, PNG'ye yedek olarak donun. Bir build adimi calistiramiyorsaniz fotograflar icin JPG, geri kalan icin PNG yayinlayin ve hayatiniza devam edin. Goruntu formatlari 2026'da artik bir arastirma projesi degil; cevaplar buyuk olcude oturmus, araclar olgun. Dogru formati secin, yedeginizi koyun ve kazandiginiz zamani baska bir seye harcayin.

Bu araçları dene