コンテンツに移動
Silktideヘルプ

キーボード対応

Silktide は、マウスやタッチスクリーン(クリック、ホバー、ドラッグなど)に反応するものの、キーボードだけを使う人には機能しない可能性があるページの部分を見つけます。訪問者がマウスでできることは、すべてキーボードでもできるようにする必要があります。

重要な理由

多くの人はマウスやタッチスクリーンを使えません。たとえば、運動機能に障害のある人、震えのある人、そしてキーボードを使ってページを操作するを利用する視覚障害のある人などです。こうした人々にとって、ポインターにしか反応しない機能は利用できません。キーボード操作は の達成基準 2.1.1 であり、レベル A の要件、つまりこの標準の最も基本的な段階です。

修正方法

  1. 標準の 要素(リンク、ボタン、フォームコントロールなど)を優先して使用します。これらはデフォルトでキーボード操作に対応しています。
<!-- マウスでしか動作しない:フォーカスできず、ダブルクリックのみ -->
<div ondblclick="location.href='/new-page'">ダブルクリックしてください</div>

<!-- 修正後:誰でもリンクを利用できる -->
<a href="/new-page">ページに移動</a>
  1. カスタム操作が避けられない場合は、キーボードで同等の操作ができるようにします。要素をフォーカス可能にし(tabindex="0")、マウスイベントと併せてキーイベントも処理します。
  2. ツールチップやドロップダウンメニューなど、ホバー時のみ表示される操作には特に注意が必要です。ホバー時だけでなく、時にも表示します。
  3. 指摘された要素に、Silktide では確認できなかったキーボードでの代替操作がある場合は、指摘をします。

Silktide によるチェック方法

  1. ページがブラウザーに登録する を収集します。
  2. マウス専用およびタッチ専用のイベント(クリック、ダブルクリック、ホバー、マウスの移動、ホイール、コンテキストメニュー、タッチジェスチャー)だけを残します。
  3. 通常のクリックハンドラーについては、キーボードですでに操作できる要素(リンク、ボタン、フォームフィールド、tabindex によってフォーカス可能な要素など)を除外します。フォーカスした要素で Enter キーを押すと、そのクリックハンドラーが実行されるためです。
  4. キーボードによる代替操作が存在するかどうかを確認できるよう、残りの要素を報告します。

トラブルシューティング

要素に別の場所で利用できるキーボード操作がある

Silktide は、ポインター専用の動作を示唆するリスナーを持つ要素を指摘しますが、同じ機能を別の方法で利用できることを常に判別できるわけではありません。たとえば、フッターに同じリンクがあるホバーメニューや、ボタンで代替できるドラッグ操作などです。実際に代替操作が存在する場合は、指摘を承認します。

装飾目的だけのホバー効果

見た目だけを変えるリスナー(ホバー時のハイライトやアニメーションなど)は、キーボードユーザーから機能を奪うものではありません。こうしたものは安全に承認できます。

詳細情報

最終更新

このページは役に立ちましたか?