Ziyaretçilerinizin çoğu siteyi kotası sınırlı mobil veride, bazen zayıf çekimde açar. Birkaç büyük fotoğraf içeren sayfa onlara bozukmuş gibi görünür ve yüklenmeden çıkarlar.
İyi haber: görsel sorunları, hız sorunlarının en kolay çözülenidir ve sohbetle halledebilirsiniz.
Görseller genellikle sayfanın en ağır kısmıdır. Gösterildikleri boyuta küçültün, WebP gibi modern bir format kullanın ve ilk ekranın altındakileri ancak yaklaşıldığında yükleyin.
Yüklemeden önce boyutlandırın
Telefon kamerasından çıkan fotoğraf birkaç megabayt ve binlerce piksel genişliğinde olabilir, oysa birkaç yüz piksellik bir kutuda gösterilir. Keskin ekranlar için dosyayı gösterim genişliğinin yaklaşık iki katı yapın, daha fazlasını değil.
- Tam genişlik kapak görseli: yaklaşık 1600 ile 2000 piksel yeterlidir.
- Kartlar ve ürün küçük resimleri: 600 ile 800 piksel.
- Logo ve simgeler: SVG kullanın, keskin ve çok küçük kalır.
Doğru formatı seçin
WebP (ve desteklenen yerde AVIF) benzer kalitede JPEG ya da PNG'den çoğunlukla çok daha küçük dosya verir. Fotoğraflar için JPEG yedek olarak kalsın, fotoğrafta PNG'den kaçının çünkü büyüktür. Yüzde 75 ile 80 kalite genellikle gözle fark edilmez.
Akıllı yükleyin
İlk ekranın altındaki görseller yalnızca ziyaretçi yaklaştığında yüklenmelidir (tembel yükleme). En üstteki ana görsel ise hemen yüklenmeli, çünkü insanların ilk gördüğü odur.
Ayrıca her görsele genişlik ve yükseklik ya da sabit bir oran verin; görseller gelirken sayfa zıplamasın. Not: Türkçe başlıklardaki ı, İ, ş, ğ gibi harfleri eksiksiz gösteren bir yazı tipi seçmek de ilk izlenimi korur.
Kopyalayıp yapıştırabileceğiniz istem
"Bu sitedeki tüm görselleri mobil veri için optimize et. Fotoğrafları WebP'ye çevir, her birini gösterildiği boyutun en fazla iki katına küçült, kapak görseli hariç ilk ekranın altındaki her şeyi tembel yükle, hiçbir şey zıplamasın diye sabit oranlar ver ve kısa açıklayıcı alt metinler ekle."
Değişiklikten sonra siteyi telefonunuzda Wi-Fi kapalıyken açın ve ilk ekranın ne kadar hızlı geldiğine bakın.