WebP Nedir? (Hızlı Web Sitesi İçin Bu Formatı Kullanın)

WebP, Google tarafından geliştirilen açık kaynaklı bir görüntü dosyası biçimidir. Görüntülerin boyut olarak sıkıştırılmasını sağlayan WebP, yüksek kaliteli görüntü dosyalarının internet sitelerinde daha hızlı yüklenmesini sağlar. WebP, VP8 video formatının bir türevidir.

İnternet sitenizin daha hızlı bir şekilde yüklenmesine yardımcı olacak WebP dosyası ile ilgili “WebP Nedir?” “WebP Kullanmanın Avantajları Nedir?” gibi soruları detaylı bir şekilde hep birlikte cevaplayalım. 

WebP Nedir?

WebP biçimindeki görüntü dosyaları ilk kez 2010 yılında Google tarafından tanıtıldı ve avantajlarından dolayı son yıllarda giderek daha da yaygın hale geldi. WebP, hem kayıplı hem de kayıpsız sıkıştırma desteğin yanı sıra, animasyon ve şeffaf arka plan desteği de sunar.

Genel olarak fotoğraf dosyalarının internet sitelerini yavaşlattığı bilinen bir gerçektir. Yavaşlayan internet siteleri kullanıcıların deneyimi olumsuz yönde etkilemenin yanı sıra, alışverişlerini tamamlamadan siteden çıkmalarına da sebebiyet verebilir. Ayrıca yavaş internet siteleri kullanıcılarda güven duygusunun oluşmasını engeller. 

Görüntülerin boyut olarak sıkıştırılması ile sitenin hızlanması sağlanabilir fakat görüntüler sıkıştırılırken mutlaka belli bir oranda kalite kaybı yaşanacaktır. Siteyi hızlandırmak için görsel olarak PNG ve JPEG dosyaları kullanmanın farklı avantajları ve dezavantajları vardır. PNG dosyalar düşük detaylı görüntüler için mantıklıdır ve görüntü boyutlarını sıkıştırırken kalitenin de düşmesini engeller. JPEG dosyaları ise kaliteyi önemli ölçüde azaltarak dosya boyutunu da azaltır. 

PNG ve JPEG arasında denge kurmak zorunda kalmadan internet sitelerini hızlandırmanın yolu ise WebP dosyalarından geçiyor. WebP’nin özelliklerini yazımızın geri kalanında bulabilirsiniz.

İlgili İçerik: Logo Tasarımı Nasıl Yapılır?

WebP Özellikleri Nelerdir?

WebP formatı kullanılarak minimum kalite kaybı ile görüntü boyutu azaltılabilir. Böylece depolama alanı azaltılarak internet siteleri hızlanır. Farklı WebP türleri kullanılarak ihtiyaçlara uygun olacak şekilde görüntüler dönüştürülebilir. Her WebP dosyası, video bileşenleri tarafından da kullanılan VP8 veya VP8L görüntü verisinden oluşur.

WebP, tahmini kodlama (predictive coding) yöntemini kullandığından dolayı diğer görsel türlerinden farklılaşır. WebP bir görüntüdeki piksellerin komşu bloklarındaki renk değerlerini tahmin eder ve tahmin ile gerçek renk arasındaki farkı kodlar.

Kayıplı WebP, Kayıpsız WebP, Alpha ile Kayıplı WebP ve Animasyonlu WebP öne çıkan WebP türleri arasındadır.

Kayıplı WebP (Loosy WebP) ile bir görüntünün gözle görülemeyecek bazı kısımları silinerek dosya boyutu kalıcı olarak küçültülür.

Kayıpsız WebP (Lossless WebP) dosyaları, Google’a göre PNG dosyalarından %26 daha az yer kaplamaktadır. Görüntüde herhangi bir kalite kaybı olmadan görüntüler düzenlenebilir. Eğer gerekirse düzeltme geri de alınabilir.

Daha az kayıp yaşanması için Alpha ile kayıplı kodlaması kullanılabilir. Böylece dosya boyutu daha da küçülebilir.

Animasyonlu görüntülerin de daha az yer kaplaması için Animasyonlu WebP görüntüleri kullanılarak sıkıştırma yapılabilir.

WebP Kullanmanın Avantajları Nelerdir?

WebP dosyaları kullanarak internet sitenizin hem tarayıcılarda hem de mobil cihazlarda daha hızlı şekilde yüklenmesini sağlayabilirsiniz. Ayrıca Google tarafından desteklendiği için WebP dosyaları arama motoru optimizasyonu (SEO) açısından da çeşitli avantajlar sağlamaktadır. WebP dosyaları kullanmanın avantajlarını sizin için derledik.

Sayfa Yükleme Hızı Artar

Eğer kullandığınız görsel dosyalarından dolayı internet siteniz yavaşladıysa, görsel dosyalarınızı optimize etmeniz kaçınılmazdır. Görselleri manuel olarak kendi internet sitenizin özellikleriyle uyumlu olacak şekilde yeniden boyutlandırsanız dahi, performansınız zarar görmeye devam edebilir. Görsellerden dolayı bant genişliği kullanımınız artacaktır ve internet siteniz yavaşlayacaktır. Üstelik görselleriniz de yeterince kaliteli gözükmeyecektir. 

Google’ın çözümü olan WebP formatı ile internet sitelerinize fark katabilirsiniz. İnternet sitenizin hızı arama motoru optimizasyonu gücünüzle doğru orantılıdır. Haliyle site hızınız ne kadar fazlaysa, arama sonuçlarında daha üst sıralarda yer alabilirsiniz; ayrıca Google tarafından da daha güvenilir bir site olarak görülebilirsiniz. Üstelik, 2018’de Google Developers, sayfa hızının bir internet sitesinin kalite skorunu önemli ölçüde etkileyeceğini duyurdu. 

Daha hızlı bir internet sitesi, müşterilerinizin kullanıcı deneyimini olumlu ölçüde etkileyecektir. Müşterileriniz sitenize daha fazla güvenecek, sitenizde daha fazla vakit geçirecek ve haliyle daha fazla alışveriş yapacaktır. Örneğin, YouTube, WebP thumbnail kullanmaya geçmenin sayfa yükleme hızlarında %10 daha hızlı sonuçlar verdiğini tespit etmiştir. 

Güncel web site hızınızı Google PageSpeed Insights ile ölçüp optimizasyon alanlarınızı hızlıca belirleyebilirsiniz.

İlgili İçerik: E-Ticarette Site Hızı Neden Önemlidir?

Depolama Alanında Daha Az Yer Kaplar

Gelişmiş sıkıştırma teknikleri ve girişimsel kodlama ile WebP daha verimli ve etkili bir şekilde dosya boyutunu sıkıştırır. Böylece sunucu (server) maliyetlerini de azaltabilir. 

Ayrıca WebP sıkıştırma ile GIF animasyonlu videolar da çok daha küçük boyutlarda kullanılabilir. Google, kayıplı sıkıştırma kullanıldığında GIF’in orijinal boyutunun ortalama olarak %64, kayıpsız sıkıştırma kullanıldığında ise %19 küçüldüğünü tahmin etmektedir. 

Facebook da WebP kullanmaya geçtiklerinde JPEG’lere kıyasla %25-35, PNG’lere kıyasla ise %80 daha küçük dosya boyutları elde ettiğini açıklamıştır.

Görüntü Arka Plan Şeffaflığı ve Animasyonu Destekler

Bir başka WebP avantajı ise WebP’nin şeffaf arka planları ve animasyonları destekliyor olmasıdır. Üstelik bu iki özelliği de bünyesinde barındıran tek görüntü biçimidir.

Arka planları şeffaf yapıp sade bir arka plan ile değiştirirerek görüntünün boyutunu küçültebilirsiniz. 

GIF animasyon videolarını kullanarak da internet sitenize hareket katmayı tercih edebilirsiniz. Normalde internet sitenizi yavaşlatma potansiyeli olan videolar, WebP ile internet sitenizi yavaşlatmadan sitenize ve ürünlerinize hareketlilik katacaktır.

WebP Kullanmanın Dezavantajları Nelerdir?

WebP kullanımının avantajlarının yanı sıra elbette bazı dezavantajları da bulunuyor. WebP görsellerini kullanmayı tercih etmeniz durumunda karşılaşabileceğiniz bazı dezavantajları sizin için derledik:

Her Tarayıcıda Desteklenmez

WebP’nin dezavantajlarından biri, bazı internet tarayıcıları tarafından desteklenmiyor olmasıdır. Hızla benimsenmesinden dolayı giderek daha fazla tarayıcı tarafından desteklenmeye başlasa da, Internet Explorer, iOS 13 ve öncesi Safari tarayıcıları WebP formatını desteklemiyor. 

Ayrıca WebP görselleri her internet sitesine yüklenemiyor. Özellikle eski bir teknik altyapısı olan internet siteleri WebP görsellerini desteklemiyor. 

ikas’ta ise e-ticaret sitenizi oluştururken yüklediğiniz her görsel otomatik olarak en kaliteli ve en hızlı seçeneği sunan WebP görseline dönüştürülür. Böylece e-ticaret sitenizde her sayfa ve her görsel optimal haliyle müşterilerinize ulaşır.

Çok Fazla Sıkıştırıldığında Kalite Düşer

Sadece WebP’de değil sıkıştırma yapan tüm dosya türlerinde, ister istemez belli bir oranda görüntü kalitesi düşmektedir. 

Hızlı bir internet sitesi ve açılış sayfasına sahip olmak için görsellerin her birinin 100 KB dosya boyutundan daha fazla olmaması gerekir. Sıkıştırma yaparken dosya boyutunu maksimum bu dosya boyutuna sahip olacak kadar küçültmek gerekir. Böylece minimum kalite kaybı ile görseller sıkıştırılabilir, dosya boyutları azalarak internet siteleri hızlandırılabilir. 

İnternet sitenizin ihtiyaçlarına ve özelliklerine en uygun olacak şekilde dosyalarınızın maksimum dosya boyutuna karar verebilirsiniz.

WebP vs JPEG

WebP daha küçük dosya boyutuna sahip olmasıyla JPEG’ten farklılaşır. 

JPEG veya JPG, çok renkli görüntüler için iyi bir seçenektir. Özellikle kaliteli fotoğraflar için tercih edilen JPEG’te sıkıştırma yapıldığında görüntü kalitesinde belirli  bir kayıp yaşanır. JPEG animasyon görsellerini desteklemez. PNG ile kıyaslandığında JPEG daha fazla tarayıcı tarafından desteklenmektedir.

PNG ise özellikle logolar, ve metin ağırlık görseller için uygundur. Sıkıştırıldığında dahi görüntü kalitesi gözle görülür bir şekilde etkilenmez. Fakat estetik önem taşıyan görsellerde yeterli kaliteyi sunamaz. PNG de WebP gibi şeffaf arka planları destekler. JPEG gibi PNG de animasyonları desteklemez. WebP ile kıyaslandığında daha fazla tarayıcı tarafından destek görmektedir.

WebP hem JPEG hem de PNG’den %25-34 arasında bir oranda daha az yer kaplar.

WebP ile İlgili Sıkça Sorulan Sorular

WebP Tüm Tarayıcılarda Çalışıyor Mu?

Günümüzde birçok internet tarayıcısı WebP dosya türünü desteklemektedir fakat Internet Explorer ya da Safari’nin iOS 13 ve daha önceki sürümleri WebP türünü desteklememektedir. 

Görsellerinizi güncellerken Google’ın en son uyumluluk listesini mutlaka kontrol etmelisiniz.

WebP Boyut Sınırı Var Mı?

WebP boyutları ihtiyaçlara göre değişiklik gösterecektir. Maksimum WebP görsel boyutu ise 16.383 x 16.383 pikseldir. Daha yüksek boyuttaki görsellerin bu maksimum sınıra uygun olacak şekilde güncellenmesi gerekir. 

WebP görsellerinin maksimum dosya boyut sınırı ise 100 KB olarak belirtilebilir. Daha yüksek dosya boyutları internet sitelerini yavaşlatacaktır.

JPEG to WebP Nasıl Yapılır?

Eğer WebP’nin avantajlarından faydalanmak istiyorsanız şimdi size kısaca WebP görsellerini nasıl oluşturabileceğinizi anlatacağız.

Adobe Photoshop kullanıcıları fotoğraflarını kaydederken “farklı kaydet” seçeneğini kullanarak WebP dosya formatını seçebilirsiniz. WebP görselinizin sıkıştırma ayarlarını da bu aşamada düzenleyebilirsiniz. Böylece oluşturduğunuz görseller WebP formatında ve istediğiniz ayarlarda kaydedilecektir.

Adobe Photoshop yerine XnConvert uygulamasını da kullanarak JPEG formatındaki görselleri hızlıca WebP’ye dönüştürebilirsiniz. Ücretsiz olarak kullanılabilen program ile, WebP formatını desteklemenin yanı sıra görselleri bir formattan başka bir formata dönüştürme, dönüştürme, görsellere filigran ekleme, metin ekleme ve parlaklığı ayarlama gibi görüntü ayarları da yapılabilir.

Ayrıca Ezgif ve freeconvert internet sitelerini veya Gimp uygulamasını da ücretsiz olarak kullanabilirsiniz.

İlginizi Çekebilecek İçerikler:

• Resim Düzenleme Programları
• Sosyal Medya Görsel ve Video Boyutları