it-swarm.asia

Apakah menggunakan hyperlink untuk menutup modal merupakan keputusan desain yang buruk?

Jadi saya mengalami sedikit bolak-balik dengan desainer UX kami yang saya anggap memberikan pengetahuan superiornya di bidangnya. Namun, sebagian dari desainnya tidak cocok dengan saya dan saya tidak dapat menelannya, jadi saya mencari pendapat dari pikiran yang lebih cerah daripada diri saya sendiri.

Intinya, kami memiliki modal sidebar yang muncul ketika tombol tertentu diklik, sidebar ini berisi berbagai bidang yang dapat dimasukkan pengguna ke dalam teks. Saat bilah sisi diaktifkan, latar belakang menjadi abu-abu dan mengklik di mana saja tidak menghasilkan tindakan. Di bagian bawah modal ini, ada hyperlink 'Batal dan tutup', ketika diklik, modal akan hilang dan tidak menyimpan informasi apa pun.

Fakta 'Batalkan dan tutup' ini adalah hyperlink tidak cocok dengan saya, bagi saya, hyperlink berarti saya akan dibawa ke suatu tempat. Tombol terasa lebih tepat dalam hal ini karena saya akan kembali ke konteks asli saya. Namun, seperti yang disebutkan, saya mungkin sepenuhnya ketinggalan jaman dalam pendapat saya.

Informasi tambahan

Saya memiliki sesuatu yang mirip dengan ini di kepala saya - https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_js_modal_js&stacked=h

Pada dasarnya berdagang tombol 'Tutup' untuk hyperlink 'Tutup' dan Anda memiliki situasi yang sama, meskipun contoh itu cocok dengan pendapat saya mengingat tampilannya.

@Ren menyebutnya dengan sempurna, telah dibuat kunci rendah untuk menjaga pengguna tetap pada modal. Itu belum dikodekan dengan benar sebagai tombol tetapi saya bisa mengerti mengapa itu ditata bagaimana sekarang dan tampaknya ini adalah pola umum yang digunakan. Bagi saya, saya pikir ini melanggar dasar-dasar dasar dan sepertinya saya salah. Terima kasih telah mendidik saya!

9
shicky

Alasan tautan tekstual digunakan sebagai ganti tombol adalah untuk membuatnya agak sulit bagi pengguna untuk menghapus atau membatalkan secara tidak sengaja. Tombol utama dalam bentuk apa pun adalah tombol Kirim. Untuk lebih menarik perhatian pada tindakan utama yang memungkinkan pengguna menyimpan data mereka, tombol Batal dan Hapus dapat dimasukkan sebagai tautan teks, menampilkan hierarki visual yang lebih rendah. Ini hanya dilakukan secara visual; di belakang, itu mungkin dikodekan menggunakan <button> dengan latar belakang transparan.

7
Ren

Kedengarannya seolah-olah Anda sedang mencari jawaban formula tentang pola tombol tertentu yang cocok untuk tujuan eksklusif dan merasa bahwa tujuan ini tidak terpenuhi.

Langsung dari kelelawar, tidak ada formula seperti itu. Tetapi di sini ada beberapa hal yang perlu dipertimbangkan.

Tautan Tombol Adalah Hal

Hanya teks, tombol tanpa bingkai telah menjadi elemen antarmuka yang cukup umum tanpa dibatasi hanya untuk tujuan hyperlink. Apakah tombol tautan digunakan di tempat lain dalam aplikasi Anda? Apakah mereka mudah diidentifikasi sebagai tombol, dengan kata lain, apakah mereka memiliki keterjangkauan yang tepat? Dan sudahkah Anda mengujinya dengan pengguna yang sebenarnya?

Tombol tautan, yang kemungkinan ditentukan oleh rekan kerja UX Anda, tidak sama dengan hyperlink saat digunakan secara terpisah. Kerancuan antara keduanya kemungkinan hanya akan menghasilkan halaman dengan banyak teks isi di mana hyperlink yang sebenarnya tertanam, seperti wiki. Tetapi bahkan dalam peristiwa itu tombol tautan masih dapat dibedakan dari badan teks dengan hyperlink diselingi dengan jarak dan singkatnya pelabelan.

Membungkuk ke Pengetahuan Unggul

Sangat sah untuk menanyakan kepada UXer mana Anda berkolaborasi dengan alasan di balik keputusannya jika Anda memiliki kekhawatiran tentang keterjangkauan kontrol (dapat ditemukan atau ditemukannya). Mundur dari pesta bashing pendapat dan menguji dengan pengguna . Jangan menjadikan itu sebagai satu-satunya tujuan latihan, tetapi gulirkan pertanyaan keterjangkauan ke dalam pengaturan uji kegunaan yang lebih luas tempat Anda menyusun alur kerja yang otentik untuk diikuti oleh peserta Anda dan amati apakah mereka menemukan kontrol yang sesuai, dan apakah itu menyebabkan mereka ragu-ragu.

A Short Thing About Modals

Gunakan perilaku modal yang benar - apakah diimplementasikan sebagai panel samping atau dialog mengambang adalah sekunder, saya sedang berbicara tentang perilaku - untuk secara sengaja menghentikan semua interaksi dan kekuatan lainnya pengguna untuk menyelesaikan langkah kritis terputus-putus. Segala sesuatu di luar zona modal harus berhenti berfungsi sampai tugas yang disajikan secara digital telah selesai atau ditinggalkan. Saya menggambarkan hal ini, jika mungkin dengan nada yang agak dogmatis, untuk menggambarkan perbedaan modal yang sebenarnya sebagai lawan dari panel samping yang meluas/menarik isi yang bekerja secara interaktif dengan apa yang ada di layar utama. Perbedaan itu tidak sepele.

Hal Singkat Lainnya Tentang Bahasa

Menurut uraian Anda label 'Tutup' mungkin tidak cukup. Sepertinya informasi yang baru saja diberikan pengguna akan dihapus, jadi ini lebih mirip dengan fungsi batal. Konsekuensi bagi pikiran saya perlu jelas bagi mereka, misalnya dengan label 'Hapus semua dan tutup'. Saya tidak dapat membayangkan bahwa itu adalah tujuan utama dari modal, jadi kolega Anda kemungkinan memiliki alasan untuk mengurangi fungsi batal.

Jadi kita perlu mempertimbangkan hal lain:

Panggilan untuk Bertindak, Urutan, dan Hirarki Keputusan

Untuk meninggalkan pengguna tanpa keraguan tentang kebutuhan untuk menyelesaikan tugas yang terputus-putus, modal perlu menyajikan ajakan bertindak yang jelas (CTA). Jika modal Anda menyajikan serangkaian formulir untuk diisi, atau pemilihan jenis profil untuk dibuat, itu akan menjadi fungsi 'kirim' (terlepas dari pelabelan sebenarnya dari tombol itu, yang didorong oleh konteks).

Jika fungsi 'kirim' itu menyampaikan keputusan dua arah yang sederhana seperti 'Batalkan' dan 'OK', putuskan apakah dengan konteks aplikasi kedua CTA harus disajikan secara merata (bebas bias) atau dengan cara di mana seseorang ditandai sebagai jalur yang disengaja, dalam hal ini Anda dapat menggunakan hierarki tombol untuk penekanan: Jalur yang disengaja - biasanya opsi konfirmasi - harus memiliki arti-visual yang lebih tinggi daripada batalkan pilihan : Keduanya tersedia tetapi Anda mengarahkan pengguna ke hasil yang diinginkan. Hal yang sama berlaku untuk keputusan multi-arah dengan lebih dari dua CTA, yang mana hanya satu (jika ada) yang harus disajikan sebagai yang utama, dan hanya jika itu mencerminkan kebenaran masalah tersebut. Selain itu, tunjukkan semua CTA sebagai sama, dalam hierarki datar.

Jika modal Anda memiliki ajakan bertindak tunggal (mis. 'Selesai', artinya dilakukan dan ditutup ), hierarki CTA menjadi tidak relevan seperti itu. Dalam acara itu saya akan mengatur kekuatan visual dari CTA singular yang sesuai untuk seluruh konten.

Hirarki CTA tiga tingkat yang umum sering menggunakan tombol yang diisi untuk tombol utama, tombol yang diuraikan untuk tombol sekunder, dan tombol tautan (hanya teks label) untuk lapisan kepentingan tersier. Perlakukan hierarki tiga tingkat dalam modal dengan hati-hati.

A Context of Context

Penting untuk CTA adalah arti-penting: Seberapa asertif Anda-harus-selesaikan ini persyaratan modal yang disampaikan, dalam konteks dari sisa konten modal?

Jika konten modal rumit dan secara visual berisik, desain tombol punchier memang dibenarkan karena CTA harus 'meneriakkan' keributan dari sisa UI modal. Terlebih lagi jika Anda menjaga CTA dinonaktifkan menunggu penyelesaian.

Namun untuk konten modal yang lebih pendiam secara visual, tombol tautan tanpa rim, diimbangi dengan spasi atau bantalan yang cukup, memenuhi tujuan yang sama. Dalam hal ini, CTA yang terlalu berani sebenarnya akan mendominasi konten yang kami inginkan agar pengguna fokuskan.

Jangan berhemat pada Pengujian

Tes kegunaan sederhana (dengan pengguna nyata, bukan pengembang lain atau koalisi in-house lain dari yang bersedia, tolong) pada kemampuan penemuan dari CTA harus membawa kejelasan tentang apakah itu cukup menonjol. Dalam hal ini, tekan keinginan Anda untuk memenangkan argumen dan mulai dengan opsi tombol tautan, dan amati (dan Anda berdua tidak memimpin saksi, tolong) apakah ajakan untuk bertindak memiliki biaya yang cukup bagi pengguna untuk mengetahui cara menyelesaikan tugas. Jika keterjangkauan terlalu lemah, dan periksa ini dengan min. lima pengguna yang tidak bias, mungkin memang ada kasus untuk tombol pemukul visual.

Pengguna mengkonsumsi konten halaman secara keseluruhan, dan bagaimana Anda memperkuat atau melemahkan tampilan dan nuansa panggilan untuk bertindak harus sesuai dengan komposisi total halaman.

Tinjau hal di atas dalam konteks dengan apa yang akan dicapai modal Anda; dengan segala cara mengungkapkan keprihatinan tentang arti-penting, dapat ditemukan, dan terjangkau - inilah beberapa kosakata untuk Google - dan mendorong pengujian pengguna sehingga Anda berdua menjauhkan diri dari sekadar pendapat. Namun demikian, berhati-hatilah karena itu adalah tanggung jawab profesional UXer untuk memastikan hal yang Anda kembangkan bersama sesuai dengan tugas dan memenuhi kebutuhan pengguna.

16
Andreas Mehne

Empat opsi yang saya temukan dan sebagian besar waktu yang digunakan adalah;

  • Tombol batal
  • Tombol tutup
  • Kunci melarikan diri
  • Klik di luar jendela

Anda dapat membaca lebih lanjut tentang modals di sini: https://uxplanet.org/best-practices-for-modals-overlays-dialog-windows-c00c66cddd8c

3
Raymonddv

Jika ini adalah halaman web yang Anda bicarakan, tidak ada yang salah dengan hyperlink. Asalkan memiliki label yang jelas. Mungkin "tutup" tidak cukup dan "tutup bentuk" atau sesuatu yang lebih dipahami oleh pengguna Anda. Dengan ini saya sampai pada masalah inti dari pertanyaan: Seharusnya tidak ditanyakan kepada kami tetapi untuk pengguna nyata, mengujinya dan Anda akan tahu. Tetapi untuk memberikan jawaban yang lebih langsung ... Saat ini sangat umum bahwa hyperlink tidak hanya digunakan untuk pergi ke halaman lain. Lihat formulir masuk ini dari Google:

enter image description here

"Tautan" buat akun membuka menu kecil:

enter image description here

3
jazZRo

Info ini mungkin tidak lengkap di sini. Tangkapan layar akan membantu.

Lagi pula saya menganggap harus ada tombol Panggil untuk Bertindak di bawah bidang formulir. Tutup 'hyperlink' atau tombol tersier sedemikian rupa sehingga tidak akan menarik perhatian sebanyak tombol primer di atas.

Ini cukup umum. Semoga ini membantu.

0
Arif Kazi