it-swarm.asia

OK / Batal di kiri / kanan?

Sebaiknya OK tombol ada di sebelah kiri Cancel tombol atau sebaliknya?

Apakah ada studi yang menyarankan salah satu solusi?

349
Art

Seperti halnya semuanya: tes pengguna! Untungnya, pahlawan kegunaan Jakob Nielsen melompat ke penyelamatan di sini dalam bukunya artikel Alertbox tentang tombol OK/Batalkan :

Haruskah tombol OK datang sebelum atau sesudah tombol Batal? Mengikuti konvensi platform lebih penting daripada suboptimisasi kotak dialog individu.

Kostya tepat pada saat menyarankan kepatuhan terhadap pedoman platform. Tapi bagaimana dengan platform berbasis web?

Jika Anda merancang aplikasi berbasis web, keputusannya lebih sulit, tetapi Anda mungkin harus menggunakan platform yang disukai oleh sebagian besar pengguna Anda. Log server Anda akan menunjukkan kepada Anda persentase pengguna Windows vs. Mac untuk situs web atau intranet spesifik Anda. Tentu saja, Windows umumnya memiliki lebih banyak pengguna, jadi jika Anda tidak dapat repot untuk memeriksa log, maka pedoman yang akan berlaku untuk sebagian besar situasi adalah OK terlebih dahulu, Batalkan yang lalu.

Ia juga menyebutkan dua pedoman penting tambahan yang dapat Anda pertimbangkan saat membuat tombol OK/Batal:

  • Sering kali lebih baik memberi nama tombol untuk menjelaskan apa yang dilakukannya daripada menggunakan label generik (seperti "OK"). Label eksplisit berfungsi sebagai "bantuan tepat waktu," memberi pengguna lebih percaya diri dalam memilih tindakan yang benar.
  • Jadikan tombol yang paling umum dipilih sebagai default dan sorot (kecuali jika aksinya sangat berbahaya; dalam kasus itu, Anda ingin pengguna memilih tombol secara eksplisit daripada mengaktifkannya secara tidak sengaja dengan menekan Enter).
202
Rahul

Jawabannya ada dalam pedoman antarmuka pengguna untuk sistem yang Anda gunakan.

Untuk Windows

Presentasikan tombol komit dalam urutan sebagai berikut:

  • OK/[Lakukan]/Ya
  • [Jangan lakukan itu]/Tidak
  • Membatalkan
  • Terapkan (jika ada)
  • Bantuan (jika ada)

Jadi Batalkan selalu di sebelah kanan tombol OK.

Untuk MacOS

Tombol yang memulai tindakan adalah yang terjauh ke kanan. Tombol Batal ada di sebelah kiri tombol ini.

Jadi untuk pengguna MacOS Cancel ada di sebelah kiri tombol OK.

Untuk Android

Tindakan mengabaikan dialog selalu di sebelah kiri. Tindakan penolakan kembali ke pengguna ke keadaan sebelumnya.

Tindakan afirmatif ada di sebelah kanan. Tindakan afirmatif melanjutkan kemajuan menuju tujuan pengguna yang memicu dialog.

Untuk Android, Cancel ada di sebelah kiri tombol OK.

Untuk sistem lain lihat pedoman.

142
Kostya

Pikirkan metafora "membaca". Orang Barat membaca dari kiri ke kanan, otak kita dikondisikan untuk mengalir dari kiri ke kanan. CANCEL pada dasarnya adalah langkah mundur (kiri) dan OK/SUBMIT/YES/Etc., Adalah langkah maju (kanan).

64
GoodShovel

Sepertinya konvensi Windows OK/Cancel telah melakukan banyak pengkondisian otak bagi pengguna. Jadi tes kegunaan pasti akan keluar dengan banyak orang mencari tombol OK di sebelah kiri, Batal di sebelah kanan.

Tapi itu tidak mengubah naluri paling dasar seseorang yang berinteraksi dengan sistem tanpa pengkondisian sebelumnya. Naluri dasar saya mengatakan bahwa tombol OK/Persetujuan/Bergerak Maju, apa pun warna atau ukuran yang Anda terapkan, perlu berada di Tepi kanan kotak dialog.

Pertimbangkan kotak dialog ini, tanpa label atau highlight warna:

enter image description here

Di mana Anda akan mengklik? Saya akan mengklik tombol di Tepi kanan, jika saya ingin mengirim formulir. Alasannya adalah, bahwa sebelum Windows, saya telah dikondisikan ke dalam naluri saya dengan cara berikut:

  • Bahasa Inggris mengalir dari kiri ke kanan.
  • Navigasi browser berfungsi Kembali (kiri) dan Maju (Kanan). enter image description here
  • Game 2D lama seperti Dangerous Dave memindahkan karakter ke kanan, saat mereka semakin berkembang.

enter image description here

  • Angka di garis bilangan bertambah ke kanan, turun ke kiri.

  • Bobot atom di tabel periodik naik ke kanan.

  • Jam berdetak ke kanan.

  • Kalender meningkatkan tanggal ke kanan.

Saya pikir platform Windows telah menciptakan anti-pola dengan OK/Batal, yang sekarang begitu luas sehingga studi kegunaan memvalidasi. Tetapi jika Anda mempertimbangkan faktor-faktor di atas, saya percaya menjaga tombol utama di sebelah kanan dapat dibenarkan dan posisi yang dapat dipertahankan.

EDIT: Satu faktor tambahan yang perlu dipertimbangkan adalah konsistensi. Jika Anda mengharapkan tombol tambahan di kotak dialog Anda, tombol utama di Tepi kanan akan membantu untuk tetap konsisten dengan penempatan. Contoh visual akan memperjelas ini:

enter image description here

39
Adnan Khan

Untuk pengguna yang bahasanya dibaca dari kiri ke kanan, saya sarankan meletakkan tombol OK di sebelah kiri, karena para pengguna akan menganggap lebih penting hal pertama yang mereka lihat.

Ini akan memungkinkan subset pengguna ini untuk menyelesaikan tugas mereka secepat mungkin.

17
Ryan Shripat

IMHO tidak masalah terlalu banyak di mana Anda akan menempatkan tombol "OK": ke kiri atau ke kanan. Tidak masalah apa pun jenis pengguna yang mengunjungi situs Anda (dengan bahasa Ibrani atau Arab). Tidak masalah perangkat lunak apa yang mereka gunakan. Statistik memberi tahu kami bahwa 55% pengguna ingin melihat tombol "OK" dari kanan tetapi jika kami menaruhnya di kanan, maka 45% pengguna lainnya akan merasa tidak puas.

Solusi terbaik adalah dengan menekankan tombol "OK" (membuatnya lebih menonjol daripada "Batal") dan semua pengguna akan menunjukkan tombol "OK" dengan mudah sebagai tombol yang lebih penting dan utama.

Google dan perusahaan lain menggunakan pendekatan ini dalam perangkat lunak mereka.

enter image description here

16
webvitaly

Luke Wroblewski menulis buku tentang formulir web (Desain Formulir Web: Mengisi Kosong) dan dia juga membahas beberapa prinsip seperti: "Tindakan Primer & Sekunder" (http: // www.lukew.com/resources/articles/psactions.asp ), "Label Formulir Atas, Kanan atau Kiri Rata" (http: // www.lukew.com/ff/entry.asp?504) atau "path to completion", dll. (Anda dapat membaca juga http) : //www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php )

Jadi, IMO tergantung pada penempatan label apa yang Anda miliki (lebih disukai secara vertikal) dan kiri-ke-kanan + aturan top-down, untuk memiliki jalur penyelesaian yang baik, Anda harus menempatkan tindakan utama terlebih dahulu (OK) dan kemudian yang sekunder (+ + Batal)

EDIT: Penempatan label dalam formulir, oleh Caroline Jarrett, 2010 http://www.formsthatwork.com/files/Articles/labels-on-forms-for-uxlx-2010.pdf

15
Ecaterina Moraru

Saya pikir semua orang telah memberikan poin yang baik tetapi ada satu lagi poin kunci untuk disebutkan di sini.

Tombol-tombol seperti Ok/Kirim/Simpan dll disebut tombol tindakan positif. Demikian pula, tombol-tombol seperti Cancel/Reset dll disebut tombol tindakan negatif.

Sekarang untuk menjawab pertanyaan, sebagian besar dari mereka telah datang dengan beberapa poin bagus tetapi di sini ada persepsi lain yaitu Pengujian Pengguna suatu aplikasi biasanya memutuskan sebagian besar masalah. Bagaimanapun semua aplikasi yang dibuat hanya untuk pengguna.

Ada beberapa tes saat mata & tes panas dilakukan pada pengguna dan masih dilakukan tergantung pada ketersediaan laboratorium. Skenario terbaik muncul adalah bahwa sebagian besar pengguna mulai melihat aplikasi web atau aplikasi lain dari Kiri - ke - Kanan & dari sudut atas dan mulai menggulir ke bawah mengambil hotspot kunci dan umumnya berakhir ke kiri bawah sehingga itu adalah selalu bagus untuk menjaga tombol aksi positif di sebelah kiri dan tombol aksi negatif di sebelah kanan.

Juga, tidak menyangkal fakta bahwa ini adalah penelitian yang didasarkan pada beberapa pengguna, tidak perlu bahwa ini akan selalu berlaku tetapi sebagian besar waktu akan.

Ada satu lagi poin kunci di sini adalah bahwa ada lebih banyak ruang antara tombol tindakan positif & negatif sehingga pengguna akan mengambil sedikit lebih banyak waktu untuk mencapai tombol negatif dan dengan demikian akan memberi mereka banyak waktu untuk berpikir dan bereaksi.

Saya telah mencoba menjelaskan beberapa poin berdasarkan pengalaman saya dan dari makalah penelitian.

Lakukan komentar, sehingga saya juga bisa belajar lebih banyak.

Salam Deepak Bajaj

9
Deepak Bajaj

Banyak aplikasi telah bergeser untuk menggunakan gaya yang berbeda untuk tombol OK vs Batal. Satu UI yang umum adalah memiliki tombol OK tetapi tombol tradisional sedangkan Cancel adalah tombol tautan. Ini memberikan perbedaan visual yang sangat jelas antara keduanya dan meskipun itu mengarahkan pengguna untuk mengklik OK, perbedaan visual akhirnya menyoroti perbedaan dan membantu pengguna memilih yang mereka inginkan.

Saya pernah melihatnya di aplikasi web dan desktop.

7
Sam

Hanya untuk memperjelas alasannya:

Ini dianggap "lebih benar" untuk menempatkan tombol utama (OK) di sudut yang tepat dari dialog, karena lebih mudah untuk menekan (ada beberapa pertanyaan/diskusi sebelumnya tentang ini).

Namun, itu juga tergantung pada apa yang biasa dilakukan pengguna - jika Anda membuat situs atau aplikasi untuk pengguna Windows, Anda sebaiknya mengikuti standar Windows.

Pastikan "Enter" pada keyboard dikaitkan dengan benar dengan OK - banyak orang akan menggunakannya juga.

5
Dan Barak

Wow! Begitu banyak jawaban yang berdebat kiri atau kanan.

Saya menjalankan tes ini sendiri dan ternyata secara statistik tidak meyakinkan.

Jawaban terbaik yang saya temukan adalah tidak masalah urutan mana yang mereka lakukan asalkan tindakan utama ditandai dengan jelas - saya selalu menggunakan tombol berwarna-warni untuk [Lakukan]/pergi/kirim/dll dan hanya teks yang lebih kecil saja untuk [Don't do it]/cancel/clear/etc.

Sangat mirip dengan tombol 'Posting Jawaban Anda' dan 'buang' di bagian bawah formulir jawaban di sini di UX StackExchange!

4
Andrew Martin

Anda dapat menemukan pendapat yang menarik di sini ; Anthony T. menyarankan bahwa menempatkan tombol "OK" di sebelah kanan "Batal" lebih baik:

Dengan tombol ‘Oke’ di sebelah kanan, fiksasi visual kurang dan mengalir dalam satu arah [...]

Bandingkan dengan tindakan utama yang ditempatkan di sebelah kanan kotak dialog dan tindakan sekunder ditempatkan di sebelah kiri. Pengguna mulai dengan mata mereka pada tindakan sekunder, dan gerakkan mata mereka ke tindakan utama untuk mengklik tombol. Ini menciptakan total dua fiksasi visual dalam satu arah, memberi pengguna aliran visual yang lebih cepat. Pengguna memperbaiki setiap tombol hanya sekali dan berakhir pada tombol tindakan utama. Menempatkan tindakan utama ke kiri mungkin membuat pengguna lebih mudah dijangkau, tetapi ketika Anda melihat kecepatan dalam hal proses mental dan perbaikan visual pengguna, menempatkan tindakan utama di sebelah kanan kotak dialog sebenarnya lebih cepat.

4

Untuk aplikasi web ASP.NET, setelah mengambil banyak aspirin untuk menangani masalah tombol default (apa pun yang akan menyala ketika tombol Enter ditekan), saya tinggal meletakkan tombol default saya di sebelah kiri sehingga yang pertama ada di markup.

Browser yang berbeda akan menangani beberapa tombol pengiriman berbeda ketika tombol Enter ditekan (terutama ketika kursor berada di dalam kotak teks pada saat Enter tekan). Beberapa browser hanya akan menggunakan tombol pertama di markup untuk mengirimkan formulir, yang mungkin bukan yang Anda inginkan (terutama jika Anda perlu melakukan sesuatu di sisi server sesudahnya).

Jika Anda tidak menggunakan javascript khusus untuk menangani skenario tombol default, dan mengandalkan perilaku default peramban web, maka Anda mungkin harus meletakkan tombol default di sebelah kiri.

4
Adam Toth

Jika memungkinkan, saya akan menyarankan menghilangkan tombol batal sama sekali, sehingga menyelesaikan dilema Anda. - Kadang tidak perlu, dan sering diaktifkan secara tidak sengaja.

Dari http://www.nngroup.com/articles/reset-and-cancel-buttons/ :

Sebagian besar formulir Web akan meningkatkan kegunaan jika tombol Reset dihapus. Tombol batal juga seringkali bernilai kecil di Web.

Tawarkan tombol Batal ketika pengguna mungkin takut bahwa mereka telah melakukan sesuatu yang ingin mereka hindari. Memiliki cara eksplisit untuk Membatalkan memberikan perasaan aman tambahan yang tidak diberikan hanya dengan pergi.

Cancel sangat berguna untuk dialog multi-langkah di mana pengguna telah maju melewati satu halaman atau lebih dengan tindakan. Pada saat ini, menekan tombol Kembali tidak akan membatalkan tindakan ini dan akan lebih baik jika pengguna mengklik Batal.

4
Adam George

Pada akhirnya (terutama setelah membaca semua balasan di atas) saya melihat diskusi ini bermuara pada konvensi platform vs kegunaan 'objektif'. Yang saya maksud dengan 'objektif' adalah bagaimana sesuatu yang dapat digunakan bagi pengguna yang tidak terbiasa dengan konvensi OS. Lebih spesifik:

OK di sebelah kanan
Pola ini sangat mudah digunakan dalam argumen kegunaan obyektif JIKA pengguna tidak dikondisikan ke konvensi windows yang kurang bermanfaat (lihat artikel ). Saat artikel ini membahas, memiliki OK di kanan sejajar dengan konvensi membaca kiri-ke-kanan kami, alur tugas yang lebih efisien, adalah target sudut yang lebih baik, juga fakta bahwa kami menganggap garis waktu berjalan dari kiri ke kanan (karenanya 'kembali'/'batal' di sebelah kanan masuk akal melihat karena itu adalah pola waktu kembali).

OK di sebelah kiri
Konvensi Windows

Ini adalah kenyataan yang tidak menguntungkan, tetapi pola yang dirancang dengan buruk (seperti OK di sebelah kiri) dapat menjadi sebuah konvensi dan pengguna akan datang untuk mengharapkannya. Mencoba melakukan sesuatu yang lain, meskipun secara objektif itu adalah pola yang lebih bermanfaat, akan menghasilkan kegunaan yang buruk. Contoh klasik adalah sistem pengukuran metrik vs imperial - sistem metrik memiliki segalanya untuk itu dalam hal kegunaan, kemudahan konversi unit, dll; tetapi jika Anda memaksa orang Amerika kota kecil untuk berpikir dalam meter dan sentimeter ketika mereka terbiasa dengan inci/kaki Anda akan mendapatkan kegunaan yang buruk dan pengguna yang sangat frustrasi. Saya kira pelajarannya adalah bekerja sangat keras untuk memastikan kami tidak pernah memperkenalkan konvensi yang buruk!

Secara pribadi ketika merancang untuk web saya memilih untuk meletakkan tombol OK di sebelah kiri, saya juga bersikeras menyatakan tinggi badan saya dalam sentimeter dan berat saya dalam kilogram, bahkan ketika berbicara dengan orang-orang yang berpikiran kekaisaran. Ini benar-benar perang gesekan, tetapi perlahan sistem kekaisaran akan mati, dan semoga konvensi windows 'OK di sebelah kiri' juga :)

3
M.A.X

Saya akan pergi dengan "Ok" di sebelah kanan. Karena arah membaca barat yang bergerak dari kiri ke kanan. Dan "Batalkan" tidak akan membuat Anda unggul, tetapi "Oke" akan.

Tetapi pendekatan yang sama sekali berbeda. Jangan gunakan "Oke" dan tulis pada tombol apa yang mereka lakukan. Misalnya "Simpan" atau "Jangan Simpan" tidak mengharuskan pengguna membaca teks deskripsi. Menghemat waktu dan mencegah kesalahan input.

2
erikrojo

Lol Saya tidak bisa menahan tawa dengan banyak jawaban ini. Sepertinya kasus tidak melihat hutan untuk pohon-pohon. Seperti setiap masalah UX pada dasarnya itu tergantung pada bagaimana formulir diletakkan. Misalnya, Beri label di atas, bidang di bawah, atau label di sebelah kiri. Lihatlah seluruh halaman dan bagaimana mata pengguna mengalir ke bawah formulir. Apakah ada garis pandang yang jelas ke tombol 'Kirim' akhir?

Seperti yang dinyatakan dalam posting sebelumnya buku Luke Wroblewski tentang formulir web Desain Formulir Web: Mengisi Kosong berisi beberapa saran terbaik dalam pembuatan formulir web serta paradigma besar formulir dari perspektif pengguna - Bentuk adalah sarana untuk mencapai tujuan dan ditoleransi karena hasil akhir yang dimaksudkan (yaitu membeli sesuatu, membuat akun untuk mendapatkan akses ke suatu tempat, dll). Tes pengguna, tes AB ya tentu saja jika Anda bisa. Tujuan akhir menjadi semakin mudah formulir Anda adalah mengisi yang lebih baik.

2
mike

Saya sangat suka beberapa situs di mana tidak ada tombol (secara visual) untuk tindakan negatif, hanya tautan. Dengan cara ini saya tidak perlu membuang waktu untuk melihat tombol, saya lebih-kurang tahu bahwa tombol itu. Dan jika saya tahu saya tidak ingin melakukan apa yang halaman ingin saya lakukan, saya meluangkan waktu untuk melihat bagaimana itu akan menjadi yang terbaik untuk melanjutkan (mencari tombol tutup, tombol batal)

jadi alih-alih:

[Tidaaaak!] [KLIK AKU! KLIK AKU!]

akan ada:

Tidak terima kasih! [Ya, kumohon!]

Dengan cara ini tidak ada yang benar-benar penting di mana Anda memposisikan tombol Anda, hanya ada satu dan karenanya mudah ditemukan.

1
fallenboy

Di aplikasi saya, saya menggunakan warna visual untuk menyorot tujuan tombol aksi. Maka tidak masalah apakah itu kiri atau kanan. Saya pribadi lebih suka memiliki tombol "ok" di sebelah kanan (karena saya pengguna kidal dan/atau osx - dan sebenarnya ini adalah tautan ..)

  • tombol hijau besar untuk validasi
  • tombol merah besar untuk dihapus
  • (besar atau tidak) tombol abu-abu untuk membatalkan
1
Marc D

Bagi saya ini adalah urutan logis:

<LeftRight>

<PreviousNext>

<BackForward>

<BackDone

Do nothingDo it

CancelOK

Kecuali OK, harus diganti dengan tindakan aktual seperti SaveDeleteAcceptExit atau Send.

Ketika saya bertemu orang-orang yang berdebat untuk menempatkan OK di sebelah kiri, saya selalu meminta mereka untuk menempatkan Left vs. RightPrevious vs. Next, dan Back vs. Forward, dan biarkan mereka berdebat mengapa mereka mengaturnya, sebelum membiarkan mereka berdebat mengapa OK harus di sebelah kiri.

1
Ole Tange

Dalam urutan prioritas, gunakan solusi pertama yang tersedia:

  • pedoman platform
  • awal hingga akhir (di mana permulaan untuk bahasa barat biasanya dibiarkan, namun dapat berbeda, mis. bahasa Arab mulai dari kanan dan ujung kiri)
  • cara yang paling diharapkan pengguna Anda

Namun dalam kasus pembaca layar dan alat Aksesibilitas yang serupa, memiliki tindakan utama di awal (dibiarkan dalam budaya barat) dapat menghemat banyak pengguna kebutuhan khusus seperti itu banyak waktu!

1
straya

Tentu saja ada banyak argumen untuk dan melawan kedua belah pihak.

Saya akan mengatakannya demikian. "Apakah Anda percaya bahwa penempatan negatif-positif adalah yang terbaik? Tidak atau Ya?"

Intinya adalah bahwa "Ya atau Tidak" mengalir lebih baik ketika diucapkan, yang kemungkinan menjelaskan mengapa urutan tombol positif-negatif dipilih oleh Microsoft.

Di sisi lain, aliran negatif-positif sering digunakan dalam retorika dan debat untuk menambah bobot argumen positif dan membuatnya tetap segar dalam pikiran seseorang. "Apakah kamu ingin melihat anak-anakmu menderita di tangan pihak lawan? Atau apakah kamu ingin memilih partai kami dan mengamankan masa depanmu?" Dan seterusnya.

0
Seth Jeffery

Dengan asumsi bahwa keputusan perlu dibuat apakah tindakan positif harus tersedia di sebelah kiri atau di kanan dan mengabaikan bias menggunakan sistem operasi tertentu atau peralatan fisik (buku), konstruksi abstrak (aliran bentuk penyihir) dll, ilmu perilaku tampaknya menyarankan bahwa opsi paling kiri secara statistik dipilih lebih sering sebagai pilihan pertama.

Ini menyiratkan bahwa menempatkan tindakan positif (OK atau label tindakan eksplisit) di sebelah kiri harus dipilih jika tidak ada faktor lain yang dipertimbangkan.

Sumber: Apakah hanya manusia yang dihitung dari kiri ke kanan?

0
too