web-dev-qa-db-ja.com

詳細の編集フォームはモーダルダイアログ内にあるべきですか、それとも直接ページ上にあるべきですか?

ユーザーがログインしてアカウントページに登録できるサイトを構築しています。詳細の編集フォームを実装しています。私の質問は、何が最善かということです。フォームはページ内にあるのか、ポップアップボックス内にあるのでしょうか。 (fancyBoxライトボックスのように)ユーザーの詳細ページは次のとおりです。

enter image description here

ユーザーが[詳細の変更]をクリックすると、モーダルボックスにポップアップが表示されるのか、詳細が非表示になりフォームが表示されるのか(詳細がどこにあるのか)は、どのオプションが最適ですか。

11
Nathan

ここにいくつかのポイント:

  1. これをビュー/編集状態で複雑にしすぎないようにします。表示/編集の切り替えは、ユーザーがデータを編集するのではなく表示するだけの可能性が高い場合に適しています。ユーザーが自分のアカウントページにアクセスした場合、そのユーザーはやる気があり、パスワードまたは電子メールのいずれかに変更を加えたいと考えています。 Twitterがこのページを処理する方法は次のとおりです。 enter image description here

  2. Twitterのように、「アカウントの詳細」と「パスワードの変更」を組み合わせてみてください。彼らが行うすべてが完璧というわけではありませんが、彼らはアカウントページをかなりよく理解しています;-)

  3. これは余談ですが、「あなたの「いいね」」が重要な場合は、「アカウント」セクションから救ってください。コンテキストが何であるかはわかりませんが、「ようこそ、ネイサン」の横に「いいね」の数を横に並べることは意味があるかもしれません。つまり、「あなたの好きなもの(3)」。これにより、その機能とのエンゲージメントの数が大幅に増える可能性があります。

10
Matthew Moore

モーダルウィンドウを使用する理由は何ですか?

  • モーダルウィンドウでは、ユーザーの現在の対話プロセス/ワークフローを一時的に中断できます。
  • 続行する前に完全な注意が必要です。
  • 他の形式の入力(他のナビゲーションデバイスを介した入力など)を受け入れる前に、何らかの形式の直接応答が必要になります。

個人的には、モーダルウィンドウは必要ないと思います。

3
codeinthehole

モーダルボックスは、サーバーコールが少ないため、編集フォームを含む完全なページをプルするよりも、見た目が良く、読み込みが少し高速です。ただし、JavaScriptに依存しているため、ブラウザーやプラットフォーム間での互換性は低くなります(疑わしいのはIE7とモバイル)。インライン編集(Facebookと同じ)には同じ互換性の問題があります。

結局のところ、それはアプリケーション全体の一貫したルックアンドフィールに関するすべてです。すべての編集フォームは同じ方法で実行する必要があります。

検討する価値がある他のいくつかの事柄:

  • パスワード変更と残りのアカウント詳細を組み合わせる。
  • ボタンの名前変更Change detailsからEdit details
  • 最後のログインの詳細を1行に結合するか、IPアドレスを削除します(ほとんどの人にとってはほとんど価値がありません)。
  • すべてを編集できるように見えるかもしれないように、どの詳細が編集可能であるかを概要に示します。
1
dnbrv