Form Tasarımı: Terk Oranını Düşüren Düzen Kuralları

Ziyaretçi, sitenizde en çok emeği forma harcar ve en kolay orada vazgeçer. Terkin sebeplerinin büyük kısmı gizemli değildir: alan sayısı, alanların dizilişi, hata mesajlarının yazılışı gibi doğrudan sizin verdiğiniz kararlardır. Aşağıdaki kuralların çoğu tek bir şablon dosyasında, birkaç saatlik işle uygulanabilir.

Önce ölçün: terk tam olarak nerede oluyor

"Form çalışmıyor" cümlesi hiçbir şey ifade etmez. Hangi alanda kopulduğunu bilmeden yapılan iyileştirme kumar olur. Analitik aracınızda şu üç olayı tanımlayın: formun görüntülenmesi, ilk alana odaklanma, gönderim denemesi. Ek olarak sunucu tarafında başarısız doğrulama sayılarını alan bazında kaydedin; hangi alanın kaç kez hata verdiğini gösteren basit bir tablo, çoğu ısı haritasından daha faydalıdır.

Bu kaydı iki hafta tuttuğunuzda tablo genelde aynı üç başlığı gösterir: biçimi tutmayan telefon veya TCKN alanları, hata sonrası girilen her şeyi silip başa dönen sayfalar ve zorunlu olduğu belirtilmediği için boş bırakılan alanlar. Sıralamanın kaynağı tahmin değil kendi kaydınız olduğu için, neyi önce düzelteceğiniz tartışma konusu olmaktan çıkar.

Her alanın bir bedeli vardır

Bir alan eklemek, gönderim olasılığını düşürür. Formdaki her alan için tek soruyu sorun: bu bilgi olmadan bir sonraki adımı atabilir miyim? Atabiliyorsanız o alan formda değil, sonraki temasta sorulmalı.

• İletişim formunda üç alan yeter: ad, ulaşım bilgisi (e-posta ya da telefon), mesaj. "Firma unvanı", "sektör", "bütçe aralığı" ilk temasta zorunlu olmasın.
• Üyelik formunda ad-soyad ve şifre tekrarına çoğu zaman gerek yoktur; şifreyi göster seçeneği daha iyi çalışır.
• Ödeme adımında fatura adresi ile teslimat adresi genelde aynıdır; varsayılan olarak "aynı" işaretli gelsin.
• Bilgiyi iki kere istemeyin: e-postayı iki kez yazdırmak hata oranını düşürmez, terki artırır.

Düzen: tek sütun, görünür etiket, doğru klavye

Alanları tek sütuna dizin. Yan yana iki alan gözü zikzak çizmeye zorlar ve mobilde zaten alt alta düşer. İstisna: il-ilçe veya son kullanma ayı-yılı gibi doğal ikililer.

• Etiket alanın üstünde ve kalıcı olsun. Yer tutucuyu etiket yerine kullanmak, yazmaya başlayınca sorunun ne olduğunu unutturur.
• Alan genişliği içeriğe uysun. Beş haneli posta kodu kutusunun adres kutusuyla aynı boyda olması yanlış bir vaattir.
• Mobil klavyeyi doğru açın. E-posta alanında type="email", telefon ve TCKN alanında inputmode="numeric" kullanın; kullanıcıyı klavye değiştirmeye zorlamayın.
• Tarayıcı otomatik doldurmasını açık bırakın. Alanlara doğru autocomplete değerini yazın: name, email, tel, postal-code, street-address. Kayıtlı profili olan kullanıcı sekiz alanlık bir adres formunu tek dokunuşla doldurur.
• Zorunlu olmayanları işaretleyin. Çoğu alan zorunluysa yıldız kalabalığı yerine "(isteğe bağlı)" yazmak daha okunur.

Türkiye'ye özgü alanlar

Yerel formların kendine has tuzakları var, çoğu tekrar tekrar aynı şekilde yapılıyor:

• Telefon: Kullanıcı boşluklu, parantezli veya başında sıfırla yazar. Reddetmeyin; rakam dışındaki karakterleri siz temizleyip 10 haneye indirin. Maskeleme kullanacaksanız yapıştırmayı da desteklesin.
• Fatura tipi: Bireysel/kurumsal seçimi alanları anında değiştirsin. Kurumsal seçilmeden vergi dairesi ve vergi numarası hiç görünmesin; tipi değiştiren kullanıcı önceki alanlara yazdıklarını kaybetmesin.
• TCKN ve vergi numarası: TCKN 11, vergi numarası 10 hanedir. Uzunluk ve basamak doğrulamasını istemcide de yapın ki kullanıcı gönderime kadar beklemesin; sunucuda tekrar doğrulamayı ihmal etmeyin.
• İl-ilçe: İki bağımlı açılır listeyi sıralı yükleyin; ilçe listesi il seçilmeden aktif olmasın.
• KVKK onayı: Açık rıza gereken durumlarda kutu önceden işaretli gelmemeli; pazarlama izni ile formun kendi işleyişi için gereken onay ayrı kutular olmalı. Aydınlatma metnini yeni sekmede açın ki bağlantıya tıklayan kullanıcı doldurduğu formu kaybetmesin.

Doğrulama ve hata mesajları

Uzun formları adımlara bölmek

On beş alanlık bir formu tek ekranda göstermek yerine üç adıma bölmek, algılanan yükü düşürür. Kurallar basit: adım sayısı baştan görünsün ("2/3"), her adım tek bir konuya ayrılsın (iletişim, adres, ödeme), geri dönen kullanıcı verisini kaybetmesin ve son adımda özet gösterilsin. Her adımın verisini tarayıcı belleğinde saklarsanız sekme yanlışlıkla kapandığında kullanıcı kaldığı yerden devam eder; kart bilgisi bu saklamanın dışında kalmalıdır.

Gönderim sonrası ekran da formun parçasıdır. "Mesajınız iletildi" yerine ne zaman dönüleceğini, hangi numaradan aranacağını ve acil durumda ne yapılacağını yazın.

Sık yapılan hatalar

• Gönder butonuna basınca çift kayıt oluşması: butonu ilk tıklamada kilitleyin, sunucuda da aynı gönderimi tekrar kontrol edin.
• Otomatik büyük harf ve otomatik düzeltmenin e-posta alanında açık kalması.
• Hata mesajını yalnızca kırmızı renkle vermek; ikon ve metin desteği olmadan bu bilgi bazı kullanıcılara ulaşmaz.
• Görsel doğrulamayı her forma koymak: spam yoksa gereksiz sürtünmedir, gizli tuzak alan çoğu zaman yeter.
• Formu iframe içinde vermek: mobil kaydırma ve otomatik doldurma bozulur.
• Uzun formu paylaşımlı hostingte zaman aşımına düşen bir işlemle göndermek; e-posta gönderimi gibi ağır işi kuyruğa alın, kullanıcıyı bekletmeyin.

Hızlı kontrol listesi

1. Formdaki her alanı savunun; savunamadığınızı bugün silin.
2. Tek sütun, üstte etiket, doğru klavye tipi ve açık otomatik doldurma uygulayın.
3. Hataları alan bazında, alanın altında ve düzeltme talimatıyla gösterin; girilen veriyi asla kaybetmeyin.
4. Alan bazlı hata sayılarını kaydedin, en çok hata veren üç alanı ayda bir gözden geçirin.
5. Gönderim sonrası ekranda sonraki adımı ve süreyi net yazın: "Mesajınız ulaştı, 1 iş günü içinde 0212 ile başlayan numaradan arayacağız."