Moda markasının sitesi mobil uyumlu olmak zorunda, çünkü müşteri markanızı çoğunlukla Instagram’da görüyor ve oradaki bağlantıya telefonundan tıklıyor. Telefonda yavaş açılan, ürün fotoğrafı kayan ya da beden seçimi zor bir site, o kişiyi saniyeler içinde kaybettirir. Reklama harcadığınız para da bu noktada boşa gider. Masaüstünde güzel görünen sayfa, telefonda çalışmıyorsa hiç yok sayılır. Gerçek bu.
Trafik nereden geliyor, ona göre tasarlayın
Instagram ve Facebook reklamından, hikâyedeki bağlantıdan ya da profildeki bağlantıdan gelen ziyaretçi telefon uygulamasının içindeki tarayıcıdan açar sayfayı. Bu tarayıcı normal Chrome ya da Safari kadar hızlı olmayabilir; çerezler ve oturumlar da ayrı çalışır. Siteyi yalnız masaüstü tarayıcıda test ettiyseniz bu deneyimi hiç görmemişsinizdir.
Çözüm kolay. Kendi hesabınızdan bir gönderi ya da hikâye paylaşıp bağlantıya telefonunuzdan tıklayın. Sayfa kaç saniyede açıldı, ilk ekranda ne görünüyor, sepete gidebiliyor musunuz? Denemeyi eski modelli bir telefonda da yapın.
Ürün fotoğrafı telefonda nasıl görünmeli
Moda, görselle satılır. Masaüstünde yan yana beş küçük fotoğraf gösteren galeri telefonda sıkışır. Mobilde ürün görseli ekranın genişliğini kaplamalı, parmakla yana kaydırılmalı, iki parmakla büyütülebilmeli. Kumaş dokusunu göstermek için yakın plan fotoğrafı galerinin ikinci ya da üçüncü sırasına koyun; ilk fotoğraf ürünün bütününü göstermeli.
Görsel boyutu da önemli, çünkü moda sitelerinde sayfanın ağırlığının büyük kısmı fotoğraflardan gelir ve mobil bağlantıda her fazladan yüz kilobayt, ilk ekranın birkaç saniye geç açılması anlamına gelebilir. Orijinal dosyayı olduğu gibi yüklemek sayfayı yavaşlatır. Fotoğrafları WebP formatına çevirip genişliği 1200 pikselin altında tutmak çoğu zaman yeterlidir. İlk ekrandaki fotoğrafın “geç yükle” ayarı kapalı olsun; aşağıdakiler ise ekran kaydırıldıkça yüklensin.
Beden ve renk seçimi
Giyimde en çok terk edilen adım beden seçimidir. Telefonda küçük bir açılır liste, parmakla seçmesi zor bir kutu demektir. Bedenleri yan yana düğme olarak gösterin. Stokta olmayanı üstü çizili ya da soluk gösterin ama yine de görünür bırakın; müşteri “ben bu bedenden alırdım” diye bilgi edinir. Renk seçiminde küçük renk daireleri yerine ürünün gerçek fotoğrafını kullanın.
Beden tablosu, ürün sayfasından bir dokunuşla açılan bir panel olmalı. Ayrı sayfaya götürürseniz kullanıcı geri dönemeyebilir. Tabloda santimetre ölçüsünü, bir de modelin boyunu ve giydiği bedeni yazın.
Menü ve arama
Mobilde menü ekranın üst köşesinde üç çizgiyle açılır. Moda sitesinde kategori sayısı çoksa menü iç içe açılmalı: kadın, erkek, aksesuar gibi ana başlık sonra alt kategoriler. Arama kutusunu da menüye gömmeyin, üst çubukta görünür tutun. Ürün arayan kişi çoğu zaman kategoriye değil kelimeye göre arar: “siyah blazer”, “keten pantolon”.
Ödeme adımı
Sepetten ödemeye kadar geçen yol kısa olmalı. Misafir olarak sipariş verme seçeneği şarttır; zorunlu üyelik birçok kişiyi caydırır. Form alanlarında telefon klavyesi doğru açılsın: telefon numarası alanında sayı klavyesi, e-posta alanında @ işaretli klavye. Adres otomatik doldurma çalışsın. Apple Pay ve Google Pay gibi tek dokunuşlu ödeme seçeneklerini ödeme altyapınız destekliyorsa ekleyin.
Düğmelerin boyutuna da dikkat edin. Parmakla basılacak bir düğme en az 48 piksel yüksekliğinde olmalı. “Sepete ekle” düğmesini sabit çubuk olarak ekranın altında tutmak, uzun ürün sayfalarında satışı kolaylaştırır.
Gerçek telefonda test edin
Tarayıcıda pencereyi daraltmak mobil test sayılmaz. Chrome’un geliştirici araçlarındaki cihaz modu işe yarar ama gerçek telefonun yerini tutmaz. Parmak büyüklüğü, ekran parlaklığı ve bağlantı hızı sadece elde hissedilir. Yavaş bağlantıyı denemek için telefonunuzu mobil veriye alın, Wi-Fi’ı kapatın. Siteyi bir de ev dışında, kalabalık bir yerde açın. Sonuçta müşteri de sizin ofis Wi-Fi’ınızda değil, otobüste ya da kuyrukta bakıyor. Bir arkadaşınıza ürün sayfasını verin ve siparişi vermesini isteyin; sormadan, yönlendirmeden izleyin. Takıldığı her yer bir düzeltme listesi maddesidir.
Hız ölçümü
Google’ın PageSpeed Insights aracı mobil sonucu ayrı verir. İlk bakacağınız üç şey: en büyük içeriğin yüklenme süresi, sayfa yüklenirken kayma ve tıklamaya yanıt süresi. Kayma moda sitelerinde sık görülür: fotoğraf geç yüklenince altındaki yazı aşağı kayar ve kullanıcı yanlış düğmeye basar. Görsellerin genişlik ve yükseklik değerini baştan tanımlamak bu sorunu çözer.
Google Search Console’da “Sayfa deneyimi” ve “Çekirdek Web Verileri” raporlarını ayda bir kontrol edin. Mobil kullanılabilirlik hatası orada görünür.
Pop-up ve çerez uyarıları
Masaüstünde sevimli duran bir bülten penceresi telefonda ekranın tamamını kaplar. Kapatma düğmesi küçükse kullanıcı çıkış yapar. Pencereyi sayfa açıldıktan birkaç saniye sonra ya da çıkış niyeti anlaşılınca göstermek daha doğru. Google, ilk ekranı kaplayan pencereleri sayfa deneyimi açısından olumsuz görür. Çerez bildirimi de küçük bir şerit olsun. Yani: ürünü göstermeden önce izin istemek tersine çalışır.
Mobil uyumlu site ve arama sırası
Google siteyi öncelikle mobil sürümüyle değerlendirir. Mobilde eksik içerik, gizlenmiş metin ya da kırık görsel varsa sıralamada bunun etkisini görürsünüz. Ürün açıklamasının mobilde de tam gelmesine dikkat edin; “devamını oku” ile gizlenen metin sorun değildir ama hiç yüklenmeyen metin sorundur.
Telefonuna tıklayan müşteriye düzgün bir deneyim sunmak isterseniz web tasarım hizmetimiz mobil öncelikli kurgu ile ilerliyor. Kurumsal paket 40.000 ₺ (+ KDV), tüm seçenekler fiyatlar sayfasında. Satış yapan markalar için e-ticaret sektör sayfamızı da inceleyebilirsiniz.
Sitenizin telefonda nasıl göründüğüne birlikte bakalım. İletişim sayfasından yazın ya da 0540 022 64 22 numarasını arayın.