Png, jpg, gif formatları nedir? Bu formaların aralarında ne fark var?

Png  nedir?

Jpg nedir?

Gif nedir?

png, jpg, gif formarları arasında ne fark var?

Web tasarımında ne zaman png kullanılmalı?

Web tasarımında ne zaman jpg kullanılmalı?

Web tasarımında ne zaman gif kullanılmalı?

Png, jpg, gif formatları nedir? Bu formaların aralarında ne fark var?

png, jpg, gif çok popüler resim formatıdır. Özellikle web ortamında karşınıza çıkan resim, fotoğraf gibi görsel unsurlar jpg, png ve gif formatlarından birine sahiptir. Web ortamında görsel unsurların boyutları çok önemlidir. Yüksek boyutlu görsel unsurlar yavaş yüklenir ve web sitesinin hızını düşürürler.

jpg veya jpeg nedir?

jpg uzantısı bazen karşınıze jpeg şeklinde çıkar. Jpg, Joint Photographic Expert Group ifadesinin baş harflerinden oluşur. Jpg formatının en avantajlı yanı sıkıştırma özelliğinin olmasıdır. Fotoğrafları jpg ile sıkıştırarak boyutunu düşürebilirsiniz. Fakat bu durumun dezavantajarı da vardır. Sıkıştırma denilen işlemde aslında birbirine yakın renk grupları fotoğraftan çıkartılır. Bu da fotoğrafın kalitesinin düşmesine sebep olur. Jpg formatında, jpg kalite oranları %60, %70, %80 gibi ifadeler ile gösterilir. Bu oran ne kadar düşürse resmin kalitesi o kadar düşer. Web ortamında genelde %60-%75 jpg kalitesi tercih edilir. Kalitenin oranını Photosop, irfanview gibi programlar ile ayarlayabilirsiniz. Kalite azaldıkça resmin boyutu azalır, web sitesine binen yük azalır.

Jpg formatı webde yüksek renk barındıran görsellerde tercih edilir.  Jpg formatı 16 milyon renge kadar destek sağlar. Transparan desteği yoktur.

.Gif  nedir?

Özellikle az renk barındıran görseller (ikon, çizim) .gif formatını kullanır.  .gif formatı 256 renge kadar destek sağlar. Jpg formatından farklı olarak transparan görseller gif olarak kaydedilebilir.  Yine animated gif olarak yani basit animasyonlar yapabileceğiniz bir formattır. Gif formatında hazırlanmış farklı görselleri bir araya getirerek animated gif oluşturabilirsiniz. 

Örnek bir animated gif:

.png nedir?

.png formatı gif ve jpg'den daha yeni bir formattır. Bu formatta bir sıkıştırma yok ve yüksek kalitesi görselleri kayıpsız destekliyor. png formatının .jpg formatından üstün olan yanlarından bir tanesi .gif formatı gibi transparan desteğinin olması. Png kendi içinde PNG-8 ve PNG-24 şeklinde iki ayrı formata sahip. Png-8, .gif formatına, Png-24 ise jpg formatına daha yakın.  Bu benzerlik desteklenen renk sayılarından kaynaklanıyor.

Web tasarımında .jpg  ne zaman kullanılmalı?

• Görseliniz çok renkli ise (256 renk üzeri)
• Fotoğraf için uygun format
• Kalitesi düşürüldüğünde bozulma az olan fotoğraflarda (photoshop gibi bir programda kalite ile oynayarak görebilirsiniz)
• Dosya boyutunun önemli olduğu durumlarda, çok renkli görsellerin kalitesi düşürülerek boyut azaltılabilir.

Web tasarımında .gif  ne zaman kullanılmalı?

• 256 renkten daha az renge sahip görsellerde
• İkon, çizimler için uygun
• Yukarıdaki gibi basit animasyon, videolar hazırlamakta
• Transparan, az renkli görsel gerektiğinde

Web tasarımında .png  ne zaman kullanılmalı?

• ikon, çizim gibi az renkli görseller için kullanılabilir
• Çok renk barındıran fotoğraf gibi görsellerde arkaplanda transparanlık gerekiyorsa kullanılabilir
• Dosya boyutunun çok önemli olmadığı görsellerde