Blog'a Dön
Görsel 5 dk okuma19 Nisan 2025

JPG, PNG, WebP: Hangi Görsel Formatı Ne Zaman Kullanılır?

Web'de performans için doğru görsel formatını seçme rehberi. WebP avantajları, PNG şeffaflığı, JPG sıkıştırma.

#JPG#PNG#WebP#Görsel#Web

Görsel Formatları Neden Bu Kadar Önemlidir?

Bir web sitesinde doğru görsel formatını seçmek, hem kullanıcı deneyimini hem de arama motoru sıralamanızı doğrudan etkiler. Yanlış format seçimi; gereksiz yere büyük dosya boyutlarına, yavaş sayfa yüklemesine ve kalite kayıplarına neden olabilir. Türkiye'de internet hızları bölgeden bölgeye değiştiği için görsel boyutlarını optimize etmek, tüm kullanıcılara iyi bir deneyim sunmak açısından kritiktir.

Bu rehberde JPG, PNG, WebP ve SVG formatlarını karşılaştıracak; hangi durumda hangisini seçmeniz gerektiğini somut örneklerle açıklayacağız.

Temel Görsel Formatları Karşılaştırması

FormatEn İyi KullanımŞeffaflıkDosya BoyutuAnimasyon

JPG / JPEG Formatı: Nedir, Ne Zaman Kullanılır?

JPG (Joint Photographic Experts Group), 1992 yılında geliştirilen ve günümüzde hâlâ en yaygın kullanılan görsel formatıdır. Özellikle fotoğraflar için tasarlanmış bu format, kayıplı sıkıştırma kullanır.

JPG'nin Avantajları

  • Küçük dosya boyutu: %80 kaliteyle çekilen bir fotoğraf, orijinalinden %60-70 daha küçük olabilir
  • Evrensel destek: Her cihaz, her tarayıcı ve her uygulama JPG'yi açabilir
  • Fotoğraf kalitesi: Milyonlarca renge destek vererek gerçekçi görseller sunar

JPG'nin Dezavantajları

  • Şeffaflık desteği yoktur (PNG veya WebP kullanmalısınız)
  • Her kaydetmede kalite biraz daha düşer ("generation loss")
  • Keskin kenarlarda ve metinlerde bulanıklık (artifakt) oluşabilir

JPG Ne Zaman Kullanılır?

  • Tatil fotoğrafları, ürün görselleri, blog kapak görselleri
  • Sosyal medya paylaşımları (Instagram, Facebook)
  • E-posta ekleri (uyumluluk öncelikli)
  • Gradyan içeren görseller ve doğa fotoğrafları

PNG Formatı: Şeffaflık Gerektiren Görseller İçin

PNG (Portable Network Graphics), 1996 yılında GIF'in patentli yapısına alternatif olarak geliştirilmiştir. En önemli özelliği alfa kanalı desteğiyle şeffaflık sunmasıdır.

PNG'nin Avantajları

  • Tam şeffaflık desteği (logolar, ikonlar, sticker'lar)
  • Kayıpsız sıkıştırma — kalite hiç düşmez
  • Keskin kenarlar ve metinler mükemmel görünür
  • Ekran görüntüleri için idealdir

PNG'nin Dezavantajları

  • Fotoğraflarda JPG'den çok daha büyük dosya boyutu
  • Animasyon desteği yoktur (APNG standardı çok az desteklenir)

PNG Ne Zaman Kullanılır?

  • Şirket logoları ve marka görselleri
  • İkonlar ve UI elementleri
  • Ekran görüntüleri (özellikle metin içerenleri)
  • Şeffaf arka plan gerektiren e-ticaret ürün görselleri

WebP Formatı: Modern Webin Tercihi

WebP, Google tarafından 2010 yılında duyurulmuş ve modern webin standart görsel formatı olmaya aday bir teknoloji olarak öne çıkmaktadır.

WebP'nin Teknik Üstünlükleri

  • JPG'ye kıyasla: Aynı kalitede %25-35 daha küçük dosya boyutu
  • PNG'ye kıyasla: Şeffaf görsellerde %26 daha küçük
  • Hem kayıplı hem de kayıpsız sıkıştırma destekler
  • Animasyon desteği vardır (GIF'in yerini alabilir)

WebP Tarayıcı Desteği (2025 itibarıyla)

  • Google Chrome: Tam destek (v32+)
  • Mozilla Firefox: Tam destek (v65+)
  • Apple Safari: Tam destek (v14+)
  • Microsoft Edge: Tam destek
  • Sonuç: Tüm modern tarayıcıların %98'i WebP'yi destekler

Google Core Web Vitals ve WebP

Google'ın arama sıralamasını etkileyen Core Web Vitals metriklerinden LCP (Largest Contentful Paint), sayfanın en büyük görselinin yüklenme süresini ölçer. WebP formatına geçiş, LCP sürenizi doğrudan iyileştirebilir ve Google sıralamanızı olumlu etkileyebilir.

WebP Ne Zaman Kullanılır?

  • Web sitelerindeki tüm görseller için (genel öneri)
  • Blog kapak görselleri
  • E-ticaret ürün katalogları
  • Sayfa hızını önemseyen her proje

SVG Formatı: Vektörün Gücü

SVG (Scalable Vector Graphics), matematiksel formüllerle tanımlanan vektör tabanlı bir görsel formatıdır. Rasterize (piksel tabanlı) değil, matematiksel olduğu için her boyuta %100 keskin görünür.

SVG'nin Avantajları

  • Boyut bağımsızlığı: 32px'den 4K monitöre kadar kristal netliğinde
  • Çok küçük dosya boyutu (ikonlar için)
  • CSS ve JavaScript ile animasyon yapılabilir
  • Erişilebilirlik: Ekran okuyucular SVG'yi okuyabilir

SVG Ne Zaman Kullanılır?

  • Şirket logoları
  • Navigasyon ikonları
  • İllüstrasyonlar
  • Grafikler ve diyagramlar
  • Favicon (favori simgesi)

Hangi Formatı Seçmeliyim? Pratik Karar Rehberi

Fotoğraf mı yükleyeceksiniz?

→ WebP kullanın. Eski tarayıcı uyumluluğu gerekiyorsa JPG.

Logo veya ikon mu?

→ SVG tercih edin. Küçük boyutlarda veya şeffaflık gerekiyorsa WebP/PNG.

Ekran görüntüsü mü?

→ PNG (metin netliği için). Sosyal medya için JPG yeterlidir.

Web sitesi genel görselleri?

→ WebP, her zaman en iyi seçimdir.

Görsel Formatı Dönüştürme

Görsel Format Dönüştürücü aracımızla JPG veya PNG dosyalarınızı anında WebP formatına dönüştürebilirsiniz. Tamamen ücretsiz, sunucuya dosya göndermeden, %100 tarayıcı tabanlı çalışır.

Sıkça Sorulan Sorular

JPG ile JPEG arasında fark var mı?

Hayır, tamamen aynı formattır. JPEG uzun adı, JPG ise Windows'un eski 3 harfli uzantı sınırından kaynaklanan kısaltmasıdır.

WebP her yerde açılır mı?

Modern tarayıcıların tamamında açılır. Ancak eski yazılımlar (Photoshop'un eski sürümleri, Windows 7 Resim Görüntüleyici) desteklemeyebilir.

PNG görseli küçük ama JPG gibi görünmüyor, neden?

PNG kayıpsız sıkıştırma kullandığından fotoğraflarda JPG'den büyük çıkar. Fotoğraf için WebP veya JPG kullanın.

SVG görseli neden yavaş yükleniyor?

SVG'ler karmaşık olduğunda (çok fazla path verisi) yavaş render edilebilir. Optimizer araçlarla SVG'yi sadeleştirin.