WebP ve AVIF, aynı görsel kalitesini JPEG ve PNG'ye göre belirgin biçimde daha küçük dosya boyutuyla sunan modern görsel formatlarıdır; sayfa ağırlığını azaltarak yükleme hızını ve Core Web Vitals değerlerini iyileştirir.
WebP, Google'ın geliştirdiği; AVIF ise AV1 video kodlayıcısından türetilen yeni nesil görsel formatlarıdır. İkisi de hem kayıplı hem kayıpsız sıkıştırmayı ve şeffaflığı destekler; AVIF ayrıca geniş renk aralığı ve daha yüksek sıkıştırma oranı sunar. Modern tarayıcıların büyük çoğunluğu her iki formatı da destekler. Eski tarayıcılar için HTML'deki picture etiketiyle yedek JPEG ya da PNG sunulabilir; tarayıcı desteklediği ilk formatı seçer. Dönüştürme işlemi yükleme anında sunucuda otomatik yapılabileceği gibi bir CDN ya da görsel servisi tarafından anlık da gerçekleştirilebilir.
İşletme sahibi için neden önemli
Çoğu web sayfasında en fazla yer kaplayan kaynak görsellerdir. Aynı fotoğrafın modern formatta çok daha küçük olması, özellikle mobil bağlantılarda sayfanın hissedilir biçimde daha hızlı açılması demektir. Bu, LCP değerini doğrudan etkiler ve bant genişliği maliyetini düşürür. Ürün fotoğrafı yoğun e-ticaret siteleri, portföy siteleri ve blog içerikleri için görsel formatı kararı, en yüksek getirili performans adımlarından biridir; bir kez sisteme kurulduğunda içerik ekleyen kişinin ek çaba göstermesi gerekmez.
Örnek
Bir dekorasyon mağazasının ürün sayfalarında her ürün için altı adet JPEG fotoğraf bulunuyor ve sayfa toplamı birkaç megabaytı buluyor. Yükleme sırasında görseller otomatik olarak WebP ve AVIF'e dönüştürülüp üç farklı boyutta saklanacak biçimde sistem düzenleniyor. Tarayıcı ekran genişliğine ve desteğine göre en uygun sürümü alıyor; sayfa ağırlığı önemli ölçüde düşüyor ve mobil LCP değeri eşiğin altına iniyor.
Sık yapılan hata
Görselleri elle dönüştürmeye çalışmaktır; içerik ekleyen her kişi bunu unutur ve site zamanla yine ağırlaşır. Dönüştürme sistemin parçası olmalıdır. İkinci hata, format değiştirip boyutu değiştirmemektir; 4000 piksel genişliğinde bir WebP hâlâ gereksiz büyüktür. Üçüncüsü, yedek format sunmadan yalnızca AVIF kullanmaktır; eski cihazlardaki kullanıcılar boş görsel alanı görür. Logo ve ikonlar için ise vektör tabanlı SVG çoğu zaman daha uygundur.
Teklif alırken sorulacak soru
Görseller yükleme anında otomatik olarak modern formata ve birden fazla boyuta dönüştürülecek mi? Eski tarayıcılar için yedek format sunulacak mı ve mevcut görsel arşivim toplu olarak dönüştürülecek mi?
Sık sorulanlar
WebP mi AVIF mi tercih edilmeli?
AVIF genellikle daha küçük dosya üretir ancak dönüştürme daha yavaştır. Yaygın uygulama ikisini birden üretip tarayıcıya seçtirmek, yedek olarak JPEG sunmaktır.
Mevcut görsellerimin kalitesi düşer mi?
Kayıplı sıkıştırmada kalite ayarı belirleyicidir. Makul bir ayarla gözle fark edilir bir kayıp olmaz; orijinal dosyalar da yedek olarak saklanabilir.
