JPG, PNG ve GIF Arasındaki Farklar

Bir web geliştiricisi iseniz, genel olarak grafik ve resimlerle de haşır neşir olmaktasınız. Bugün web ortamında kullanılan başlıca üç resim formatı var. Bu üç değişik resim formatınında kendilerine göre bazı getirileri ve götürüleri var. Belli yerlerde belli bir formatı seçerek daha hızlı yüklene daha kaliteli resimleri sitenize ekleyebilirsiniz.

JPEG (Joint Photographic Experts Group)

16 24 bitlik JPEG formatı , fotoğraflar akılda olarak tasarlanmıştır. Bu yüzden bir defasında milyonlarca (16.7 milyon) renk gösterebilir. JPEG’in sıkıştırma teknolojisi GIF’in aksine bazı bilgileri atar. Resmi sıkıştırma isteğinize göre atılan veri gözle görünmez veya görünür olabilir. Resim bir kere sıkıştırıldıktan sonra yapılan değişiklikler geri
alınamaz. Dolayısı ise orijinal resimde veri kaybına yol açmamak için resmin orijinalini saklamayı unutmayın. JPEG formatı resmi,
resimde bulunan bazı verileri atlayarak kaydetme üzerine dayalıdır. Daha sonra resim gösterilirken bu atlanan yerler doldurulmaya çalışılır. Bir resmi %0 oranında sıkıştırmak, resimde kalite kaybına yol açmazken, %75 ve üzeri bir sıkıştırma gözle görülür bozulmalara yol açabilir. Genelde %60 civarı sıkılştırma resim kalitesi ve dosya boyutu arasında optimal olarak kabul edililebilir. Tabii ki daha önceden sıkıştırılmış bir JPEG dosyasını tekrar sıkıştırmak veri kaybını arttırarak kaliteyi düşürecektir.

PNG (Portable Network Graphics)
PNG ilk olarak web için tasarlanmıştır bir resim formatıdır. GIF resim formatında bulunan patent hakları yüzünden ve GIF formatının sınırlamalarına sahip olamayan bir resim formatı üretmek amacı ile yaratıldı. (GIF patenti artık zaman aşımına uğramış durumda)

PNG’nin iki biçimi bulunmakta, PNG-8 ve PNG-24. PNG-8 adından anlaşılıcağı ise 8 bitlik bir format, bu format sadece 256 renke kadar destek veriyor ve bir bitlik de saydamlık bilgisi taşıyabiliyor. Ama Fireworks ya da becerikli herhangi bir grafik programı ile kaydedilen bir PNG, bir GIF dosyasından gözle görünür oranda daha küçük dosya boyutuna sahiptir. Bunun nedeni PNG’nin sıkıştırmasının GIF’e göre daha etkili olmasıdır.

PNG-24 ise JPEG’in gösterebildiği kadar renk gösterebilen 24 bitlik bir biçimdir. Fakat GIF gibi loseless (kayıpsız) bir format olduğu için dosya boyutları JPEG’e göre farkedilebilir orada büyük olabilirler.

PNG’nin en büyük avantajlarından biri alfa kanallardır (alpha channels). Diğer formatların ilkel saydamlık seçeneklerine rağmen (bir piksel ya saydamdır ya da değildir) apfa kanallar bir piksele 0 ile 255 arası bir saydamlık verir. Bu sayede resimler her hangi bir arka planda bile yarı-saydam görüntüye sahip olabilirler. Bunun tek dezavantajı ise Microsoft Explorer 6′nın bunu desteklememesi. (sürpriz!)

PNG doğrudan GIF tarzı bir animasyonu desteklemez. Bunun yerine MNG (Multiple-image Network Graphics) adlı bir türevi animasyonları desteklemektedir. Fakat bu format daha henüz çok yaygın değil.

GIF (Graphics Interchange Format)
GIF formatı uzun zamandır webde en çok tercih edilen resim formatı oldu. Bunun en büyük nedeni küçük dosya boyutuna sahip olması idi. GIF formatı aynı rengin büyük alanlara hakim oldukları resimleri sıkıştırmada çok başarılır. Aynı zamanda kayıpsız (lossless) bir format olarak bilinir. Bunun nedeni resmin bulanık veya karışık hale gelmemesidir. GIF formatı LZW denilen bir sıkıştırma biçimi kullanır. Bu skıştırma tekniği kısaca tekrarlanan pikselleri bularak, onları sıkıştırır ama kaliteden ödün vermez. GIF formatı 8 bitliktir.

Ayrıca GIF formatı uzun bir süredir (ve bazen hala) animasyon ekleyebilmek için mümkün olan tek yoldur. Bunu birden fazla katmanı sırayla gösterek yapar.

GIF resimleri en fazla 256 renk gösterebilir:
GIF formatında kaydedilmiş bir resim en fazla 256 renk gösterebilir. Bu yüzden fotoğraflar gibi çok fazla rengin sahip olduğu resimler için uygun değildir. Her ne kadar 2 değişik pikseli yan yana koyarak değişik renkleri gösterebiliyor gibi dursa da bu genelde çok fazla tekil rengin bulunduğu resimlerde zayıf bir performansa neden olur.
Saydamlık (Transparency):
GIF formatı saydam rengi desteklemektedir. Bu sayede resmin bir bölümü saydam hale getirilerek üzerinde bulunduğu arka planın veya resmin üzerinde rahatlıkla görüntülenebilir.
Birbirine Dolanma (Interlaced)
GIF resimler Interlaced denilen bir teknoloji ile kaydedilebilirler. Bu kaydedilen resimlere daha hızlı yükleniyormuş hissi verir. Baştan aşağı resmi yüklemek yerine web tarayıcı resmin bütün ama belirsiz, düşük detaylı bir halini yükler, daha fazla bilgi geldikçe resim giderek netleşir.

Progressive JPEG
Aynı Interlaced GIF dosyaları da hızlı yüklenme aldanmasını vermek için progressive olarak kaydedilebilirler. Bu sayede resim bir kaç okuma sonunda netleşmek üzere bulanıktan itibaren yüklenmeye başlar. Bazı grafik programları kaç okumadan sonra resmin netleşeceğini ayarlamanıza izin verirler.

Hangi resim formatı nerede kullanılmalı:

GIF: Tekil renklerin az olduğu veya tekil renklerin büyük alanlara yayıldığı resimler için idealdir. Özellikle siyah-beyaz resimler, grafikler gibi yerler için idealdir. Ayrıca basit animasyonlar için Flash gibi diğer teknolojilere alternatif olabilirler.

JPEG: Genel olarak JPEG resimler GIF’in renk sınırlaması yüzünden kalite kaybına sebep olan resimlerde ve tekil renklerin çok fazla olduğu resimlerde kullanılır. Büyük renk bloklarına sahip basit resim veya grafiklerde JEPG kullanmak kenarların lekeli görüntülenmesine sebep olabilir.

PNG: Web’in yeni formatı, GIF resimler yerine bunları kullanmak aynı kalitede daha düşük dosya boyutlarına sahip resimler sunacaktır. 24 bitlik sürümü ise JPEG’e göre daha kaliteli görüntü sunmasına rağmen daha büyük dosya boyutlarına yol açabilir. Dolayısı ile boyutun değil kalitenin önemli olduğu durumlarda kullanılması önerilir.