web-dev-qa-db-ja.com

確認ダイアログボックスの[はい/いいえ]ボタンの配置

ダイアログボックスの[はい]/[いいえ]ボタンの配置や確認メッセージにさまざまな見方をしてきました。長い間、ほとんどの場合、「はい」オプションが「いいえ」オプションの左側にあることに気付いていたようです。

ただし、「はい」オプションの左側に拒否/「いいえ」オプションを配置するという最近の傾向があるようです。 Googleのマテリアルデザインの仕様も これについて言及 ですが、理由は説明されていません(少なくとも私はそれを見つけることができませんでした)。

UXの観点から、ダイアログボックスの[はい]/[いいえ]ボタンが相互に関係する場所に関して正しい答えはありますか?

3
mindontheblink

本当に素晴らしい質問です!

問題は[はい]または[いいえ]にありません。ただし、アクションが正または負の場合。

例えば、

  1. 「System32を完全に削除してもよろしいですか?」

    • はい

    • 番号

  2. 「この写真をバックアップしてもよろしいですか?」

    • はい
    • 番号

ここでわかるように、優れたデザインの原則に違反しています。ウェブサイト/アプリのUIで「はい」または「いいえ」を指定した場合、それを再利用する可能性があります。これが問題のほとんどを引き起こします。

イベントが破壊的であるかどうかに関係なく、ユーザーは「はい」と「いいえ」で混乱し、読むことなくランダムにクリックする可能性があります。

優れた設計者は、実行するアクションで提供するオプションを正確にしようとします。

例えば、

  1. 「System32を完全に削除してもよろしいですか?」

    • フォルダーの削除(赤いテキスト)

    • キャンセル(アクセントカラー)

  2. 「この写真をバックアップしてもよろしいですか?」

    • Googleドライブにバックアップ(緑色のテキスト)
    • キャンセル(アクセントカラー)

テキストの色は完全にオプションです。しかし、色心理学の一般的なルールは、緑はポジティブで赤はネガティブであることを私たち全員が理解していることを示唆しています。

ここでオプションを配置しますが、具体的であり、オプション自体に何をするかを述べている場合、配置は問題になりません。

しかし、私は個人的には右へのポジティブな行動と左へのネガティブな行動が好きです。

6
Swapnil Borkar

これをフォローアップするために、このトピックについて議論している記事がインターネットに殺到していることに気づきました。これを投稿して、さまざまなテイクを得るためにここでディスカッションを開始しました。

一般的なコンセンサスは、それがアプリケーションで一貫している限り、どちらも機能するはずであり、両方について議論があるということです。特定のプラットフォーム(Microsoft、Google、Appleなど)向けに開発している場合は、それぞれの設計仕様に従うことが最善です。特にプラットフォーム向けに開発していない場合でも、ユーザーテストが決定の鍵となるようです。

その後、UX stackexchangeに関する他の記事を見つけたので、先に進んでこれに回答済みのマークを付けます。これが私が最も役に立ったと思うものです:

OK /左/右でキャンセルしますか?

ここに別の興味深い読みがあります:

http://www.nngroup.com/articles/ok-cancel-or-cancel-ok/

0
mindontheblink