LEARN BY EXAMPLE

2.1.4 文字キーのショートカット レベル A

文字だけのショートカットを意図せず動かさないようにする。

概要

文字・句読点・数字・記号だけを使うショートカットには、誤作動を防ぐ手段を用意します。解除できる、Ctrlなど文字を入力しないキーを含む操作へ再割当てできる、対象の部品にフォーカスがあるときだけ働く、のいずれかを満たします。

yキーが意図しない場所で働かないか

利用者が困る例 ページ全体で文字キーが働く

読んでいたメールが移動してしまう。
音声から送られたyで保管されます。解除や再割当ての設定もありません。「利用者が困る例」は操作できない静止図です。

改善した例 対象ボタンにフォーカスがある間だけ働く

ウェブメール

写真教室のご案内

来週の教室は午前10時からです。

「Hey Kim」と入力しても、メールは保管されません。

保管ボタンへ移動してから操作できる。
ほかの場所で入力したyは保管の操作として働きません。

図:同じメールで文字ショートカットが働く範囲を比較。「改善した例」の「メールを保管」へTabで移動し、y、Enter、Spaceのいずれかで操作できます。「受信トレイに戻す」で繰り返し試せます。返信欄に送信機能はありません。

達成できないと起こる問題の例

音声入力を使う人がウェブメールでメッセージを確認しています。このウェブメールにはページ内のどこでもyキーだけでメールを保管するショートカットがあり、解除や再割当ての設定はありません。

一部の音声入力ソフトは発話を文字キーの操作に変換します。同僚の「Hey Kim」という声が入力されると、その中のyにショートカットが反応し、読んでいたメールが保管されてしまいます。手が動かしにくく、意図せず文字キーを押してしまう人にも同じ問題が起こります。

達成するための改善例

同じメールで、yキーのショートカットは「メールを保管」ボタンにフォーカスがあるときだけ働くようにします。フォーカスとはキーボードで操作する位置のことです。返信の下書き欄など、ほかの部品にフォーカスがあるときの文字入力ではメールを保管しません。

利用者はメッセージを確認し、必要なときにボタンへ移動して保管できます。この例では、ボタンをEnterやSpaceで押しても同じ操作ができます。

確認のポイント

  • 文字・句読点・数字・記号だけのショートカットを実装していますか。大文字や連続した文字の入力も含めて確認していますか。
  • 対象のショートカットごとに、解除、非印字キーを含む操作への再割当て、対象部品にフォーカスがある間だけの有効化のいずれかを満たしていますか。
  • フォーカスで有効範囲を限る場合、対象部品から離れるとショートカットは働かなくなりますか。
  • 解除や再割当ての設定を、キーボードでも操作できますか。

条件と補足

対象になるショートカット

この基準はコンテンツ側に実装した文字だけのキーボードショートカットを扱います。文字には大文字・小文字、句読点、数字、記号を含みます。文字キーを1回押す操作だけでなく、Gに続けてAを押すなど、文字だけを順に入力する操作も対象です。

物理的なキーの数ではなく入力される文字で考えます。Shiftを押して大文字や「?」などの記号を入力する場合も、文字だけのショートカットに含まれます。キーボードの配列によって、同じ文字を入力するキーの組合せが変わる点にも注意します。

誤作動を防ぐ3つの方法

対象のショートカットは次のいずれかを満たします。3つすべてを用意する要件ではありません。

  • 解除する仕組みを利用できるようにします。
  • CtrlやAltなど、文字を入力しないキーを1つ以上含む操作へ、利用者が再割当てできるようにします。別の文字だけに変更する設定では、この方法を満たしません。
  • そのショートカットが操作する部品にフォーカスがあるときだけ有効にします。ページ内のどこかにフォーカスがあれば働く、という範囲ではありません。

このページの図は3つ目の方法を示します。リストボックス内で文字を押して項目を選ぶ操作も、そのリストボックスにフォーカスがある間だけ働くなら、この条件を満たします。

ほかのキーボード操作との関係

Ctrlなどの非印字キーを最初から含むショートカットは、この基準の対象になる文字だけの操作には当たりません。通常の入力欄に文字を入力する操作や、ボタンをEnterやSpaceで押す標準操作も、ここで扱う文字ショートカットとは区別します。

音声入力ソフトがすべて同じ動作をするわけではありません。現在の公式解説は文字キーの操作を送る一部のソフトやモードで誤作動が起こることを説明しています。

ショートカットを解除した後も通常のボタンで操作できるようにするのは、2.1.1「キーボード」なども含めて機能を利用できるようにするためです。この図は示したショートカットの例で、ページやサイト全体のWCAG適合を示すものではありません。

参照資料

テクニックは達成する方法の例です。特定のテクニックを採用することだけが必須ではありません。

出典の最終確認: 2026-11-09。図のメールはこの教材のために作った架空の例です。