mcatakcin adlı üyeden alıntı: mesajı görüntüle
Cümleten selamlar dostlar.

Birazdan size Netflix'in kullandığı bir ileri teknolojiyi göstericem.
Bunu anında kendi siteleriniz için uyguladığınızda alacağınız sonuçlara hayret edeceksiniz.

Sitenizde göz kamaştırıcı resimler kullanıyosanız...
Yüksek kaliteli görsellerin dosya boyutlarının ne kadar büyük olduğunu bilirsiniz.
Ve bu yüzden siteniz daha geç açılma ile sonuçlanır.

Nitekim bu boyutları sıkıştırmak istediğinizde görüntü kalitesini de korumanız gerekir. Neyse ki, bunu yapmanın çok kurnazca bir yolu var.
Yüksek kalite görsellerin adeta vitrin görevi gören bir müşterimin sitesi....



Bu sitede odağımız tamamen görseller oldu. Çünkü gerçekten bu görseller oldukça çarpıcı güzellikte.
Ve bu güzelliğin incinmemesi için elimizden geleni yapmamız gerekiyordu.

Yaptığımız şey tam olarak şu oldu;
.WEBP formatından 2 kat daha güçlü .AVIF formatını kullandık.
Üstelik maksimum sıkıştırma sağlarken bile kalite kaybını neredeyse sıfıra indirebildik!

GÖRÜNTÜ KALİTELERİNİ KARŞILAŞTIRIN

WEBP MAKSIMUM SIKIŞTIRMA (13kb)


AVIF MAKSIMUM SIKIŞTIRMA (4kb)



NETFLIX BUNU NASIL KULLANIYOR?
Artık çok fazla mobil giriş olması sebebiyle pek çok site görselleri dikey formatta kullanmaya başladı.
Bunun anlamı görsellerin 16:9 yatay formata göre daha çok yer kaplaması demek.

İşte bu yüzden NETFLIX güçlü bir çözüm bulması gerektiğinde .AVIF formatına başvurdu.

.AVIF OLMADAN


.AVIF VARKEN


Toparlamak gerekirse bizde .AVIF kullandık ve müthiş faydalarını gördük.
Bu görselleri ek olarak CDN ile desteklediğimizde...
Canımız pahasına koruduğumuz yüksek kalitenin siteye hiçbir yükü kalmadı!

.AVIF Google'nin geliştirdiği bir format. Ve neredeyse tüm browser desteği tamamlanmak üzere.
Bu formatı kullanırken, desteklenen tarayıcılara sunma özelliğini kullanmanız daha akıllıca olacaktır. ( zaten şimdilik sadece Safari desteklemiyor diyebiliriz )

Deneyin ve aradaki farkı siz de gözlerinizle görün

Saygılar ve sevgiler...
safari için gene kod gerekecek safari ile giriyorsa eski linkler gibi .