web-dev-qa-db-ja.com

フォーム内の前/次のボタンのタブ順序

各ページの下部に2つのボタン(前へと次へ)があるマルチステップフォームがあります。 [前へ]ボタンは左下にあり、[次へ]ボタンは右下にあります。

これら2つのボタンのタブ順序はどうあるべきですか?ユーザーにとっての主要な旅は、各ページのフォームフィールドに入力してから、[次へ]ボタンを押すことです。フォームの前のステップに戻るために[戻る]ボタンを使用するユーザーは少なくなります。

タブの順序を[次へ]ボタン、次に[前へ]ボタンにする必要があります-視覚的に左から右へ、[前へ]ボタンは[次へ]ボタンの前に来ますか?

7
Mick B

通常は、使用している言語の読み方向に従うタブオーダーが必要です。したがって、これが英語であると仮定すると、「ルール」は、最初に前に、次に次にすることになります。

ただし、オーバーライドするルールがあります理にかなった場合はルールを破る必要があります

これは、「ルール」に従わない場合の良い例です。通常のフローは次、次、次などになります。そのため、そのフローを設計し、タブオーダーで '前へ'の前に '次へ'があります

3
JohnGB

興味深いのは、Windowsプラットフォームでは、Vista以降、ウィザードが[戻る]ボタンをダイアログの左上に移動したことです。あなたは本当にそれを見つけるためにそれを探す必要があります。これで、戻るボタンがメインフローから外れます。

Wizard on windows Vista

よりクラシックなXPスタイルのウィザードとMac OSでそれを比較してください:

Wizard on windows XPWizard on mac os

ここで、[前へ]ボタンは確かに他のボタンと同じフローにあり、[次へ]ボタンの前に配置されています(これもタブ順です)。そのため、あなたが気づいた問題は、Windows Aeroガラススタイルの設計者から注目を集めています。彼らの解決策は戻るボタンを見つけるのを難しくしていると思いますが、それはあなたの問題を非常に効果的に処理します。ダイアログ下部のメインボタンからボタンを削除して使いやすくします(ただし、OS-Xのようにヘルプボタンを邪魔にならないように移動するなど、さらに改善できると思います)。

2
André