Trafiğin çoğu mobilden geliyor ama formlar hâlâ masaüstünde tasarlanıyor. Aradaki fark, dönüşüm oranında doğrudan görünüyor: aynı formun mobil tamamlanma oranı çoğu sitede masaüstünün belirgin altında. Aşağıdaki altı düzeltme, bu farkı kapatmanın en hızlı yolu.
Mobilde form doldurmak neden zor?
Ekran küçük, parmak kalın, bağlantı değişken ve kullanıcı çoğu zaman hareket hâlinde. Masaüstünde iki saniye süren bir düzeltme, mobilde on saniye ve bir hayal kırıklığı anlamına geliyor. Tasarım kararlarını bu koşula göre vermek gerekiyor.
Altı detay
1. Doğru klavyeyi açın
Telefon alanına harf klavyesi açılıyorsa kullanıcı ilk saniyede sürtünmeyle karşılaşıyor. inputmode ve type doğru yazıldığında cihaz uygun klavyeyi kendisi açar:
<input type="email" inputmode="email" autocomplete="email" />
<input type="tel" inputmode="tel" autocomplete="tel" />
<input type="text" inputmode="numeric" pattern="[0-9]*" />
2. Tek sütuna inin
Yan yana iki alan mobilde hem dar kalıyor hem de sıralama hissini bozuyor. Ad ve soyadı ayrı alanlara bölmek yerine tek “Ad Soyad” alanı kullanmak, alan sayısını da azaltıyor.
3. Hatayı alanın hemen altında gösterin
Sayfanın tepesindeki toplu hata kutusu mobilde ekran dışında kalıyor. Kullanıcı butona basıyor, hiçbir şey olmuyor sanıyor ve çıkıyor. Hata mesajı, ilgili alanın altında ve kırmızı kenarlıkla birlikte görünmeli.
4. Otomatik doldurmayı açın
autocomplete nitelikleri doğru yazıldığında tarayıcı formu neredeyse tek dokunuşla dolduruyor. Bu tek başına tamamlanma süresini yarıya indirebiliyor.
5. Alan sayısını gerçekten azaltın
Her alan bir terk sebebidir. “Firma”, “sektör”, “bütçe” gibi alanlar ilk temasta zorunlu olmamalı. Bilgiyi görüşmede toplamak, formu doldurmayan bir kullanıcıdan hiç bilgi alamamaktan iyidir.
6. Butonu parmak boyutuna getirin
Dokunma hedefi en az 44×44 piksel olmalı ve klavye açıkken görünür kalmalı. Ekranın altına sabitlenen gönder butonu, uzun formlarda tamamlanmayı artırıyor.
Gerçek cihazda test edin. Tarayıcının mobil emülatörü klavye davranışını, otomatik doldurmayı ve dokunma hassasiyetini taklit etmiyor. Teslim öncesi en az bir iOS ve bir Android cihazda formu baştan sona doldurun.
Ölçmeden bilemezsiniz
Formun görüntülenme, başlama ve tamamlanma olaylarını ayrı ayrı ölçün. Hangi alanda vazgeçildiğini görmek, hangi alanın kaldırılacağını tartışmaktan daha hızlı sonuç veriyor.