← 一覧へ
✅ テスト・チェックCC / Codex 両対応難易度: 中級
スクリーンリーダーテスト screen-reader-testing
アクセシブルなウェブをみんなで作ろう
これは何？
スクリーンリーダーを使ってウェブサイトのアクセシビリティをテストするスキルです。視覚障害のあるユーザーがどのようにサイトを利用するかを確認できます。主要なスクリーンリーダー（VoiceOver、NVDA、JAWSなど）の操作方法を学べます。アクセシブルなウェブ開発を目指す方にぴったりです。
これでできること
- フォームの入力ガイドが正しく読み上げられるか確認できる
- 動的に変化するコンテンツの読み上げタイミングをテストできる
- ナビゲーションの操作性をスクリーンリーダーで確認できる
- ARIA属性が正しく機能しているか検証できる
- ページ読み込み時の読み上げ内容をチェックできる
こんな時に便利
新しいウェブアプリケーションをリリースする前のチェック
アクセシビリティに関するバグ報告を受けた時の調査
既存サイトのリニューアル時にアクセシビリティを向上させたい時
公共機関向けのウェブサイト開発時
使い方
まずは主要なスクリーンリーダー（VoiceOverやNVDA）をインストールします。テストしたいウェブページを開き、スクリーンリーダーを起動して操作してみましょう。キーボードショートカットを使って要素間を移動し、読み上げ内容を確認します。
使用例（こう頼んでみよう）
VoiceOverでこのフォームのアクセシビリティをテストしてくださいNVDAを使ってこのページの見出し構造を確認してくださいスクリーンリーダーで操作した時にエラーメッセージが読み上げられますか？必要なもの
- 特になし
導入方法
いちばん簡単（AIに頼む）
次のスキルを入れて: https://github.com/wshobson/agents/tree/main/plugins/accessibility-compliance/skills/screen-reader-testing手動で置く
Claude Code →
~/.claude/skills/screen-reader-testing/Codex →
~/.agents/skills/screen-reader-testing/使いこなしのコツ
- まずはWindowsならNVDA、MacならVoiceOverの基本操作から練習しましょう
- テスト時は必ずキーボードだけで操作できるか確認することが大切です
- 主要なスクリーンリーダーごとに挙動が異なることがあるので、複数でテストするとより安心です