Mobilde aynı görseli küçültmek mi, ayrı kadraj sunmak mı?

Ürün sayfasında masaüstünde geniş bir yaşam alanı fotoğrafı kullanıyorum; telefonda aynı görsel küçülünce ürün kadrajın içinde kayboluyor. Görseli yalnızca CSS ile kırpmak kolay, ama bu kez mobilde kullanıcıya aslında hiç görmeyeceği alanları taşıtmış oluyorum. Ayrı bir mobil kadraj hazırlamak daha iyi sonuç verebilir gibi görünüyor; fakat görsel yönetimini ve test yükünü de artırıyor.

Bildiğim kadarıyla srcset ve sizes, tarayıcıya farklı çözünürlük seçenekleri sunup yerleşimde görselin yaklaşık ne kadar alan kaplayacağını bildirmek için kullanılıyor. Burada sizes değerini gerçek CSS genişliğiyle uyumlu tutmak önemli; yanlış değer, tarayıcının gereğinden büyük dosya seçmesine yol açabilir. Kadrajı gerçekten değiştirmek gerektiğinde ise picture içindeki farklı kaynaklar daha uygun bir çözüm gibi duruyor.

Benim kararsız kaldığım nokta şu: Her görsel için mobil ve masaüstü kadrajı hazırlamak ne zaman anlamlı? Yalnızca ana sayfa görseli gibi dikkat çeken alanlarda mı kullanıyorsunuz, yoksa ürün kartlarında da tercih ediyor musunuz? Ekran boyutlarının yanında cihaz piksel oranını ve ağ koşullarını nasıl test ediyorsunuz? Deneyiminizi ve kullandığınız yöntemi paylaşırsanız çok faydalı olur.