Png, jpg, gif formatları nedir? Bu formaların aralarında ne fark var?
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 png gif jpg karşılaştırma png nedir
@kutlugalp alattin 3 yıl önce
Eline sağlık ben hiç resimlere dikkat etmiyordum bu gün dikkat ettim fazla resim var sitede onları biraz azaltayım çünkü birde o siteye AKK'yi aşınca girmek var :D kutlugalp 3 yıl önce
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 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.
Ö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 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