3つの画面/ページに分割されたWebフォームがあります。ユーザーは、「次へ」および「前へ」というラベルの付いたボタンを使用して、画面間を前後に移動できます。
ユーザーが前へボタンを押すと、履歴の戻るボタンのように機能するか、 "移動するか前のページに移動して、履歴を転送します "?
2番目のシナリオを明確にするには:
前のボタンは履歴の戻るボタンのように機能するべきだと思います。しかし、私は確認を求めています。
[戻る]ボタンは[戻る]ボタンのように機能する必要はありません。 [戻る]ボタンは、「次に小さい番号のステップに移動する」ことを意味します。 [戻る]ボタンは、「この画面の前に表示されていた画面に移動する」ことを意味します。特定のコンテキストでは、それらは同じ効果または異なる効果を持つ場合があります。
したがって、ユーザーが取ることができる2つのパスがあります。
ステップ1 Next→ステップ2 Next→ステップ3 Previous→ステップ2 Back→ステップ3
ステップ1 Next→ステップ2 Next→ステップ3 Previous→ステップ2 Previous→ステップ1
これは、[次へ]ボタンと[前へ]ボタン、および[戻る]ボタンと[進む]ボタンが常に機能する方法です。本当に、本当に本当に正当な理由がない限り、それらを変更しないでください。
短い答え:前のボタンは履歴の戻るボタンとして機能しないはずです(用語を正しく理解している場合)。次と前は、ステップの数値シーケンスを上下にナビゲートする必要があります。
このようなシナリオでは、通常、システムがどのように機能するかについてのユーザーの期待に一貫性を維持するようにしてください。ウィザード内の一連の線形ステップの場合、ユーザーは、「次へ」ボタンがシーケンスの次のステップにナビゲートし、「前」ボタンがシーケンスの前のステップにナビゲートすることを期待するように誘導されます。ユーザーの開始場所に関係なく。
previous
ボタンがブラウザのback
ボタンと基本的に同じことをしているという考えを理解しました(ナビゲーションの観点からは理にかなっています)が、プログラミングの処理方法には注意してください側面:ページのフォームに入力してback
ボタンを押すと、ブラウザのデフォルトの動作は、残されたページで入力されたものをすべて破棄することです(たとえば、ページ3に記入し、ページ2にback
を押すと、ページ3のフォームデータが失われる可能性があります。もちろん、ナビゲーション機能の実装方法によって異なりますが、データの損失は、考えられるどのナビゲーション方式よりもUXへの影響が大きいと思います。
これを処理するいくつかの方法を想像できます。
フォームは実際にはすべて1つのページであり、javascript/cssを使用して、タブのようにさまざまなステップ(ページセクション)のオンとオフを切り替えることができ、最後にフォーム全体が一度にサーバーに送信されます。
サーバーは参照ページのレコードを保存します。previous
を押すと、実際にすでに入力されているデータが(一時的に)書き込まれるため、データが失われることはなく、ユーザーはフラストレーションなしにステップ間を行き来できます(ただし、実際のback
ボタンの動作はprevious
ボタンとは少し異なり、back
を押すとnot一時データが保存されます)。
ウィザードパターンを使用しないでください。個人的には、スクロールホイールを動かすだけで済む長い単一ページをナビゲート、理解、および使用する方がはるかに簡単だと思います(ただし、これには実際的な制限があるため、フォームの大きさはわかりません)。 1ページの垂直スクロールは、ユーザーが操作する最も簡単な方法であり、真剣に検討する必要があります。実際には、ユーザーはタッチして見なくてもセクションをナビゲートできますが、ボタン要素をクリックすると、細かいモーター制御と正確なカーソル移動とクリックが必要になります(誰でもできることですが、単にスクロールするより難しいです)。
最後に、検証はもう1つの考慮事項です。検証はクライアント側と各ステップで(ユーザーがnext
をクリックするたびに)発生しますか、それともサーバー側の最後にのみ発生しますか?長いフォームのすべてのステップをたどって、ステップ1で行った何かがずっと誤ってフォーマットされていることを発見しただけでは、私は苛立ちます。私は、今日の超高速JavaScriptエンジンの時代では、クライアント側に問題がある場合、すべてのフォームが即座にフィードバックを提供するはずです。