Praktik terbaik formulir login

Gunakan fitur browser lintas platform untuk membuat formulir login yang aman, dapat diakses, dan mudah digunakan.

Sam Dutton

Jika pengguna perlu masuk ke situs Anda, maka desain formulir masuk yang baik sangat penting. Terutama untuk orang-orang dengan koneksi internet yang buruk, di perangkat seluler, di terburu-buru, atau merasa stres. Formulir login yang tidak dirancang dengan baik akan mendapatkan rasio pantulan yang tinggi. Setiap pantulan dapat berarti pengguna yang hilang dan tidak puas—bukan hanya login yang terlewat peluang.

Berikut adalah contoh formulir login sederhana yang menunjukkan semua praktik terbaik:

Checklist

• Menggunakan elemen HTML yang bermakna: <form>, <input>, <label>, dan <button>.
• Beri label setiap input dengan <label>.
• Menggunakan atribut elemen untuk mengakses browser bawaan fitur: type, name, autocomplete, required.
• Memberikan input name dan id mengatribusikan nilai stabil yang tidak berubah antara pemuatan halaman atau deployment situs.
• Tempatkan login di <form> sendiri elemen ini.
• Pastikan pengiriman formulir berhasil.
• Gunakan autocomplete="new-password" dan id="new-password" untuk input {i>password<i} di formulir pendaftaran, dan {i> password<i} baru di formulir {i>reset-password<i}.
• Gunakan autocomplete="current-password" dan id="current-password" untuk input sandi login.
• Menyediakan fungsi Tampilkan sandi.
• Gunakan aria-label dan aria-describedby untuk input sandi.
• Jangan menggandakan input.
• Desain formulir agar keyboard seluler tidak mengaburkan input atau tombol.
• Pastikan formulir dapat digunakan di perangkat seluler: gunakan teks yang dapat dibaca, serta pastikan input dan tombol cukup besar untuk berfungsi sebagai target sentuh.
• Pertahankan branding dan gaya di halaman pendaftaran dan login Anda.
• Melakukan pengujian di lapangan dan di lab: membuat analisis halaman, interaksi, analisis interaksi, dan pengukuran performa yang berfokus pada pengguna ke dalam alur pendaftaran dan login.
• Menguji di berbagai browser dan perangkat: perilaku formulir bervariasi secara signifikan di berbagai platform.

Gunakan HTML yang bermakna

Gunakan elemen yang dibuat untuk tugas: <form>, <label>, dan <button>. Tombol-tombol ini memungkinkan fungsi browser bawaan, meningkatkan aksesibilitas, dan memberi makna pada markup.

Gunakan <form>

Anda mungkin tergoda untuk menggabungkan input dalam <div> dan menangani data input pengiriman hanya dengan JavaScript. Umumnya lebih baik menggunakan <form> . Hal ini membuat situs Anda dapat diakses oleh pembaca layar dan alat bantu lainnya memungkinkan berbagai perangkat browser bawaan, sehingga semakin mudah untuk fungsi dasar untuk browser yang lebih lama, dan masih dapat berfungsi meskipun JavaScript gagal.

Gunakan <label>

Untuk memberi label pada input, gunakan <label>.

<label for="email">Email</label>
<input id="email" …>

Dua alasan:

• Ketukan atau klik pada label akan memindahkan fokus ke inputnya. Kaitkan label dengan input dengan menggunakan atribut for label dengan name atau id input.
• Pembaca layar mengucapkan teks label ketika label atau input label mendapat fokus.

Jangan gunakan placeholder sebagai label input. Orang biasanya melupakan apa yang digunakan ketika mereka mulai memasukkan teks, terutama jika mereka mulai teralihkan ("Apakah saya memasukkan alamat email, nomor telepon, atau akun tanda pengenal?"). Ada banyak potensi masalah dengan placeholder: lihat Jangan Menggunakan Placeholder Atribut dan Placeholder di Kolom Formulir Adalah Berbahaya jika Anda tidak yakin.

Sebaiknya tempatkan label di atas input. Hal ini memungkinkan konsistensi desain di perangkat seluler dan desktop, serta menurut AI Google riset, memungkinkan pemindaian yang lebih cepat oleh pengguna. Anda mendapatkan label dan input dengan lebar penuh, dan Anda tidak perlu menyesuaikan label dan lebar input agar sesuai dengan teks label.

Buka Glitch posisi label pada perangkat seluler untuk memeriksanya sendiri.

Gunakan <button>

Gunakan <button> untuk tombol! Elemen tombol memberikan perilaku yang mudah diakses dan bentuk bawaan fungsionalitas kiriman, dan mereka dapat dengan mudah ditata. Tidak ada gunanya menggunakan <div> atau beberapa elemen lain yang berpura-pura menjadi tombol.

Pastikan tombol kirim menunjukkan fungsinya. Contohnya mencakup Buat akun atau Login, bukan Submit atau Start.

Memastikan keberhasilan pengiriman formulir

Membantu pengelola sandi memahami bahwa formulir telah dikirim. Ada dua cara untuk melakukannya:

• Buka halaman lain.
• Emulasikan navigasi dengan History.pushState() atau History.replaceState(), dan hapus formulir {i>password<i}.

Dengan permintaan XMLHttpRequest atau fetch, pastikan proses login yang berhasil dilaporkan dalam respons dan ditangani dengan mengeluarkan formulir dari DOM sebagai menunjukkan keberhasilan bagi pengguna.

Pertimbangkan untuk menonaktifkan tombol Login setelah pengguna mengetuk atau mengklik anotasi. Banyak pengguna mengklik tombol beberapa kali bahkan di situs yang cepat dan responsif. Hal itu memperlambat interaksi dan menambah beban server.

Sebaliknya, jangan nonaktifkan pengiriman formulir yang menunggu input pengguna. Misalnya, jangan nonaktifkan tombol Login jika pengguna belum memasukkan informasi pelanggan mereka PIN. Pengguna mungkin melewatkan sesuatu pada formulir, lalu coba ketuk berulang kali (dinonaktifkan) Login dan merasa fitur ini tidak berfungsi. Paling tidak, jika Anda harus menonaktifkan pengiriman formulir, jelaskan kepada pengguna apa yang tidak diperlukan saat mereka klik pada tombol yang dinonaktifkan.

Jangan menggandakan input

Beberapa situs memaksa pengguna untuk memasukkan email atau sandi dua kali. Itu mungkin mengurangi error untuk beberapa pengguna, tetapi menyebabkan pekerjaan ekstra bagi semua pengguna, dan meningkatkan pengabaian tarif. Mengajukan dua kali pertanyaan juga tidak masuk akal di mana browser mengisi otomatis alamat email atau menyarankan {i>password<i} yang kuat. Sebaiknya izinkan pengguna untuk mengonfirmasi email mereka (Anda tetap harus melakukannya) dan permudah mereka untuk mereset {i>password<i} jika perlu.

Memaksimalkan atribut elemen

Di sinilah keajaiban benar-benar terjadi! Browser memiliki beberapa fitur bawaan bermanfaat yang menggunakan atribut elemen input.

Jaga kerahasiaan sandi—tetapi izinkan pengguna melihatnya jika mereka mau

Input sandi harus memiliki type="password" untuk menyembunyikan teks sandi dan membantu browser memahami bahwa input itu untuk sandi. (Perhatikan bahwa {i>browser<i} menggunakan berbagai teknik untuk memahami peran input dan memutuskan apakah menawarkan untuk menyimpan {i>password<i} atau tidak.)

Anda harus menambahkan tombol Tampilkan sandi agar pengguna dapat memeriksa teks yang dimasukkan—dan jangan lupa untuk menambahkan link Lupa sandi. Lihat Aktifkan tampilan sandi.

Berikan keyboard yang tepat kepada pengguna seluler

Gunakan <input type="email"> untuk memberi pengguna seluler keyboard yang tepat dan mengaktifkan validasi alamat email bawaan dasar oleh browser... tanpa JavaScript wajib!

Jika Anda perlu menggunakan nomor telepon, bukan alamat email, <input type="tel"> akan mengaktifkan keypad telepon di perangkat seluler. Anda juga dapat menggunakan Atribut inputmode jika diperlukan: inputmode="numeric" ideal untuk PIN angka. Semua Hal yang Ingin Anda Ketahui inputmode memiliki detail yang lebih lengkap.

Mencegah keyboard seluler menghalangi tombol Login

Sayangnya, jika Anda tidak berhati-hati, {i>keyboard<i} dapat menutupi formulir Anda atau, lebih buruk, menghalangi sebagian tombol Login. Pengguna mungkin menyerah sebelum menyadari apa yang telah terjadi.

Jika memungkinkan, hindari hal ini dengan hanya menampilkan input email/ponsel dan sandi dan tombol Login di bagian atas halaman login. Tempatkan konten lainnya di bawah.

Uji di berbagai perangkat

Anda harus melakukan pengujian di berbagai perangkat untuk target audiens, dan menyesuaikannya sebagaimana mestinya. BrowserStack memungkinkan pengujian gratis untuk open source project di berbagai perangkat sungguhan dan browser.

Coba gunakan dua halaman

Beberapa situs (termasuk Amazon dan eBay) menghindari masalah dengan meminta email/telepon dan sandi pada dua halaman. Pendekatan ini juga menyederhanakan pengalaman: pengguna hanya ditugaskan untuk satu hal pada satu waktu.

Idealnya, ini harus diimplementasikan dengan satu <form>. Gunakan JavaScript untuk awalnya hanya menampilkan input email, lalu menyembunyikannya dan menampilkan input sandi. Jika Anda harus memaksa pengguna untuk membuka halaman baru antara memasukkan email {i>password<i}, formulir di halaman kedua harus memiliki elemen input tersembunyi dengan nilai email, untuk membantu mengaktifkan pengelola sandi untuk menyimpan nilai yang benar. Sandi Gaya Formulir yang Dipahami Chromium menyediakan contoh kode.

Membantu pengguna menghindari memasukkan kembali data

Anda dapat membantu browser menyimpan data dengan benar dan mengisi otomatis input, sehingga pengguna tidak harus ingat untuk memasukkan nilai email dan {i>password<i}. Hal ini sangat penting di perangkat seluler, dan penting untuk input email, yang mendapatkan rasio pengabaian tinggi.

Ada dua bagian untuk ini:

1. Atribut autocomplete, name, id, dan type membantu browser memahami peran input untuk menyimpan data yang nantinya dapat digunakan untuk {i>autofill.<i} Agar data dapat disimpan untuk isi otomatis, browser modern juga memerlukan input untuk memiliki nilai name atau id yang stabil (tidak dihasilkan secara acak pada setiap pemuatan halaman atau deployment situs), dan berada dalam <form> dengan tombol submit.

2. Atribut autocomplete membantu browser mengisi otomatis input dengan benar menggunakan data yang disimpan.

Untuk input email, gunakan autocomplete="username", karena username dikenali oleh pengelola sandi di browser modern—meskipun Anda harus menggunakan type="email" dan Anda mungkin perlu menggunakan id="email" dan name="email".

Untuk input sandi, gunakan nilai autocomplete dan id yang sesuai untuk membantu browser membedakan antara {i>password<i} baru dan saat ini.

Gunakan autocomplete="new-password" dan id="new-password" untuk sandi baru

• Gunakan autocomplete="new-password" dan id="new-password" untuk input sandi saat pendaftaran formulir, atau {i>password<i} baru dalam bentuk {i>change-password<i}.

Gunakan autocomplete="current-password" dan id="current-password" untuk sandi yang sudah ada

• Gunakan autocomplete="current-password" dan id="current-password" untuk input sandi di formulir login, atau input untuk sandi lama pengguna dalam formulir ubah sandi. Fungsi ini memberi tahu {i>browser<i} Anda ingin menggunakan {i>password<i} saat ini yang disimpan untuk situs tersebut.

Untuk formulir pendaftaran:

<input type="password" autocomplete="new-password" id="new-password" …>

Untuk login:

<input type="password" autocomplete="current-password" id="current-password" …>

Mendukung pengelola sandi

Browser yang berbeda menangani isi otomatis email dan saran sandi secara berbeda, tetapi dampaknya hampir sama. Pada Safari 11 dan yang lebih baru di desktop, misalnya, pengelola sandi ditampilkan, lalu menampilkan autentikasi (sidik jari atau pengenalan wajah) digunakan jika tersedia.

Chrome di desktop menampilkan saran email, menampilkan pengelola sandi, dan mengisi otomatis sandi.

Sandi browser dan sistem isi otomatis tidak mudah. Algoritma untuk menebak, menyimpan, dan menampilkan nilai tidak terstandardisasi, dan bervariasi dari antarplatform. Misalnya, sebagaimana ditunjukkan oleh Hidde de Vry: "Pengelola sandi Firefox melengkapi heuristiknya dengan sistem resep."

Isi otomatis: Hal yang harus diketahui developer web, tetapi Jangan memiliki informasi selengkapnya tentang penggunaan name dan autocomplete. Elemen HTML spesifikasi mencantumkan semua 59 kemungkinan nilai.

Aktifkan browser untuk menyarankan sandi kuat

Browser modern menggunakan heuristik untuk memutuskan kapan harus menampilkan UI pengelola sandi dan menyarankan {i>password<i} yang kuat.

Berikut cara Safari melakukannya di desktop.

(Saran kata sandi unik yang kuat telah tersedia di Safari sejak versi 12.0.)

Generator sandi browser bawaan memungkinkan pengguna dan developer untuk mencari tahu seperti apa “{i>password<i} yang kuat” alamat IP internalnya. Karena {i>browser<i} dapat menyimpan dengan aman {i>password<i} dan mengisinya secara otomatis sesuai kebutuhan, pengguna tidak perlu mengingat atau memasukkan sandi. Mendorong pengguna untuk memanfaatkan browser bawaan pembuat {i>password<i} juga berarti mereka lebih cenderung menggunakan {i>password<i} yang unik dan kuat {i>password<i} di situs Anda, dan cenderung tidak menggunakan ulang {i>password<i} yang dapat disusupi di tempat lain.

Membantu menyelamatkan pengguna dari input yang tidak sengaja hilang

Tambahkan atribut required ke kolom email dan sandi. Browser modern akan otomatis meminta dan menetapkan fokus untuk data yang hilang. JavaScript tidak diperlukan!

Desain untuk jari dan ibu jari

Ukuran browser default untuk hampir semua yang berkaitan dengan elemen input dan tombolnya terlalu kecil, terutama di seluler. Ini mungkin tampak jelas, tapi masalah umum terkait formulir login di banyak situs.

Memastikan input dan tombol cukup besar

Ukuran dan {i>padding<i} default untuk {i>input<i} dan tombol terlalu kecil di desktop dan bahkan lebih buruk lagi di perangkat seluler.

Menurut aksesibilitas Android panduan ukuran target yang disarankan untuk objek layar sentuh adalah 7–10 mm. Antarmuka Apple pedoman menyarankan 48x48 px, dan W3C menyarankan setidaknya 44x44 CSS piksel. Pada saat itu tambahan, tambahkan (setidaknya) sekitar 15 px padding untuk elemen input dan tombol untuk seluler, dan sekitar 10 piksel di desktop. Cobalah ini dengan perangkat seluler sungguhan dan jari atau ibu jari sungguhan. Anda seharusnya dapat mengetuk setiap {i>wireframe<i} tombol input dan input lainnya.

Target ketuk tidak memiliki ukuran yang tepat Audit Lighthouse dapat membantu Anda mengotomatiskan proses deteksi elemen input yang terlalu kecil.

Desain jempol

Telusuri target sentuh dan Anda akan melihat banyak gambar jari telunjuk. Namun, di dunia nyata, banyak orang menggunakan ibu jari untuk berinteraksi dengan ponsel. Jempol lebih besar dari jari telunjuk, dan kontrol yang kurang tepat. Semua alasan itu untuk menyediakan target sentuh berukuran tertentu.

Buat teks yang cukup besar

Seperti ukuran dan {i>padding<i}, ukuran {i>font<i} browser default untuk elemen input dan terlalu kecil, terutama di perangkat seluler.

Browser pada platform yang berbeda menentukan ukuran {i>font<i} yang berbeda, sehingga sulit untuk menentukan ukuran font tertentu yang bekerja dengan baik di mana saja. Survei singkat tentang situs populer menunjukkan ukuran 13–16 piksel di desktop: sesuai dengan ukuran fisik adalah standar minimum yang baik untuk teks di seluler.

Artinya, Anda perlu menggunakan ukuran piksel yang lebih besar di perangkat seluler: 16px di Chrome untuk desktop cukup mudah dibaca, tetapi dengan penglihatan yang baik sekalipun sulit untuk membacanya 16px teks di Chrome untuk Android. Anda dapat menyetel ukuran piksel font yang berbeda untuk ukuran area pandang menggunakan media kueri. 20px sudah tepat di perangkat seluler—tetapi Anda harus mengujinya dengan teman atau kolega yang memiliki gangguan penglihatan.

Dokumen tidak menggunakan ukuran font yang dapat dibaca Audit Lighthouse dapat membantu Anda mengotomatisasi proses deteksi teks yang terlalu kecil.

Menyediakan ruang yang cukup di antara input

Tambahkan margin yang cukup agar input berfungsi dengan baik sebagai target sentuh. Dengan kata lain, arahkan sekitar selebar jari.

Pastikan input Anda terlihat jelas

Gaya visual batas default untuk input membuatnya sulit dilihat. Hampir tidak terlihat di beberapa platform, seperti Chrome untuk Android.

Seperti halnya padding, tambahkan batas: pada latar belakang putih, aturan umum yang baik adalah untuk menggunakan #ccc atau yang lebih gelap.

Gunakan fitur bawaan browser untuk memperingatkan tentang nilai input yang tidak valid

Browser memiliki fitur bawaan untuk melakukan validasi formulir dasar untuk input dengan Atribut type. Browser akan memperingatkan saat Anda mengirimkan formulir dengan nilai yang tidak valid, dan mengatur fokus pada {i>input <i}yang bermasalah.

Anda dapat menggunakan pemilih CSS :invalid untuk menandai data yang tidak valid. Gunakan :not(:placeholder-shown) untuk menghindari pemilihan input tanpa konten.

input[type=email]:not(:placeholder-shown):invalid {
  color: red;
  outline-color: red;
}

Coba berbagai cara untuk menandai input yang memiliki nilai tidak valid.

Gunakan JavaScript jika diperlukan

Aktifkan/nonaktifkan tampilan sandi

Anda harus menambahkan tombol Tampilkan sandi agar pengguna dapat memeriksa teks yang mereka masukkan. Kegunaan yang dialami pengguna tidak dapat melihat teks yang mereka masukkan. Saat ini tidak ada cara bawaan untuk melakukan ini, meskipun ada rencana untuk penerapan. Anda akan harus menggunakan JavaScript.

Kode berikut menggunakan tombol teks untuk menambahkan fungsi Tampilkan sandi.

HTML:

<section>
  <label for="password">Password</label>
  <button id="toggle-password" type="button" aria-label="Show password as plain text. Warning: this will display your password on the screen.">Show password</button>
  <input id="password" name="password" type="password" autocomplete="current-password" required>
</section>

Berikut ini CSS untuk membuat tombol terlihat seperti teks biasa:

button#toggle-password {
  background: none;
  border: none;
  cursor: pointer;
  /* Media query isn't shown here. */
  font-size: var(--mobile-font-size);
  font-weight: 300;
  padding: 0;
  /* Display at the top right of the container */
  position: absolute;
  top: 0;
  right: 0;
}

Dan JavaScript untuk menampilkan sandi:

const passwordInput = document.getElementById('password');
const togglePasswordButton = document.getElementById('toggle-password');

togglePasswordButton.addEventListener('click', togglePassword);

function togglePassword() {
  if (passwordInput.type === 'password') {
    passwordInput.type = 'text';
    togglePasswordButton.textContent = 'Hide password';
    togglePasswordButton.setAttribute('aria-label',
      'Hide password.');
  } else {
    passwordInput.type = 'password';
    togglePasswordButton.textContent = 'Show password';
    togglePasswordButton.setAttribute('aria-label',
      'Show password as plain text. ' +
      'Warning: this will display your password on the screen.');
  }
}

Inilah hasil akhirnya:

Membuat input sandi dapat diakses

Gunakan aria-describedby untuk menguraikan aturan sandi dengan memberinya ID elemen yang mendeskripsikan batasan-batasannya. Pembaca layar menyediakan teks label, tipe input ({i>password<i}), dan kemudian {i>description<i}.

<input type="password" aria-describedby="password-constraints" …>
<div id="password-constraints">Eight or more characters with a mix of letters, numbers and symbols.</div>

Saat menambahkan fungsi Tampilkan sandi, pastikan untuk menyertakan aria-label untuk memperingatkan bahwa sandi akan ditampilkan. Jika tidak, pengguna mungkin secara tidak sengaja mengungkapkan {i> password<i}.

<button id="toggle-password"
        aria-label="Show password as plain text.
                    Warning: this will display your password on the screen.">
  Show password
</button>

Anda dapat melihat cara kerja kedua fitur ARIA di Glitch berikut:

Membuat Formulir yang Mudah Diakses memiliki tips lainnya untuk membantu membuat formulir mudah diakses.

Lakukan validasi secara real time dan sebelum pengiriman

Elemen dan atribut formulir HTML memiliki fitur bawaan untuk validasi dasar, tetapi Anda juga harus menggunakan JavaScript untuk melakukan validasi yang lebih kuat saat pengguna memasukkan data dan kapan mereka mencoba mengirimkan formulir.

Langkah 5 formulir login codelab menggunakan Constraint Validation API (yang merupakan didukung secara luas) untuk menambahkan validasi kustom menggunakan UI browser bawaan untuk mengatur fokus dan menampilkan prompt.

Cari tahu lebih lanjut: Menggunakan JavaScript untuk real-time yang lebih kompleks validasi.

Analytics dan RUM

"Apa yang tidak dapat Anda ukur, Anda tidak dapat meningkatkannya" terutama berlaku untuk pendaftaran dan formulir login. Anda perlu menetapkan sasaran, mengukur keberhasilan, meningkatkan kualitas situs, dan ulangi.

Kegunaan diskon pengujian dapat berupa berguna untuk mencoba perubahan, tetapi Anda akan membutuhkan data di dunia nyata untuk memahami pengalaman pengguna pada formulir pendaftaran dan login Anda:

• Analisis halaman: penayangan halaman pendaftaran dan login, rasio pantulan, dan keluar.
• Analisis interaksi: sasaran funnel (di mana pengguna mengabaikan alur login atau login Anda?) dan peristiwa (tindakan apa yang dilakukan pengguna saat berinteraksi dengan formulir Anda?)
• Performa situs: yang berpusat pada pengguna metrik (adalah pendaftaran dan login Anda formulir lambat karena beberapa alasan dan, jika ya, apa penyebabnya?).

Anda juga dapat mempertimbangkan penerapan pengujian A/B untuk mencoba pendekatan untuk mendaftar dan login, serta peluncuran bertahap untuk memvalidasi perubahan pada sekelompok pengguna sebelum merilis perubahan itu untuk semua pengguna.

Panduan umum

UI dan UX yang didesain dengan baik dapat mengurangi pengabaian formulir login:

• Jangan membuat pengguna mencari-cari untuk login! Tempatkan link ke formulir login di bagian atas halaman, menggunakan kata-kata yang dipahami dengan baik seperti Login, Buat Akun atau Daftar.
• Jaga agar tetap fokus! Formulir pendaftaran bukanlah tempat untuk mengalihkan perhatian orang dengan penawaran dan fitur situs lainnya.
• Minimalkan kerumitan pendaftaran. Mengumpulkan data pengguna lainnya (seperti alamat atau detail kartu kredit) hanya saat pengguna melihat manfaat yang jelas dari penyediaan layanan otomatis dan data skalabel.
• Sebelum pengguna memulai formulir pendaftaran, jelaskan apa nilainya proposisi yang berbeda. Apa manfaat yang diperoleh mereka dari login? Memberikan informasi konkret kepada pengguna insentif untuk menyelesaikan pendaftaran.
• Jika memungkinkan, izinkan pengguna untuk mengidentifikasi diri mereka dengan nomor ponsel alih-alih alamat email, karena beberapa pengguna mungkin tidak menggunakan email.
• Permudah pengguna untuk mereset sandi mereka, dan buat agar halaman Lupa sandi? sudah jelas.
• Link ke dokumen persyaratan layanan dan kebijakan privasi Anda: jelaskan untuk pengguna sejak awal bagaimana Anda melindungi data mereka.
• Cantumkan logo dan nama perusahaan atau organisasi Anda pada pendaftaran dan laman masuk, dan pastikan bahasa, {i>font<i}, dan gaya sesuai dengan di situs Anda. Beberapa formulir tidak terasa seperti milik situs yang sama dengan lainnya terutama jika keduanya memiliki URL yang sangat berbeda.

Terus belajar

• Membuat Formulir yang Menarik
• Praktik Terbaik untuk Desain Formulir Seluler
• Kontrol formulir yang lebih andal
• Membuat Formulir yang Mudah Diakses
• Menyederhanakan Alur Login Menggunakan Credential Management API
• Memverifikasi nomor telepon di web dengan WebOTP API

Foto oleh Meghan Schiereck di Unsplash.