Minta lebih sedikit, dan jelaskan permintaan itu
Mulai dari tugas langsung pengguna, lalu minta hanya data yang diperlukan untuk menyelesaikannya. Newsletter mungkin hanya membutuhkan alamat email; pengiriman membutuhkan alamat. Keduanya tidak otomatis membutuhkan tanggal lahir, jabatan, atau persetujuan pemasaran yang dibundel. Tunda pertanyaan tambahan kecuali diperlukan untuk hasil pertama.
Di formulir, jelaskan siapa penerima data dan tujuannya, dengan tautan mudah ke pemberitahuan privasi lengkap. Organisasi yang diatur oleh UK GDPR memiliki kewajiban transparansi yang mencakup tujuan dan retensi, di antara informasi lain yang bergantung pada konteks. Ini bukan nasihat hukum umum: ajukan peninjau yang tepat untuk menyetujui pengumpulan dan salinan pemberitahuan untuk pasar Anda.
Nyatakan bidang yang wajib dan format tidak biasa sebelum pengiriman; tanda bintang atau warna saja tidak cukup.
Jaga persetujuan pemasaran opsional terpisah dari tindakan yang diperlukan untuk mengirimkan pesanan, permintaan, atau tugas akun.
Biarkan label dan kontrol bawaan yang bekerja
Setiap bidang, checkbox, grup radio, select, dan tombol memerlukan nama yang menjelaskan tujuannya. Gunakan label yang terlihat yang diasosiasikan dengan kontrolnya, biasanya melalui elemen label yang nilai atribut for-nya cocok dengan id input. Ini memberi area aktivasi yang lebih besar dan memungkinkan teknologi bantu mengidentifikasi kontrol yang benar. Letakkan dekat dengan input.
Teks petunjuk bukanlah nama bidang. Jangan jadikan itu satu-satunya instruksi yang hilang setelah mengetik. Jika konteks visual membuat label terasa berlebihan, pertahankan nama yang dapat diakses dalam kode dan uji. W3C mencatat bahwa teks title adalah pengganti label primer yang kurang dapat diandalkan.
Gunakan email, tel, date, radio, checkbox, atau select saat cocok daripada menirunya dengan field teks generik.
Gunakan label aksi seperti Create account atau Place order ketika itu lebih jelas daripada Submit.
Validasi untuk perbaikan, lalu terapkan aturan di server
Gunakan constraint bawaan untuk pemeriksaan yang stabil: tipe input yang tepat, required, length, range, dan pattern yang sesuai. Beri contoh format yang berguna sebelum menjadi kesalahan. Pemeriksaan klien meningkatkan pemulihan tetapi bukan batas keamanan. Permintaan dapat melewatinya, jadi server harus memvalidasi sintaks dan aturan bisnis yang relevan sebelum memproses data.
Saat pengiriman gagal, pertahankan nilai yang diterima. Tempatkan ringkasan kesalahan sebelum formulir, identifikasi setiap bidang, jelaskan masalah dan perbaikannya, dan tautkan ke bidang tersebut. Ulangi pesan ringkas di samping bidang. Kaitkan itu dengan kontrol, tunjukkan status tidak valid bila sesuai, dan pindahkan fokus secara dapat diprediksi ke kesalahan atau ringkasan pertama. Konfirmasi keberhasilan secara eksplisit.
Validasi saat mengetik hanya bila umpan baliknya stabil dan berguna, seperti ketersediaan nama pengguna. Kegagalan format yang tak terhindarkan saat mengetik seringkali lebih baik diperiksa setelah fokus meninggalkan bidang atau saat submit. Uji pesan dinamis dengan pembaca layar; pembaruan langsung dapat membantu tetapi gangguan konstan adalah friksi.
Di server, definisikan tanggal, opsi, panjang, dan format yang diizinkan. Denylist karakter mencurigakan bukanlah kontrol primer yang dapat diandalkan.
Untuk timeout atau pengiriman duplikat, jelaskan apakah permintaan diterima dan berikan tindakan aman selanjutnya.
Dukung autofill browser dan entri mobile
Tambahkan token autocomplete spesifik yang menjelaskan data: given-name, family-name, email, tel, shipping street-address, billing postal-code, username, dan new-password adalah contoh umum. Token membantu browser dan pengelola kata sandi membedakan bidang serupa. Autofill adalah bantuan, bukan janji; perilaku bervariasi dan dapat bergantung pada formulir yang usable, nama atau id, dan kontrol submit.
Gunakan input type yang dapat menawarkan keyboard mobile yang sesuai dan validasi dasar browser. Jangan blokir paste di field kata sandi atau menghalangi pengelola kata sandi. Browser modern mungkin tetap menawarkan pengisian kredensial ketika autocomplete dimatikan pada form login, jadi uji perjalanan nyata di browser yang digunakan audiens Anda.
Untuk billing dan shipping pada satu halaman, gunakan token pengelompokan yang sesuai sehingga bidang identik tidak bingung.
Pastikan label tetap terlihat dan skrip tidak mengira nilai yang diisi browser sebagai bidang kosong.
Buat jalur bisa diselesaikan dengan keyboard
Seseorang harus bisa menyelesaikan formulir tanpa pointer. Operasi keyboard juga mendukung input suara dan teknologi bantu lain yang menghasilkan keystroke. Tab dari sebelum formulir ke setelahnya: urutan harus mengikuti tugas, fokus harus terlihat, dan tidak ada kontrol, dialog, date picker, tautan kesalahan, atau panel bantuan yang boleh menjebak fokus.
Kontrol bawaan menyediakan banyak dari ini. Dropdown kustom, tanggal berformat, pencarian alamat, alternatif CAPTCHA, dan modal membutuhkan perilaku keyboard yang disengaja, manajemen fokus, dan nama yang dapat diakses. Jika komponen kustom tidak bisa menyamai alternatif bawaan yang usable, sederhanakan. Uji pada lebar sempit dan zoom tinggi.
Gunakan Tab, Shift+Tab, Enter, Space, Escape, dan tombol panah yang relevan untuk menyelesaikan alur normal, kesalahan, dan kondisional.
Rilis perbaikan dengan batasan dan kemampuan rollback
Sebelum mengubah formulir bernilai tinggi, catat baseline untuk pengiriman yang dikonfirmasi, kesalahan menurut kategori bidang, kegagalan teknis, dan waktu penyelesaian. Jangan kumpulkan nilai mentah atau putar ulang data sensitif hanya untuk meningkatkan metrik. Padukan sinyal agregat dengan pemeriksaan aksesibilitas dan keyboard, karena satu angka jarang menjelaskan mengapa orang kesulitan.
Rilis satu perubahan material pada satu waktu bila praktis, seperti perumusan ulang label, penghapusan field opsional, atau pemulihan yang diperbaiki. Definisikan batasan sebelum pengujian: kesalahan otorisasi pembayaran, kontak dukungan, atau regresi aksesibilitas bisa relevan. Uji konfigurasi produksi dengan akun aman dan lingkungan uji pembayaran. Skrip pembayaran, penanganan data, dan kepatuhan memerlukan tinjauan keamanan, pembayaran, dan legal yang memenuhi syarat; artikel ini tidak mensertifikasi kepatuhan.
SIU membuat ini lebih aman melalui preflight peluncuran: konfirmasi dependensi, perilaku klien, respons server, konfirmasi, dan rollback. Ini adalah remediasi proaktif, bukan pengganti proses status-hidup atau pemantauan outage tim.
Gunakan nilai yang hilang dan malformed, sesi yang kedaluwarsa, respons lambat, lookup yang gagal, dan klik ganda pada aksi akhir.
Miliki konfigurasi sebelumnya, seorang pemilik, dan langkah deployment yang dapat dibalik siap sebelum eksposur meningkat.