文字キーのショートカット
Silktide は、ページ全体(document、window、または <body>/<html>)にキーボードリスナーを登録しているページを検出し、1 文字のショートカットに解除方法が必要かどうかを確認するよう求めます。
よくある例としては、j を押して下にスクロールする、/ を押して検索にフォーカスする、g に続けて h を押してホームに移動する、といった操作があります。
これは です。グローバルキーリスナーがあれば確認する実質的な理由になりますが、登録されているという事実だけでは、ハンドラーが 1 文字のショートカットを実装しているかどうかを Silktide が判断することはできません。グローバルキーリスナーがないページにはフラグが付けられません。
重要な理由
常時有効な 1 キーショートカットによって、次の 2 つのグループが大きな影響を受けます。
- 音声入力を利用する人は、テキストやコマンドを声に出して入力します。ソフトウェアは音声をキーストロークに変換するため、通常の文章が意図しないショートカットの連続起動になり、ページが移動したり、ダイアログが開いたり、文章の途中で操作が実行されたりする可能性があります。
- 手先が不自由な人や震えのある人は、意図していないキーを日常的に押してしまうため、どの 1 つのキーでも実行のトリガーになる可能性があります。
そのため、 達成基準 2.1.4(レベル A)では、1 文字のショートカットをオフにする、Ctrl や Alt などの修飾キーを含むように再割り当てする、または該当するコントロールに がある場合にのみ実行することを求めています。
修正方法
1 文字のショートカットを実装しているグローバルキーボードハンドラーごとに、次のいずれかを行います。
- ショートカットをオフにする設定を提供します。
- 修飾キーを必須にします。たとえば、ショートカットを
kではなくCtrl+Kにします。 - 該当するコントロールにフォーカスがある間だけキーを処理します。フォーカスされたコントロールに限定されたショートカットは明示的に許可されています。
// ページ上のどこで「k」が押されても実行される
document.addEventListener('keydown', (e) => {
if (e.key === 'k') openSearch();
});
// 修正済み: Ctrl(または Cmd)を押しながらの場合にのみ実行される
document.addEventListener('keydown', (e) => {
if (e.key === 'k' && (e.ctrlKey || e.metaKey)) openSearch();
});
フラグが付いたリスナーに 1 文字のショートカットがない場合、またはこれらの解除方法のいずれかがすでに提供されている場合は、検出結果を してください。
Silktide のテスト方法
- ページがブラウザーに登録するキーボードの を収集します。
- ページ全体に適用されるリスナー(document、window、または
<body>/<html>要素にアタッチされたリスナー)のみを残します。個々のコントロールに設定されたリスナーは、そのコントロールにフォーカスがある間だけ実行されるため対象外です。 - 残りの各リスナーを報告し、確認を求めます。Silktide はハンドラーのソースから
e.key === '…'のパターンを抽出しません。ミニファイされたコードやフレームワークのコードに対して脆弱すぎるためです。グローバルキーリスナーの存在がシグナルであり、判定はあなたの確認に委ねられます。
トラブルシューティング
リスナーが 1 文字のショートカットではない
多くのグローバルキーハンドラーは、Escape、矢印キー、または修飾キーとの組み合わせだけを監視します。1 文字のショートカットがない場合は、検出結果を承認してください。
ショートカットをすでに無効化または再割り当てできる
Silktide はリスナーの登録を確認できますが、サイトに設定の切り替えが用意されているかどうかは確認できません。そのような設定がある場合、ページは準拠しています。検出結果を承認してください。
サードパーティー製スクリプトのショートカット
チャットウィジェット、動画プレーヤー、アナリティクスツールが独自のグローバルキーリスナーを登録することがあります。これらも同様にページに対する影響として数えられるため、ベンダーのアクセシビリティ設定を確認するか、ベンダーに対応を依頼してください。
accesskey 属性で作成されたショートカット
これらは Accesskey attribute チェックで別途扱われます。このチェックでは、スクリプトで実装されたショートカットを扱います。