Formulir kontak adalah komponen kunci dari banyak situs web. Meskipun pada umumnya langsung, Anda perlu memastikan bahwa mereka mudah digunakan jika Anda ingin mengumpulkan prospek dan tetap berhubungan dengan pengguna Anda. Ini biasanya tidak menjadi masalah dengan lalu lintas kantor, tetapi menggunakan formulir bisa jadi sulit jika Anda menggunakan perangkat seluler.
Dalam tutorial ini, kita akan berbicara sedikit tentang pentingnya mendesain formulir yang ramah seluler. Selanjutnya, kami akan memandu Anda melalui lima kiat untuk memastikan formulir Anda berfungsi dengan lancar di perangkat seluler.
Ayo mulai bekerja!
Mengapa penting agar formulir Anda ramah seluler
Bentuk datang dalam berbagai bentuk dan ukuran. Paling sering, Anda akan berurusan dengan formulir kontak:
Formulir pendaftaran (langganan) juga sangat populer karena memungkinkan Anda mengumpulkan email dan menargetkannya selama kampanye:
Namun, formulir dapat digunakan untuk semua jenis tujuan lain. Misalnya, Anda dapat mengumpulkan informasi menggunakan survei online atau kuesioner , dalam hal ini Anda memerlukan formulir yang memungkinkan pengguna untuk memasukkan tanggapan.
Dengan kata lain, formulir sangat serbaguna dan hampir semua situs menggunakan formulir dengan satu atau lain cara. Oleh karena itu, formulir Anda harus mudah digunakan (kecuali jika Anda ingin memberikan pengalaman yang membuat frustrasi pengunjung Anda).
Menggunakan formulir dari komputer desktop atau laptop biasanya sangat mudah. Anda memiliki mouse dan keyboard lengkap, jadi memilih bidang yang ingin Anda gunakan dan memasukkan data seharusnya tidak menjadi masalah. Namun, menjelajahi web dari ponsel cerdas atau perangkat ringkas lainnya memiliki kerumitan.
Saat bekerja dengan jari Anda di layar kecil, berinteraksi dengan formulir terkadang bisa membuat kewalahan karena keputusan desain yang buruk. Ini adalah sesuatu yang harus Anda hindari dalam desain Anda sendiri. Lagi pula, jika pengguna seluler tidak dapat berinteraksi dengan formulir Anda, Anda mungkin kehilangan konversi, prospek, atau hanya mengganggu pengunjung.
Penting juga untuk memahami bahwa lalu lintas seluler sekarang, jika tidak lebih, penting daripada sumber desktop. Faktanya, lalu lintas seluler telah melampaui yang terakhir dalam beberapa tahun terakhir. Ini berarti bahwa merancang situs web yang ramah seluler harus menjadi tujuan utama Anda saat memulai proyek baru.
Kiat 5 untuk mendesain formulir seluler yang mudah digunakan
Untungnya, merancang formulir yang ramah seluler tidak sesulit yang Anda bayangkan. Dalam kebanyakan kasus, Anda hanya perlu mengingat beberapa hal mendasar dan menguji formulir Anda secara menyeluruh sebelum menggunakannya. Mari kita bicara tentang bagaimana melakukannya!
1. Hapus semua bagian yang tidak perlu
Semakin banyak bidang yang berisi formulir Anda, semakin sulit untuk digunakan di seluler. Memang, penggunaan formulir di seluler lebih rumit. Dengan mengurangi jumlah bidang atau bagian yang disertakan dalam formulir Anda, Anda dapat memaksimalkan peluang pengunjung untuk mengisinya.
Berikut adalah contoh cepat dari a formulir kontak dengan beberapa kolom tambahan yang tidak diperlukan di ponsel:
Dalam kebanyakan kasus, semua yang Anda butuhkan untuk menjadi hebat formulir kontak adalah nama, email, dan isi pesan yang ingin Anda terima. Segala sesuatu yang lain bergantung pada jenis situs web yang Anda gunakan dan jika Anda mencoba mengumpulkan prospek.
Pada akhirnya, semakin sedikit bidang yang dimiliki formulir, semakin mudah bagi pengunjung seluler untuk menggunakannya. Lagi pula, memilih bidang menggunakan layar sentuh bisa jadi rumit, tidak peduli seberapa bagus desainnya, sehingga meminimalkan jumlah lompatan yang harus dilakukan pengguna.
Tujuan Anda saat ini adalah meninjau formulir yang ada di situs Anda. Telusuri setiap bagiannya dan tentukan apakah Anda benar-benar membutuhkan bidang tambahan selain yang disebutkan sebelumnya. Jika ada bidang yang tidak berguna, hapus saja.
2. Gunakan daftar drop-down jika memungkinkan
Sebagian besar dari kita merasa nyaman mengetik di perangkat seluler dan menggunakan layar sentuh. Namun, mengirim SMS ke teman dan mengisi a formulir kontak adalah dua pengalaman yang sangat berbeda. Dengan ini, ada kemungkinan Anda akan frustrasi jika harus mengetikkan banyak informasi.
Salah satu cara untuk membuat hidup lebih mudah bagi pengunjung seluler Anda adalah dengan menyederhanakan pilihan yang harus mereka buat tentang elemen situs Anda. Untuk memberi Anda gambaran tentang apa yang sedang kita bicarakan, mari kita manfaatkan contoh sebelumnya dari pemesanan restoran:
Untuk membuat sebuah pemesanan, Anda mungkin perlu meninggalkan nama, email, telepon et menunjukkan waktu, serta jumlah orang yang hadir. Ada dua cara Anda bisa membuat bidang formulir untuk memvalidasi waktu. pemesanan:
- Konfigurasikan bidang yang hanya menerima entri numerik.
- Rancang daftar drop-down termasuk semua waktu yang tersedia untuk reservasi.
Seperti yang bisa Anda bayangkan, yang terakhir lebih ramah pengguna untuk pengguna seluler. Dengan pendekatan ini, mereka tidak perlu memasukkan angka dan mereka dapat memilih yang terbaik untuk mereka dari opsi yang Anda sertakan.
Ide bagi Anda untuk melihat formulir Anda dan melihat apakah mereka menyertakan bidang yang bisa Anda ganti dengan menu turun bawah. Ini tidak selalu terjadi karena Anda tidak dapat menggunakan menu drop-down untuk mengumpulkan nama atau email, tetapi opsi lain dapat digunakan.
Apa pun kasus penggunaannya, Anda ingin memastikan menu drop-down Anda menyertakan opsi yang mudah dipilih dari perangkat seluler. Dengan kata lain, buat menunya cukup besar sehingga seseorang tidak perlu mematuk untuk memilih opsi yang tepat.
3. Pastikan tombol pengiriman Anda mudah disentuh
Tip ini cukup sederhana, tetapi tetap harus disebutkan. Setiap formulir yang Anda desain harus menyertakan cara bagi pengguna untuk mengonfirmasi bahwa mereka ingin mengirimkan data yang dimasukkan. Dalam kebanyakan kasus, itu berarti membuat tombol kirim:
Saat menggunakan komputer biasa, mengklik tombol kirim adalah hal paling alami di dunia. Namun, kami telah menemukan beberapa formulir di seluler yang jauh lebih sulit untuk menekan tombol.
Jika pengunjung Anda tidak dapat mengirimkan informasi yang mereka masukkan ke dalam formulir Anda, semua upaya Anda akan sia-sia. Ditambah, tidak ada yang terlihat tidak profesional seperti tombol mengirim itu tidak bekerja seperti yang diharapkan.
Untuk mendesain tombol pengiriman yang lebih baik untuk seluler, berikut tiga kiat untuk dipertimbangkan:
- Pastikan ukurannya cukup besar sehingga Anda dapat dengan mudah mengetuknya di perangkat seluler.
- Jangan letakkan tombol Anda terlalu dekat dengan item lain sehingga pengguna tidak menyentuhnya dengan benar.
- Sorot tombol Anda, misalnya menggunakan warna kontras atau tipografi kreatif.
Di atas semua itu, Anda juga ingin menguji tombol Anda sebelum situs Anda ditayangkan. Kami akan membahas lebih dalam tentang cara melakukan ini dalam satu menit. Untuk saat ini, mari kita bicara tentang kinerja.
4. Pastikan formulir Anda dimuat dengan cepat
Kami berbicara banyak tentang kinerja situs web di banyak artikel kami dan itu bukan karena kami membutuhkan kecepatan. Intinya adalah, kebanyakan orang tidak menyukai situs web yang lambat, yang sangat masuk akal.
Dengan kecepatan internet yang lebih cepat, akan sulit untuk menunggu situs web dimuat terlalu lama. Selain itu, kecepatan internet seluler cenderung lebih bervariasi daripada koneksi rumah biasa. Ini berarti bahwa situs web Anda harus sangat dioptimalkan untuk perangkat seluler jika Anda ingin membuat pengguna ini senang, karena tidak semua dari mereka akan memiliki akses internet (yaitu cepat).
Tip khusus ini dapat diterapkan ke seluruh situs web Anda, tetapi juga penting untuk halaman seluler yang menampilkan formulir Anda. Jika bagian ini dari situs Anda memakan waktu terlalu lama untuk dimuat, anda kehilangan konversi dan peluang untuk terhubung dengan pengunjung Anda.
Biasanya, situs web membutuhkan waktu tidak lebih dari dua detik untuk dimuat. Setelah Anda melewati batas ini, rasio pentalan cenderung meningkat secara dramatis yang merupakan berita buruk bagi Anda, dan mengingat sifat penjelajahan seluler, sebaiknya pertahankan waktu ini serendah mungkin. .
Dengan mengingat hal ini, ada banyak cara untuk meningkatkan kinerja situs Anda secara keseluruhan. Misalnya, Anda dapat meningkatkan ke paket yang lebih baikHotel, gunakan tema responsif yang dioptimalkan untuk kecepatan dan kompres gambar Anda. Tentu saja, ini akan membantu semua pengguna, tetapi akan sangat berguna bagi mereka yang menggunakan perangkat yang lebih kecil.
5. Uji formulir Anda sebelum diterbitkan
Mengingat formulir adalah bagian penting dari sebagian besar situs web, masuk akal jika Anda mengujinya secara menyeluruh sebelum menerbitkannya. Dengan WordPress, proses ini cukup mudah. Anda dapat melanjutkan dan mendesain halaman tertentu untuk menampilkan formulir Anda, dan tidak menerbitkannya sampai Anda mengujinya sepenuhnya.
Tentu saja, plugin atau tema mana yang ingin Anda gunakan terserah Anda (asalkan dapat membantu mengembangkan situs seluler). Namun, ketika sampai pada tahap pengujian, kami menyarankan Anda untuk tetap sederhana dan menggunakan alat seperti alat pembangunan Chrome untuk melakukan pekerjaan.
Mari kita lihat contoh singkatnya. Jika Anda menggunakan Chrome, lanjutkan dan pratinjau halaman dengan formulir yang ingin Anda uji. Kemudian klik kanan di mana saja di halaman ini dan pilih opsi memeriksa . Chrome akan menampilkan seperangkat alat yang dapat Anda gunakan untuk meninjau dan mengedit kode sumber halaman ke kanan dan ke kiri, Anda dapat melihat pratinjau tampilannya dari perangkat seluler:
Di bagian atas layar, Anda dapat menggunakan menu untuk beralih di antara resolusi yang berbeda. Chrome menyertakan pengaturan untuk beberapa perangkat seluler populer, tetapi Anda juga dapat memasukkan resolusi khusus.
Pada tahap ini, Anda harus memeriksa tampilan dan perilaku formulir kontak Anda di beberapa perangkat. Ambil contoh di bawah ini - formulir berfungsi dengan baik, tetapi Anda dapat melihat bahwa itu tidak sesuai sebagaimana mestinya. Berikan perhatian khusus pada teks dan ikon khususnya, yang terlalu dekat dengan tepi layar:
Salah satu cara untuk mencegah masalah ini adalah dengan membuat formulir Anda tetap sederhana, seperti yang kami sebutkan di tip pertama. Dalam contoh di bawah ini, formulir menggunakan beberapa daftar turun bawah dan hanya memerlukan tiga bidang. Ini membuatnya mudah digunakan dan, yang lebih penting, bentuknya sangat sederhana sehingga harus cocok untuk semua perangkat:
Jika Anda memiliki masalah dengan formulir apa pun, Anda jelas harus segera menyelesaikannya. Jika tidak, Anda berisiko mengasingkan audiens seluler Anda, yang kami coba hindari terlebih dahulu!
Kesimpulan
Memastikan situs web Anda kompatibel dengan perangkat seluler adalah kunci untuk menjaga lalu lintas dan tidak membuat pengunjung Anda frustrasi. Secara khusus, formulir Anda harus mudah digunakan di perangkat seluler jika Anda tidak ingin ketinggalan menerima pesan atau mengumpulkan prospek yang berharga.
Ketika datang untuk mendesain formulir mobile-friendly, berikut ini lima tips untuk menyederhanakan hidup Anda:
- Hapus semua bagian yang tidak perlu.
- Gunakan daftar drop-down jika memungkinkan.
- Pastikan tombol pengiriman Anda mudah ditekan.
- Pastikan formulir Anda dimuat dengan cepat.
- Uji formulir Anda sebelum menerbitkannya.
