web-dev-qa-db-ja.com

複数のタブがあるフォームを介したキーボードナビゲーション

混乱を避けるために、私はタブキーのことではなく、タブをクリックするかCtrl + PageUp/Downを押すことで選択できる上部にタブがあるフォームについて話しています。後者は普遍的ではありませんが、私が採用した一般的な慣習のようです。

私の質問は、ユーザーがそのレイアウトでフォームをデータキャプチャし、すべての操作にキーボードを使用することを好むことに関するものです。

ユーザーが最初のタブの最後のフィールドに入力したら、2番目のタブに移動してキャプチャを続行します。これを実現する方法はいろいろ考えられますが、どれも満足できるものはありません。

  1. 最後のフィールドでタブキーを押すと、自動的に次のタブが開きます。私はこれを実験しましたが、それはかなりうまくいきます。直感的かどうかわかりません。また、タブキーを押すとフォームの次のセクション（通常は1つまたは複数のボタン）に移動するフォームも見ました。これは標準ですか？

  2. 最後のフィールドでタブキーを押すと、フォームの「次のタブ」ボタンに制御を渡すことができます。その時点で、ユーザーはボタンを押して次のタブを開くか、もう一度タブキーを押して次のセクションに移動できます。同様に、「前のタブ」ボタンを使用して、Shift + Tabを使用して後方にナビゲートするユーザーに対応できます。私はこれを実験しましたが、それはかなりうまくいきますが、新しいユーザーはそれを混乱させるかもしれません。

  3. 最後のフィールドでタブキーを押す代わりに、ユーザーはCtrl + PageDownを押すことができます。これは現時点では実際に機能しますが、使用できる唯一の方法であるとは思いません。

  4. 各タブに下線付きのホットキーがあり、Alt +ホットキーを押すとタブを選択できるようになります。ランダムなタブを選択するのに適していますが、スムーズなデータキャプチャエクスペリエンスには適していません。

私の好みは最初のオプションです。それは実際にはかなり自然な感じです。フォームの「次のセクション」には、「保存」ボタンと「キャンセル」ボタンしか含まれていない場合が90％あります。前者はEnterキーを押して呼び出すことができ、後者はEscapeキーを押して呼び出すことができるため、最初にタブに移動する必要はありません。

これには標準的な規則がありますか、それとも他の提案がありますか？

formstabskeyboard
4
Frank Millman

オプション2を使用しますが、「次のタブ」ボタンを呼び出す代わりに、「セクションFooに進んでバーに関する情報の入力を続行します」（およびテキストが長いため、ボタンの代わりにクリック可能なハイパーリンクを検討する） ）。同様に、[前のタブ]ボタンは、「セクションFooに戻って、バーに関する情報を編集する」と言うことができます。

例として、すべての情報がカテゴリ/サブフォームに分割され、ウィザードのようなページ付けされたエクスペリエンスを提供するため、税務ソフトウェア（特にTaxActを具体的に考えています）がこの問題/パターンに遭遇すると思います。

あなたの主な質問とは無関係ですが、この場合は左側の垂直タブを検討します。 Example vertical tabs

（- http://bobcravens.com/2010/09/simple-vertical-tabs/ から）

1
J. Dimeo

Tabを使用してタブキーを押し、tabsを使用してUI要素を表します

ここでは、ユーザーとの対話のさまざまなケースがあります。

  1. タブを順番にジャンプする
  2. 順不同でタブをジャンプする
  3. 次のタブでのステータスの可視性

すべてのフォームの下部に[次へ]ボタンがあると、画面の次のステータスがわかります。

ただし、インタラクションがキーボード指向の場合で、Tabキーを押して次の画面に移動すると、フォームの上部に[戻る]ボタンがあり、ユーザーがすぐに戻るのが簡単になります。それ以外の場合は、[戻る]ボタンを見つけるために最後までTabキーを押す必要があります。

ユーザーが非順次的な方法でタブ間を移動できる場合は、Alt + Keyインタラクションがあると便利です

ステータスを表示するには、[次へ]ボタンだけではなく、タブの名前を記載することをお勧めします。

例：

Prev: Personal Info

フォームフィールド

Next: Official Info

0
Gautham Raja