スクリーンリーダーは、コンピュータ画面上のテキストや UI 要素を音声合成で読み上げる支援技術 (アシスティブテクノロジー) です。視覚障害のあるユーザーが Web サイトやアプリケーションを利用するために不可欠なツールであり、WHO の推計では世界で約 22 億人が何らかの視覚障害を抱えているとされています。スクリーンリーダーは単なる読み上げソフトではなく、ページの構造を解析し、見出し・リンク・フォームなどの要素間をキーボード操作で移動する機能も備えています。

主要なスクリーンリーダーには、Windows の NVDA (無料・オープンソース) や JAWS (商用)、macOS/iOS の VoiceOver (OS 標準搭載)、Android の TalkBack (OS 標準搭載) があります。これらは HTML の DOM 構造やアクセシビリティツリーを解釈し、ARIA 属性の情報を加味してコンテンツを音声で伝えます。NVDA は無料で利用できるため開発者のテスト用途にも適しており、WebAIM の調査では JAWS に次いで高いシェアを持っています。Web アクセシビリティの書籍で対応方法を学べます。

スクリーンリーダー対応の Web サイトを作るには、いくつかの重要なポイントがあります。セマンティック HTML の使用により、スクリーンリーダーはページのランドマーク (header、nav、main、footer) を認識し、ユーザーが目的のセクションへ素早く移動できます。適切な alt テキストは画像の内容を伝え、ARIA ラベルはカスタム UI コンポーネントの役割と状態を補足します。見出しの階層構造 (h1 から h6) を正しく使うことで、ユーザーは見出し一覧から目的の箇所へジャンプできます。

キーボード操作への対応もスクリーンリーダー対応の核心です。スクリーンリーダーのユーザーはマウスを使わず、Tab キーでフォーカスを移動し、Enter キーで操作を実行します。フォーカスインジケーターが視覚的に明確であること、フォーカス順序が論理的であること、すべてのインタラクティブ要素がキーボードで操作可能であることが求められます。モーダルダイアログではフォーカストラップを実装し、ダイアログ外への移動を防ぐ配慮も必要です。

よくある誤解として、「スクリーンリーダーは視覚障害者だけが使う」というものがあります。実際には、学習障害のあるユーザー、一時的な視覚障害 (目の手術後など)、マルチタスク中に音声で情報を得たいユーザーなど、利用者層は多様です。また、「ARIA 属性を多用すれば対応できる」という誤解もありますが、ARIA の第一原則は「ネイティブ HTML 要素で実現できるなら ARIA を使わない」です。

文字数カウントの観点では、スクリーンリーダーは画面に表示されないテキスト (alt 属性、aria-label、visually-hidden クラスのテキスト) も読み上げます。そのため、これらの非表示テキストの文字数管理も重要です。alt テキストは 125 文字以内が推奨され、aria-label は簡潔に保つことが望ましいとされています。ページ全体のテキスト量を把握する際には、可視テキストだけでなくこれらの非表示テキストも含めて考慮する必要があります。バリアフリー設計の書籍も参考になります。