İnternette en çok kullanılan resim formatları; JPG, PNG, GIF ve SVG'dir. Bu makalemde bu formatların tanımlarından, birbirleri arasındaki farklardan, avantaj ve dezavantajlarından, hangi amaçlar için kullanılabileceklerinden bahsetmek istiyorum. İlk olarak internette en fazla kullanılan formatların istatistiksel verilerine bakalım;

Ayrıca, internetteki en popüler 10 milyon websitesi dikkate alındığında, en hızlı büyüyen resim formatları SVG ve PNG 'dir. Bu sitelere günlük 635 adet SVG formatı eklenirken, eklenen PNG formatının sayısı günlük, 390'dır. (Veri Kaynağı : w3tech)

Öncelikle, resim formatları iki temel sisteme göre oluşturulur. Bunlar, Izgara (Raster) ve Vektör (Vector) sistemleridir. Izgara sisteminde resim, ızgara şeklinde parçalara ayrılarak küçük alanlar (piksel) oluşturulur. Oluşturulan her alana renkler atanır ve görüntü elde edilir. Vektör sisteminde ise görüntü tamamen matematiksel formüllerle oluşturulur. Bu yüzden vektör formatındaki resimler büyütülünce herhangi bir bozulmaya uğramaz. Çünkü resim her boyutlandırıldığında, matematiksel formüller çalışır ve resmin boyutlandırılmış hali oluşturulur. Bunun yanında ızgara sistemiyle oluşturulmuş resimler büyütülünce bozulmalar görülür.

JPG, PNG ve GIF formatları, ızgara (raster) sistemi ile oluşturulurken, SVG formatı vektör sistemi ile oluşturulur. Şimdi dilerseniz formatlarımızı tek tek inceleyelim.

JPG (Joint Photographic Experts Group)

JPG veya JPEG, 1992 yılında bir grup tarafından, fotoğraflar için piyasaya sürülen resim formatıdır. Başarılı bir sıkıştırmaya sahip olması nedeniyle uzun süre internette en fazla kullanılan format olmuştur. İnternet hızının artmasıyla, PNG formatının kullanım oranı, JPG formatını geçmiştir. Buna rağmen, fotoğraf makinelerinde, cep telefonlarında, kamera sistemlerinde hala en fazla kullanılan formattır. JPG formatı kayıplı (lossy) sıkıştırma sistemine sahiptir. Bu sıkıştırma yöntemi, gözün algılayamadığı veya az algıladığı renk alanlarını resimden silerek resimlerin boyutunu küçültür. Sıkıştırma oranı ayarlanarak, boyut veya kalite önemine göre resimler elde edilebilir. Sıkıştırmanın yüksek oranda uygulanması, resimde çok fazla alanın silenmesine neden oalcağından, resimde bozulmalar oluşur.

PNG (Portable Network Graphics -Taşınabilir Ağ Grafikleri-)

PNG kayıpsız (lossless) sıkıştırmaya sahip bir resim formatıdır. PNG sıkıştırmasında resimdeki hiçbir alan silinmez. Böylece yüksek kalitede resimler elde edilir. Kayıpsız sıkıştırma kullanmasından dolayı, bu format ile oluşturulan resimlerin boyutları genellikle JPG formatıyla oluşturulmuş resimlerin boyutlarından büyüktür. PNG formatı, kaliteli resimlerin yanında, alfa kanalını destekleyen bir formattır. Alfa kanalı, arka planı şeffaf resimlerin oluşturulmasını sağlar. JPG formatında bu özellik yoktur, eğer bir arkaplan belirlenmemişse, JPG türü resimlerde arka plan beyaz renktedir. Örneğin aşağıdaki eve arka planı şeffaf olan PNG formatında bir ağaç eklemek istersek,

sonuç aşağıdaki gibi olur.

JPG formatında bir ağaç ile aşağıdaki sonuç elde edilir.

GIF (Graphics Interchange Format -Grafik Değişim Formatı-)

GIF formatı, 1987 yılında web için geliştirilmiş bir formattır. PNG gibi kayıpsız sıkıştırma sistemine sahip bu format, sadece 256 renk desteğine sahiptir (JPG ve PNG milyonlarca renk desteği sunar). Bu açıdan GIF formatı genellikle az rengin kullanıldığı grafikler için idealdir. Ayrıca animasyon özelliği ve şeffaf arka plan desteği olması, bu formatın hala kullanılabilir olmasına sağlamaktadır. (Şeffaf arka plan desteği, PNG formatı kadar gelişmiş değildir)

SVG (Scalable Vector Graphics -Boyutlandırılabilir Vektör Grafik- )

SVG, XML tabanlı, vektör formatındaki grafik türüdür. Daha öncede belittiğim gibi bu format ile oluşturulmuş grafikler büyütülünce herhangi bir bozulma oluşmaz. Fakat matematiksel formüllerle oluşturulmaları, fotoğraf gibi karmaşık resimlerde başarısız olmasına neden olur (SVG formatı ile oluşturulan fotoğraflar oldukça kalitesizdir). Bu yüzden basit grafikler ve animasyon sistemlerinde kullanırlar. SVG formatı özel programlar ile oluşturulabilir (Adobe Illustrator gibi).

Hangi Format Nerede Kullanılmalı?

JPG ve PNG formatları, fotoğraf gibi kompleks resimler için en uygun olanlarıdır. Eğer fotoğraf boyutu sizin için önemli ise JPG, kalite daha önemli ise PNG formatı seçilmelidir. Küçük boyutlu resimler için, kalite açısından PNG formatını kullanmanızı öneririm.

Şeffaf arka planlı bir resme ihtiyacınız varsa PNG veya GIF formatlarını kullanabilirsiniz. Elbetteki GIF formatının 256 renk desteklediğini tekrar hatırlatalım. Yani kaliteli ve şeffaf arkaplan için kullanacağınız format PNG olmalıdır.

Basit animasyonlu resimler için GIF tercih edilir.

Basit ve sıklıkla boyutlandırılan grafikler için SVG formatı tercih edilmelidir. Ayrıca SVG formatı ile gelişmiş animasyonlar da yapılabilir. Fakat bu animasyonları oluşturmak GIF animasyonlarına göre oldukça zordur. Bazı web teknolojilerinden ve programlardan yararlanmak gerekir.

SVG'lerle oluşturulan çizgi animasyon makalesine buradan ulaşabilirsiniz.