Prinsip Desain Formulir: 13 Praktik Terbaik yang Didukung Secara Empiris

Jika Anda tidak mengikuti praktik terbaik desain formulir, Anda menyisakan banyak uang di atas meja.

Meskipun formulir bukan bagian paling menarik dari pengoptimalan konversi, formulir cenderung paling dekat dengan uang—konversi makro. Menghabiskan sedikit waktu untuk mengoptimalkan formulir dapat menjadi beberapa pekerjaan pengoptimalan terpenting yang dapat Anda lakukan.

Tentu saja, praktik terbaik tidak bekerja sama di semua situs. Ini kontekstual. Namun secara umum, menerapkan taktik desain formulir yang lebih sering berhasil adalah cara yang baik untuk memulai.

Untungnya tidak ada kekurangan data, studi kasus, penelitian, dan contoh tentang praktik terbaik desain formulir. Itu datang dari semua tempat: studi kasus bisnis, posting blog, contoh pengujian A/B, penelitian kegunaan, studi pelacakan mata, dan banyak lagi.

Posting ini menguraikan beberapa praktik terbaik desain formulir yang paling umum. Jika Anda baru memulai pengoptimalan, gunakan sebagai dasar.

Jika Anda sedang mengerjakan formulir Anda, pedoman ini akan membantu Anda mendapatkan beberapa kemenangan cepat.

13 Prinsip Desain Formulir & Praktik Terbaik

1. Lebih sedikit lebih banyak (yaitu menghapus bidang formulir).

Setiap bidang yang Anda minta diisi oleh pengguna meningkatkan friksi. Hal terbaik yang dapat Anda lakukan untuk menyempurnakan pelengkapan formulir adalah menyingkirkan bidang sebanyak mungkin.

Dalam satu studi kasus, formulir kontak 11 bidang diganti dengan versi 4 bidang, dan penyelesaian formulir meningkat sebesar 160%. (Kualitas kiriman tetap sama.)

Dalam tes lain, formulir 5 bidang mengungguli formulir 9 bidang sebesar 34%. Dalam hal ini juga, tidak ada penurunan data atau kualitas prospek.

Sebagian besar formulir terlalu panjang. Ini adalah "sindrom pemasar rakus"—kami pikir kami membutuhkan semua data.

Baymard Institute menemukan bahwa rata-rata checkout berisi 14,88 bidang formulir. Tetapi pengujian kegunaan checkout mereka juga menunjukkan bahwa sebagian besar situs dapat mencapai pengurangan 20–60% dalam jumlah bidang formulir yang ditampilkan secara default.

Pada dasarnya, rata-rata checkout menampilkan bidang formulir dua kali lebih banyak dari yang diperlukan.

Jadi pengurangan form-field adalah titik nol untuk pengoptimalan konversi bottom-of-funnel. Di situlah Anda bisa mendapatkan beberapa kemenangan tercepat Anda. Upaya dan sumber daya yang dibutuhkan sangat rendah, dan potensi keuntungannya luar biasa, terutama dalam skala besar:

• Berapa banyak formulir yang Anda miliki?
• Berapa banyak orang yang mengalaminya?
• Apa artinya peningkatan 10% pada setiap formulir bagi Anda?

Sekarang, pasti ada masalah data, terutama jika Anda adalah perusahaan B2B yang melakukan perolehan prospek dan meneruskan prospek ke tim penjualan. Anda ingin memastikan bahwa mereka adalah prospek yang memenuhi syarat; jika tidak, lebih banyak prospek menjadi eksternalitas, menimbulkan biaya dalam produktivitas yang terbuang percuma.

Anda dapat menyaring prospek dengan, misalnya, sistem anggaran yang dialokasikan secara berjenjang. Pada dasarnya, berapa banyak prospek yang bersedia membayar? Tetapkan bilah terendah pada titik terendah yang menurut Anda layak untuk memimpin yang berharga, dan Anda akan menyingkirkan banyak penendang ban.

Contoh dari halaman agensi kami:

Saat Anda mengoptimalkan bidang formulir, tanyakan tentang datanya: Apakah Anda benar-benar membutuhkannya? Apakah Anda benar -benar membutuhkan telepon, faks, atau alamat orang? Apakah Anda memerlukan nama perusahaan jika Anda menjual lilin? Tanyakan hanya apa yang relevan. Expedia menghapus bidang "Perusahaan" dari formulir pemesanan mereka dan melihat peningkatan laba sebesar $12 juta per tahun.

Ketahuilah juga bahwa, khusus untuk B2B, ada perusahaan pengayaan data seperti Clearbit. Jika Anda mengumpulkan email dan mungkin nama depan, mereka umumnya dapat memperkaya data lainnya (nama perusahaan, ukuran, pegangan Twitter, dll.).

Pikirkan seperti ini: Setiap bidang tambahan membuat Anda kehilangan sejumlah prospek. Apakah informasi tambahan yang Anda peroleh dari lapangan sepadan dengan kehilangan orang-orang itu? Apakah Anda kehilangan sesuatu jika Anda tidak segera mendapatkan semua data?

Formulir pendaftaran terbaik singkat:

Seperti biasa, ada pengecualian. Mengurangi bidang formulir tidak selalu meningkatkan konversi. Selain itu, semakin banyak informasi yang Anda kumpulkan tentang seorang pengguna, semakin efektif pemasaran dan penargetan yang dapat Anda gunakan (biasanya).

Secara umum, aman untuk mengikuti heuristik ini: Hapus bidang formulir yang tidak berguna atau berlebihan.

2. Kolom tunggal mengalahkan formulir multi kolom.

Ini telah diteliti dengan baik dalam studi pelacakan mata (termasuk studi kami), studi kasus, dan tes A/B. Saat Anda memutuskan antara desain formulir satu kolom atau multikolom, default ke kolom tunggal.

Dalam studi CXL, peserta survei menyelesaikan formulir linear satu kolom (n = 356) rata-rata 15,4 detik lebih cepat daripada formulir multikolom (n = 346). Ini secara signifikan lebih cepat pada tingkat kepercayaan 95%.

Pedoman ini bukanlah hal baru. Sebenarnya, ini sudah ada selama bertahun-tahun, tapi sampai penelitian kami, tidak ada banyak bukti kuantitatif untuk itu. Namun, mereka yang berada dalam pengoptimalan konversi pasti akan melihat lusinan pengujian pengguna yang menarik, serta pengujian A/B, yang menunjukkan satu kolom menjadi lebih bermanfaat.

Saya yakin ada pengecualian untuk aturan ini (seperti yang lainnya), tetapi saya belum menemukan dukungan empiris apa pun.

3. Komunikasikan kesalahan dengan jelas.

Pengguna akan membuat kesalahan. Itu tidak bisa dihindari. Bahkan jika Anda menggunakan setiap praktik terbaik desain formulir, pengguna masih akan membunyikan pesan kesalahan. Bagaimana Anda menangani pesan kesalahan itu penting.

Merancang pesan kesalahan adalah tentang membatasi rasa frustrasi yang dirasakan pengguna dengan formulir Anda. Ketika pengguna merasa frustrasi, mereka menjadi stres. Kortisol mulai menumpuk. Jika mencapai ambang tertentu, pengguna menyerah dan pergi ke situs pesaing Anda.

Jadi, ya, lakukan riset kegunaan sendiri, tetapi mulailah dengan praktik terbaik pesan kesalahan ini:

• Jangan salahkan pengguna.
• Menulis seperti manusia, bukan robot.
• Pastikan kesalahan jelas, dan pesan ditempatkan di lokasi yang intuitif.
• Pastikan pengguna tahu cara memperbaiki kesalahan tersebut.
• Jangan cantumkan semua kesalahan di bagian atas halaman. Validasi inline adalah solusi yang baik.

4. Gunakan validasi bidang formulir sebaris.

Juga terkait dengan pesan kesalahan adalah bagaimana Anda berkomunikasi dengan pengguna apakah pengiriman mereka baik-baik saja. Validasi formulir adalah keseluruhan topiknya sendiri, tetapi kami dapat membahas beberapa aspek di sini.

Validasi sebaris adalah cara yang bagus untuk menemukan, memperingatkan, dan memperbaiki kesalahan secara waktu nyata. Alih-alih menunggu hingga pengguna menekan "kirim", mereka langsung mengetahui apa yang salah.

Berikut adalah contoh validasi inline yang bagus:

Ada banyak dukungan empiris untuk validasi inline. Pada tahun 2009, Luke Wroblewski menguji validasi inline terhadap kontrol (validasi setelah pengiriman), dan meskipun sampelnya kecil, ia menemukan hasil berikut dengan versi inline:

• peningkatan 22% dalam tingkat keberhasilan;
• 22% penurunan kesalahan yang dibuat;
• peningkatan 31% dalam peringkat kepuasan;
• 42% penurunan waktu penyelesaian;
• 47% penurunan jumlah fiksasi mata.

Saya akan mengambil hasil tersebut. (Saya telah melihat hasil serupa dari pengujian A/B yang dijalankan di banyak situs e-niaga.)

Ini semua tentang ekspektasi dan komunikasi yang jelas. Seorang pengguna tidak perlu menebak apa yang akan berhasil dan apa yang tidak. Semakin mudah Anda membuatnya untuk memahami ekspektasi, semakin sedikit kesalahan yang dibuat orang dan semakin banyak penyelesaian formulir yang akan Anda capai.

5. Urutkan bidang dari yang paling mudah hingga yang paling sulit untuk diisi.

Prinsip "komitmen dan konsistensi" Robert Cialdini menyatakan bahwa ketika seseorang mengambil tindakan atau langkah kecil menuju sesuatu, mereka merasa harus menyelesaikannya. Untuk alasan ini, merupakan praktik terbaik desain formulir untuk mengutamakan hal-hal yang paling mudah.

Tunggu sampai nanti untuk memperkenalkan friksi (mis., informasi penagihan atau apa pun yang terlalu pribadi). Izinkan orang melengkapi informasi pengiriman sebelum menagih. (Mereka sering kali sama, jadi mereka tidak perlu mengetiknya lagi.)

Jangan lakukan ini:

6. Permudah pengetikan.

Prinsip menyeluruh untuk praktik terbaik desain formulir terus bermunculan: Permudah pengguna (terutama untuk formulir seluler).

Batasi jumlah pengetikan yang perlu dilakukan pengguna untuk mengisi formulir. Salah satu caranya adalah mengotomatiskan sebanyak mungkin dengan fitur seperti isi otomatis.

Saat memutuskan pengisian otomatis, berikut adalah beberapa pertanyaan bagus untuk direnungkan:

• Apakah Anda memiliki default yang bagus untuk bidang ini?
• Apa riwayat yang tersedia?
• Apakah Anda memiliki nilai yang umum digunakan?
• Bisakah Anda menggunakan browser fitur atau pengaturan seluler untuk mengisi bidang?
• Dapatkah Anda menghitung lapangan? (misalnya, isi otomatis negara bagian berdasarkan kode pos)

Pemformatan otomatis juga sangat penting (dan sangat jarang digunakan). Izinkan pengguna memasukkan data (khususnya bidang seperti kode pos, nomor telepon, dan kartu kredit) sesuka mereka. Diperlukan beberapa baris kode untuk memperbaiki pemformatan setelah mereka memasukkannya. Jangan biarkan kemalasan Anda merusak pengalaman pengguna.

Jadi jangan lakukan ini:

7. Tunjukkan apakah setiap kolom wajib diisi atau opsional (kecuali jika semuanya wajib diisi).

Pertama, tanyakan apakah Anda perlu menyertakan kolom opsional tersebut. Sebagian besar waktu, mereka tidak perlu. Misalnya, siapa yang membutuhkan gelar atau nama tengah saya? Mengapa mengubah satu bidang menjadi empat?

Fokus pada informasi yang Anda butuhkan dari pengguna sehingga mereka dapat memulai. Anda tidak ingin pengguna yang duduk di rumah berpikir, "Mengapa mereka membutuhkan ini?!"

Tunjukkan apakah setiap kolom wajib diisi atau opsional, kecuali jika semuanya wajib diisi.

8. Kolom nama dan nomor telepon harus menjadi satu kolom.

Alih-alih bidang nama depan dan nama belakang, cukup buat bidang yang bertuliskan "nama lengkap". Alih-alih tiga bidang untuk nomor telepon, gunakan satu.

Masalah dengan banyak bidang adalah masalah interaksi. Umumnya, praktik terbaik desain formulir adalah "semakin sedikit bidang, semakin baik."

Bayangkan menggunakan perangkat seluler Anda dan harus mengetuk lima kolom untuk nama dan nomor (dua untuk nama, tiga untuk nomor) bukan hanya dua? Gesekan yang tidak perlu.

9. Tawarkan tombol radio alih-alih kotak drop-down.

Gerakan UX berargumen bahwa formulir dengan menu pilihan sering ditinggalkan karena "membutuhkan lebih banyak waktu dan upaya untuk menyelesaikannya".

Lebih khusus lagi, mereka mengklaim bahwa mereka memperlambat pengguna dengan mengganggu aliran pengguna, sulit dibaca, dan membutuhkan manuver mouse yang cekatan. Mereka tidak memberikan data pendukung.

Nah, mudah untuk mengujinya. Jadi kami melakukannya. Kami baru saja meluncurkan survei besar tentang persepsi kepercayaan online, jadi kami memiliki kesempatan untuk memanipulasi formulir survei dan mengajukan pertanyaan yang sama kepada orang yang berbeda dalam format yang berbeda (pilihan ganda vs. tombol radio).

Hasil? Formulir dengan tombol radio lebih cepat diselesaikan. Peserta survei menyelesaikan formulir radio-button (n = 354) rata-rata 2,5 detik lebih cepat daripada formulir dengan tombol multi-pilihan (n = 354). Ini secara signifikan lebih cepat pada level 95%.

10. Jangan menonjolkan bidang kode kupon.

Saat orang melihat kolom “Masukkan kode kupon di sini”, mereka merasa kurang istimewa. Mereka berpikir, “Mengapa saya tidak memilikinya?” Mereka mendapatkan FOMO.

Banyak yang pergi ke Google untuk mencari kupon. Beberapa menemukan kupon di situs pihak ketiga, yang memotong keuntungan Anda. Banyak yang tidak pernah kembali.

Meninggalkan situs untuk mencari kupon adalah alasan umum pengabaian keranjang belanja.

Jadi ini bukan ide yang bagus:

Alih-alih spanduk besar, buat tautan teks bertuliskan, "Punya kupon?" (atau yang serupa). Jika pengguna mengklik tautan, itu harus membuka kolom input. Tautan teks tidak menonjol secara visual, sehingga lebih sedikit orang yang memperhatikan.

Pelanggan yang sudah memiliki kode kupon akan mencari cara untuk memasukkannya, jadi kecuali Anda menyembunyikannya (terlalu) dengan baik, mereka masih dapat menerapkan kuponnya. Dan jika pelanggan telah menerima kupon (melalui email), aplikasikan secara otomatis dan tampilkan diskonnya.

11. Hindari tombol "kosongkan bidang".

Tak seorang pun yang mengisi formulir Anda ingin mengosongkan bidang. Jika mereka tidak ingin mengisinya, mereka bisa pergi begitu saja.

Jika mereka mengisi formulir dan secara tidak sengaja mengosongkan bidang, ada kemungkinan besar mereka tidak akan memulai dari awal.

Praktik terbaik desain formulir khusus seluler

Meskipun sebagian besar hal di atas juga dapat diterapkan ke seluler, ada beberapa masalah khusus yang perlu diingat dengan layar yang lebih kecil. Pengguna seluler kurang sabar, dan menggunakan ponsel cerdas lebih sulit daripada menggunakan desktop.

Kami memiliki seluruh pos tentang topik ini, jadi selami lebih dalam di sana. Tetapi jika Anda menginginkan beberapa titik awal, ikuti pedoman ini.

12. Tawarkan fokus lapangan.

Jika Anda memiliki formulir dengan banyak bidang, Anda tidak ingin pengguna tersesat di formulir. Ini sangat penting pada perangkat seluler: Layar yang lebih kecil memungkinkan kontrol visual yang lebih sedikit atas formulir.

Jadikan kolom input yang sedang diedit menonjol dan fokus.

13. Jangan sembunyikan kata sandi.

Meskipun mungkin tampak seperti masalah keamanan untuk menampilkan kata sandi saat pengguna mengetiknya, ini jauh lebih baik untuk pengalaman pengguna.

Seperti yang diringkas NN/g:

Kegunaan menderita saat pengguna mengetik kata sandi dan satu-satunya umpan balik yang mereka dapatkan adalah deretan peluru. Biasanya, menutupi kata sandi bahkan tidak meningkatkan keamanan, tetapi merugikan bisnis Anda karena kegagalan login.

Peringatan: Jalankan eksperimen Anda sendiri.

Hanya karena sesuatu adalah "praktik terbaik" tidak berarti itu selalu merupakan solusi optimal. Terkadang, praktik terbaik gagal.

Situs web bersifat kontekstual. Apa yang berfungsi di satu situs mungkin tidak berfungsi di situs lain.

Selain itu, konteks bisnis Anda mungkin berbeda. Siapa tahu, mungkin Anda sangat membutuhkan nama tengah itu sebagai data. Siapa saya untuk menilai?

Jadi ambil semuanya dengan sebutir garam. Ketahuilah bahwa semuanya telah diuji dan dipelajari, tetapi pada akhirnya, yang terpenting adalah cara kerjanya di situs Anda, dan dalam konteks bisnis Anda.

Ini adalah pedoman, bukan mandat.

Kesimpulan

Prinsip-prinsip desain bentuk yang baik mungkin bekerja lebih sering daripada tidak, tetapi tidak universal. Tidak ada solusi peluru perak: Anda harus menguji barang ini sendiri.

Namun jika Anda memulai dari awal, praktik terbaik desain formulir ini adalah dasar yang baik—tempat untuk memulai, tetapi bukan tujuan akhir Anda.

Mengerjakan sesuatu yang berhubungan dengan ini? Posting komentar di komunitas CXL !