削除、キャンセル、送信する場合、どこに削除ボタンを配置しますか？

Question

現在、次のインターフェイスを使用するWebアプリがあります。

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

アクションは次のとおりです。

• 削除すると、このグループが削除され、ユーザーがすべてのグループのリストにリダイレクトされます。削除する前に、モーダルは削除するかどうかを確認します。

• グループに加えられた変更を保存して送信します。

• キャンセルは、ユーザーが行った変更を破棄できるようにします。これは、アプリケーションがマルチタスクを許可しているためです。ユーザーが変更を加えて別の場所に移動すると、ページは、変更が保存されていない画面を含むペインに追加されます。

グループの削除ボタンはグループを削除し、アイコン付きのリンクとしてスタイル設定されます。それがグループの削除ボタンの正しい場所かどうかはわかりません。 1つの代替案は、次のようにすることです。

^{bmmlソースをダウンロード}

たとえば、次の2つのアクションを持つフォームを見たことがあります。

^{bmmlソースをダウンロード}

または：

^{bmmlソースをダウンロード}

Delete this groupは明確に区別する必要があり、ユーザーが誤ってクリックしたくないものではないことに留意して、これら3つのアイコンの配置をどのように処理すればよいですか？

---

更新：

ボタンの配置について、私は以下に従います Luke Wroblewskiの推奨事項 Webフォームのアイトラッキング調査から（基本的に、最適な配置は、左側のアクションと左側のアクションを揃えることです）。私は、モーダルや対話においては、適切に調整された行動がより適切であると信じています。

ただし、Facebookは主要なアクションを右側に配置します。 

編集ページで削除アクションを実行する理由については、特にユーザーがgroupの内容を見た後に役に立たないと判断した場合は、まだ非常に便利だと思います。 Wordpressには、編集ページにも同様の機能があります。 

右上に削除ボタンを配置する最初の根拠に触れなかったことをお詫び申し上げます。

• フォームフィールドが多数あり、ページがスクロールする場合、Delete this groupボタンが存在することをユーザーが一目で簡単に確認できます（ページを探し回るのではなく）。これは、他のアクションと一緒に底に置くアウトウェイトにメリットがありますか？

Answer 1

{削除-削除}とは別に{送信-キャンセル}ボタンを配置することとは別に、削除は元に戻せないアクションであり、ユーザーがクリックしたときにユーザーに本当に確信してもらいたい場合。下部に3つのボタンをインラインで配置すると、ユーザーが現在のウィンドウのすべてのオプションを見つけることができる場所がより明確になります。ダイアログボックスで{Do n't Save ---- Cancel-Save}パターンを使用するプログラムはたくさんあります。 これを確認してください。

また、「送信」を右端のアイテムとして配置し、それを右に揃える必要があります。詳細については article を参照してください。 {削除----キャンセル-送信}

Answer 2

個人的には、私は主な前向きな行動を右下に置きました-したがって、プロセスの中で、「次へ」と「提出」はここに行きます。 [キャンセル]は[送信]の左側にリンクとして表示されます。これは主要なアクションではないため、注意を払う必要はありません。 「削除」はキャンセルの左側に表示されますが、間隔が広くなります。また、ユーザーが情報に基づいた選択を行えるように、onClick確認メッセージボックスも表示します。

Answer 3

特にフォームのスクロールが必要な場合は、右下にすべてのアクション「ボタン」を配置して、ユーザーの論理ワークフローに従うようにすることをお勧めします。この場合の問題は、ユーザーが問題のページに入る前にグループを削除したいことを知っている可能性があるため、長いフォームの下部までスクロールさせると、けがをする恐れがあります。

私が成功に使用したパターンは、編集するグループ（質問で表示されているものの前）とその内部を選択するページに削除オプションを提供します。ユーザーがカテゴリを削除したい場合、ほとんどの場合、詳細ページに移動して決定を行う必要がないため、オプションをより早く提供します。これにより、グループの詳細ページの削除オプションがセカンダリに格下げされ、他のアクションと一緒に右下隅に配置することが理にかなっています。

Answer 4

右下の削除リンクを使用して、以前に説明した状況を確認しました。それが私が好む方法であり、他のアクションとグループ化されています。ユーザーは送信ボタンに集中するので、それはそこに重みが少ないと思います。

削除の確認が得られました。これは良いことです。そのアクションにさらに注意を向けたくない場合は、Xアイコンを削除する場合があります。

すべてのグループを含む画面の表示に応じて、削除機能をそのページに移動することを検討し、ここにはリストしないでください。おそらく好ましい選択肢ではないでしょうが、私はそれをそこに通して考えたと思いました。