WebP: Web Görselleri için Yeni Bir Format

, Yeni Görsel Formatı

WebP: Web Görselleri için Yeni Bir Format

Webp Nedir?

WebP, Google tyarafından geliştirilen açık kaynaklı bir görsel formatıdır. Bu format predictive (tahmine dayalı) kodlama kullanarak web'deki görseller için kayıplı ve kayıpsız olmak üzere iki tür sıkıştırma sağlar. Google, bu formatı 2010'da geliştirdi ve WebP şu an Google Play Store ve Youtube'da kullanılmakta.

WebP, kaliteden ödün vermeden görsel boyutlarını azaltır ve depolama alanından tasarruf sağlar. Böylece, resimler daha hızlı yüklenir ve SEO performansı olumlu yönde etkilenir.

Neden WebP Kullanmalısınız?

Öncelikle, WebP diğer formatlardan daha avantajlıdır. Örneğin herhangi bir formatı WebP'ye dönüştürebilirsiniz, bu formatın dosya boyutları diğer formatlardan daha küçüktür. Kayıpsız (lossless) sıkıştırma ile sıkıştırılmış WebP dosyası, PNG'den %26 daha küçüktür.

WebP formatı ile görsel kalitesi olumsuz etkilenmez ve SEO performansı artar. WebP, resimdeki önemsiz ayrıntıları silerek dosya boyutunun% 40'ına varan oranda tasarruf sağlar. Resimler daha hızlı yüklenir.

Kısaca WebP web siteniz için iyi bir seçimdir.

WebP Nasıl Kullanılır?

WebP dosyaları diğer formatlar gibi "img" etiketleriyle kullanılabilir. WebP formatını desteklemeyen tarayıcılarda bu dosyalar bozuk görünür. Bu dosyaları bilgisayarınızda görüntüleyebilmek için kodlayıcı (encoder) ve kod çözücüye (decoder) ihtiyacınız vardır.

WebP dosyaları doğrudan görüntülenemez fakat Firefox, Chrome, Opera, Edge gibi web tarayıcıları ile bu dosyaları görüntüleyebilirsiniz. WebP, aynı zamanda birçok yazılım kütüphanesi ile desteklenmektedir. Ayrıca Adobe Photoshop'un da WebP dosyaları için yayınladığı eklentiler mevcuttur.

Online araçlar, komut satırı araçları ile veya Sketch ile kendi görsellerinizi WebP formatına dönüştürebilirsiniz.

Kullanabileceğiniz bazı online araçlar:

EZGif
Squoosh
Online-Convert.com
webp-converter.com

En Popüler Komut Satırı Aracı:

cwebp

Kayıplı (Lossly) WebP

Kayıplı (lossly) WebP sıkıştırma görseli kodlamak için predictive kodlama kullanır. Peki predictive kodlama nedir?

Predictive kodlama komşu piksellerdeki değerleri kullanır ve sadece farkları işler. Bu yöntem, VP8 video kodeki tarafından videolarda ana kareleri sıkıştırmak için de kullanılır.

Kayıpsız (Lossless) Webp

Kayıpsız (Lossless) sıkıştırma, görüntüleri birkaç farklı yöntem kullanarak dönüştürür.

  • Predictor (Tahmini) Transform: Bu dönüşümde piksel değerleri çözümlenmiş olan piksellerden yola çıkılarak tahmin edilir.
  • Color (de-corrolation) Transform: Piksellerin R-G-B değerlerini dekorlar.
  • Subtract Green Transform: Piksellerin yeşil değerlerini kırmızı ve mavi değerlerinden çıkarır.
  • Color Indexing (palettes) Transform: Görüntüdeki ARGB değerini kontrol eder ve bu değerlerin dizisini oluşturur. Eğer bu değer eşik değerin altındaysa pikselleri bu diziyle yer değiştirir.

Alpha ile Lossy Webp  

WebP alfa, her piksel için düşük bitli görüntüleri kodlar.

Sıkıştırma yöntemleri ile ilgili daha fazla bilgi için:

https://developers.google.com/speed/webp/docs/compression

Sources:

https://developers.google.com/speed/webp/
https://wmaraci.com/nedir/webp
https://www.ayhankaraman.com/webp-goruntuleri-ile-seo-performansinizi-gelistirin/
https://medium.com/beginners-guide-to-mobile-web-development/web-image-formats-googles-webp-17e2fe5fc53e
https://developers.google.com/speed/webp/docs/compression
https://developers.google.com/speed/webp/docs/compression