web-dev-qa-db-ja.com

「OK」ボタンを押すと、「キャンセル」がセカンダリボタンまたはリンクとして表示されますか?

Webアプリケーションのデザインを作成するとき、フォームまたはオーバーレイボックスを[OK]ボタンと[キャンセル]ボタンでスタイルするたびに。違うと思います。しかし、それは良い習慣でしょうか?

一部の人はプライマリボタンとセカンダリボタンを推奨していますが、セカンダリボタンのステータスを設定するのに「キャンセル」がそれほど重要ではないと思います。アプリケーションに十分なセカンダリボタンがない場合はどうなりますか? 「キャンセル」専用の副ボタンを作成して使用したくありません。

16
Rishi

キャンセルオプションをボタンではなくリンクにしてください。クリックするボタンを確認するのがとても簡単になります。これを見てください AgileZen login 、どのオプションがデフォルトであるかは明らかです:

enter image description here

27

私はこれまでのところストリームに少し反対し、コンテキストに依存すると主張します。大多数のユーザーが[OK]をクリックしたい場合(そしてあなたが[OK]をクリックして欲しい!)リンク。ただし、[OK]と[キャンセル]の両方が同じ確率のパスを表す場合は、[キャンセル]をボタンにします。ゲシュタルトの法則:同じように見えるものは、同じ重要性/概念/何でも持って一緒に属していると認識されます。この推論により、同等の可能性のあるパスに直面すると、ユーザーは「一緒に属する」ものを探します。 「キャンセル」をリンクにすると、それは例外的なケースのように見え、ユーザーに複雑さの層を追加します。

ボタンとリンクの詳細については、Jakob Nielsenは次のように言っています: http://www.useit.com/alertbox/command-links.html

8
Erion

リンクをキャンセルできる場合は、そうすることをお勧めします。プライマリボタンとセカンダリボタンの問題は、これが理解する必要のある別のリンクスタイルであることです。リンクには、人々が操作する方法を知っている接続がすでに与えられているため、新しいボタンよりも認知的負荷が少なくて済みます。

別のスタイルのボタンがある場合、人々はこれを見て、それが何を意味するのかを解釈し、なぜそれが異なるのかを解釈する必要があります。それは避けた方がいい(Steve Krug-考えさせないで!)

3

すでに述べたように、キャンセルボタンのリンクを使用してください。ただし、他のアクションには「OK」を使用しないでください。それをより説明的にして、あなたが尋ねている質問に適用してください。

例えば:

このファイルを保存しますか? 保存 |キャンセル

保存しなくてもよろしいですか? 保存しないでください |キャンセル

ボタン自体を明確にすることで、人々がスキャンしやすくなり、使いやすくなります。

2
JohnGB

タッチデバイスやマウス駆動のデバイスの場合も重要です。ボタンはタッチデバイスで少し使いやすくなっています。 Webサイトでは、Wordリンクは問題なく機能し、第2のオプションの低いプロファイルを確実にサポートできます。

どちらかのタイプのデバイス用のボタンを選択した場合、カラーバリエーションは、最も望ましいオプションを使用するためのクリックをサポートできます。最近モバイルデバイスのUXの調査から学んだように、MACユーザーは[OK]ボタン(または該当する場合は目的のパス)が右側にあると予想し、PCユーザーは左側にあると予想します。

一般に、最初に正しい質問をしていることを確認することは、問題の解決に大きな助けになります。次に、相対的/説明的なボタンがあると、実際に成功率が上がります。

そうは言っても、私は二次オプションにテキストリンクを使用するためのものです。

1
aomedia

「キャンセル」を表すために使用するオブジェクト(ボタンでもリンクでも)は開発上の考慮事項であり、部分的には関係ありません。ボタンをリンクのように見せたり、その逆を行うことができます。しかし、私はあなたの質問を過度に分析しているかもしれません-私はあなたが何を得ているか知っています。

これを見ると、プライマリアクションとセカンダリアクションの間に明らかな視覚的な違いがあることを確認することが重要であることがわかりました。主な行動を強調することが明らかに優先事項です。私がこれまで取り組んだ中で最大のアプリケーションでは、2番目のアクションはすべてボタンですが、1番目のアクションよりも邪魔にならないスタイルです。

0
Sam K