Avif görüntü biçimi neden önemlidir (ve Imagify planı nedir)
Arif’i denediniz – en son güçlü görüntü formatı? Hayali olarak, eklentilerimizin neden onu desteklemediğine dair sorular almaya başladık (spoiler: henüz). Bu makalede, ARIF’in neden JPG ve WebP gibi en popüler formatlara kıyasla görüntü optimizasyonu ve konumu için bir oyun değiştirici olabileceğini göreceksiniz. Ve elbette, Imagify’ın Arif’i destekleme planı hakkında daha fazla bilgi edineceksiniz. Avif görüntü biçimi nedir? AVIF, AV1 Video Codec’e dayanan bir görüntü biçimidir – bu, görüntüyü AV1 ile HEIF dosya biçiminde (yüksek verimlilik görüntü dosyası) sıkıştırır. Basit İngilizce’de bu, görüntünün mümkün olduğunca en iyi şekilde sıkıştırıldığı anlamına gelir – boyutu aynı kaliteyi korurken eskisinden daha hafiftir. Sıkıştırma, HDR (yüksek dinamik aralık) desteği ve 12 bit renk çözünürlüğü gibi diğer önemli özelliklere uygun olarak çok güçlüdür.
Ve hala daha fazlası var. AVIF açık kaynaklı bir yazılımdır ve telif hakkı içermez – yani herhangi bir proje sıkıştırma veya iş için kullanmak istiyorsanız, hiçbir şey ödemenize gerek yoktur. AVIF, Google, Amazon, Cisco, Netflix ve daha fazlası gibi birçok teknoloji devi tarafından geliştirildi. Nedeni basit. Bu şirketler, çok fazla bant genişliği gerektirmeyen yüksek kaliteli görüntü formatları geliştirmek ve yaymakla çok ilgileniyor-bu, gittikçe daha fazla insan cihazlarında içerik tüketebilir. Olağanüstü performansı göz önüne alındığında, AIFF JPEG ve WebP gibi en zor formatın yerine mükemmel bir yedek gibi görünüyor. Bir süre öncesine kadar sadece bir sorun vardı: tarayıcı uyumluluğu.
Tarayıcı Avif’i uzun süre destekler, tarayıcının Arif’i destekleyen sadece küçük bir kısmı. Başka bir deyişle, çoğu kullanıcı AIFF formatında herhangi bir fotoğraf göremez. Ekim 2021’de her şey farklıydı. Şimdi Arif, Firefox, Chrome ve Opera tarafından destekleniyor. Genel olarak, kullanıcıların% 67’si bu formattan yararlanabilir. Global ARIF Kullanımı – Kaynak: Kullanabilir miyim
Çeşitli formatları kolayca karşılaştıran bir web uygulaması olan Squoosh’u kullanacağız. En zorlu görüntü formatlarından birini bir başlangıç noktası olarak alalım ve diğer format performansının nasıl olduğunu görelim. Orijinal boyutta 15.6 MB olan PNG görüntülerini seçtik ve orijinal boyut ile JPG formatına dönüşüm arasındaki farkı ölçtük. PNG’den JPG’ye dönüşüm% 92’lik bir azalma gösterir. Görüntünün boyutu şimdi 1.20 MB’dir. JPG şimdiye kadarki en hafif format olmadığından ve bunu biliyoruz, bundan daha fazlasını bekleyemeyiz.
PNG ve JPG performansının karşılaştırılması WebP’ye ne dersin? Daha fazla karşılaştırma yapıyoruz. Bu kez, PNG görüntüleri%95 oranında sıkıştırılmıştır. Mevcut görüntü boyutu 704 KB. Başlangıç boyutu (15.6 MB) göz önüne alındığında, bu iyi bir sonuçtur – ve görüntü kalitesinde bir azalma görmek zordur. Ancak WebP, WordPress’te kullanmanız gereken bir resim biçimidir. PNG ve WebP performansını karşılaştırma
Daha sonra tekrar koşarız ve ARIF formatının performans beklentilerini karşıladığını görürüz. Görüntü boyutu%98 azaltıldı. Bu sadece 261 KB – ve görüntü kalitesindeki farkı görmek hala zor. PNG ve AIFF’in performansını karşılaştırma
Aşağıda yaptığımız karşılaştırmanın tam bir özetidir. Bu, ARIF’in görüntünüzün boyutunu nasıl azaltabileceğini gösterir. Ve şimdi merak ediyor olabilirsiniz: Neden destek ARIF’i hayal etmiyor? Bu bizi bir sonraki bölüme götürüyor. WP Media’nın kurucu ortağı ve CEO’su AVIF (değil) Jean-Baptiste Marchand-Arvier’i neden desteklemiyor: Avif deneysel bir format olarak piyasaya sürüldü ve tarayıcının küçük bir kısmı bunu destekliyor. Dahası, Arif, kodlama zamanı nedeniyle çeşitli sorunlar yaşadı. Başlangıçta, kodlama görüntü başına birkaç saniye sürecek, bu çok yavaş. Bir karşılaştırma olarak, Imagify’daki görüntülerin sıkıştırılması genellikle 100 ms’den az sürer. O zamandan beri performansı artırmak için çok fazla iş oldu “.
Aşağıdaki ekran görüntülerinde görebileceğiniz gibi, astar süresi iyileşiyor: Kodlamanın Optimizasyonu – Kaynak: Web.dev
Jean-Baptiste devam etti: “Kodlamadaki gelişmenin yanı sıra, şimdi daha fazla tarayıcı ARIF’i destekliyor. Ve bu format iki nedenden dolayı çok ilginçtir: Alfa kanalını (şeffaflık) desteklemek, böylece PNG’nin yerine kullanılabilir ve GIF’in yerine kullanılacak destek animasyonu. Bu yüzden Image yakın gelecekte Arif’i kesinlikle destekleyecektir “. Ve ekledi: “WebP’yi akıllıca değiştirebiliriz. Değilse, kullanıcılarımız için çok karmaşık veya kafa karıştırıcı olabilir. “Bunun ne anlama geldiğini merak ediyorsanız, bazı bağlamlar. WebP, 10 yıldan fazla bir süre önce 2010’da piyasaya sürüldü. Yine de, tarayıcı ve işletim sistemi ile hala tam olarak uyumlu değildir. Tek kısmi uyumluluk iki şey gerektirir. Bir web sitesi sahibi olarak, yine de 2 farklı formatı işlemeniz gerekir: JPG veya PNG gibi “klasik” format ve WebP veya Wise gibi daha fazla performans formatları. Öte yandan, Imagify gibi görüntüler optimizasyon eklentisinin sunucularında her iki biçimi de kaydetmesi gerekir. “Kullanıcının bakış açısından,” dedi Jean-Baptiste, “Bu, Arif gibi yeni formatların sonunda JPG veya PNG-PNG-yerini almaya yardımcı olmayacağı anlamına geliyor. Bununla birlikte, bu formatı ARIF’e dönüştürmek görüntü performansını iyileştirmeye yardımcı olacaktır ve bu nedenle ARIF WebP’yi birkaç noktada değiştirecektir. Kullanıcıların her iki biçime de ihtiyacı yoktur. Ve olabildiğince basit bir eklenti yapmak istiyoruz “.
WebP hala resminizi optimize etmenin harika bir yoludur, görüntülerinizi Imagify ile ARIF’e dönüştüremediniz – ancak görüntülerinizi her zaman WebP’ye dönüştürebilir ve şimdi görüntü performansınızı geliştirebilirsiniz. Dünya çapında kullanıcıların% 90’ından fazlası, resimlerinizi WebP formatında dönüştürdüğünü görebilecek, bu nedenle fotoğraflarınızı daha hafif hale getirmek ve sitenizin performansını optimize etmek için hala iyi bir seçim. PagePeed Insights denetimini çalıştırırken, görüntüleri yeni nesil formatta sunma konusunda bir performans önerisi bulabilirsiniz. WebP, Google tarafından Arif ile önerilen yeni nesil formattır. Görüntünüzü daha hızlı yüklemek için ihtiyacınız olan tek şey bu.
Test yaptırıyoruz ve üç sayfa yapıyoruz. Her sayfa yalnızca belirli bir formatta görüntüler içerir: PNG, JPG veya WebP. PNG görüntüleri içeren sayfalar için PagesPeed Insights denetimini çalıştırırken, yeni nesil format önerisi hakkında bir uyarı aldık. Tahmini çok büyük tasarrufların nasıl olduğunu görebilirsiniz: 1.076.7 kb.
PNG figürü için PSI denetimi
Aynı şey, sayfayı JPG görüntüsü ile test ederken de geçerlidir. Performans biraz daha iyi ve turuncu bir bayrak alıyoruz. Bununla birlikte, onarım için hala yer var – 16,8 kb tasarruf potansiyeli.
Tavsiyenin, Imagify ile WebP’ye dönüştürdüğümüzde ve özel bir sayfa oluşturduğumuzda geçen bir denetim olması şaşırtıcı değildir: WebP resmi için psi denetim
AIFF görüntüleri ile sayfayı test ederken aynı sonuçları aldık: AIFF görüntüleri için psi denetim Webp ve Arif aynı iyi sonuçları verdi. Dahası, PagePeed Insights puanı neredeyse aynı:
WebP ve AIF sayfaları arasındaki görüntülerin boyut ve baytındaki farklılıkları da test ediyoruz. Ayrıca büyük farklılıklar göremiyoruz:
Gördüğünüz gibi, WebP ve Arif, olağanüstü görüntü performansı sağlamada çok benzer. Bir yandan Arif biraz daha iyi bir optimizasyon sunuyor. Ancak, sitenizin binlerce ve binlerce görüntü olmadığı sürece, performansınız WebP’yi kullanarak çok iyi olacaktır – çünkü bu hala yeni nesil formattır. Dahası, Imagify ile, görüntülerinizi kısa sürede dönüştürmenizi sağlayan daha hızlı yeni bir sıkıştırma sayesinde, görüntülerinizi WebP formatına dönüştürmek eskisinden daha kolay ve daha hızlıdır. Yapmanız gereken bu:
Ayarlar> Optimizasyon> WebP biçimi ve her iki kutuyu da kontrol edin:
