第16講

スクリーンリーダー利用者と晴眼者のギャップ

この章は、この教材の中核です。スクリーンリーダーで理解できる画面と、晴眼者が目で見て自然に理解できる画面は、必ずしも一致しません。

同じページでも、得ている情報が違う

スクリーンリーダー利用者は、基本的にHTMLの順序に沿って、要素を時間の流れの中で受け取ります。一方、晴眼者は、画面全体を一度に見て、位置、大きさ、色、余白、まとまり、目立ち方を同時に把握します。

スクリーンリーダー利用者の理解情報は、上から下へ順番に到着する。見出しジャンプ、リンク一覧、フォーム項目などにより、構造をたどって理解する。
晴眼者の理解画面全体を見て、目立つもの、中央にあるもの、大きいもの、色の強いもの、余白で区切られたまとまりから理解する。

この違いにより、読み上げでは自然でも、目視では違和感がある状態が生まれます。

ギャップ1:順序の理解と面の理解

スクリーンリーダーでは、ページは時間の順番で理解されます。最初に見出し、次に説明文、次にリンク、というように、情報が一つずつ届きます。

晴眼者は、画面を面として見ます。上部に何があり、中央に何があり、右側に何があり、どの部品が大きく、どの部品が小さいかを同時に把握します。

起こりやすいずれHTML順序では正しいが、画面上ではボタンが遠く離れている。読み上げではすぐ次に聞こえるが、目視では「探さないと見つからない」と感じられる。

ギャップ2:見出しの意味と見出しの見え方

スクリーンリーダーでは、見出しはレベルやジャンプ対象として理解できます。しかし晴眼者には、見出しの大きさ、太さ、余白、位置によって重要度が伝わります。

問題例HTMLでは h2 になっているが、見た目では本文とほとんど同じ大きさで、見出しに見えない。
改善例見出しは本文より明確に大きく、前後に余白があり、章の始まりとして見える。

ギャップ3:リンク名とボタンの存在感

スクリーンリーダーでは、リンク名やボタン名が分かれば操作できます。しかし晴眼者にとっては、そのボタンがどれだけ目立つか、押すべきものとして見えるかが重要です。

「お問い合わせはこちら」というリンクが読み上げで分かっても、画面上で小さな文字リンクにしか見えなければ、主な行動としては弱くなります。

ギャップ4:余白は読み上げられない

余白は、スクリーンリーダーでは基本的に読み上げられません。しかし晴眼者にとって、余白は情報のまとまり、読みやすさ、落ち着き、信頼感を作る重要な要素です。

講義の要点全盲者にとって余白は「何もない場所」に聞こえるかもしれません。しかし見える人にとって余白は、情報を分け、呼吸を作り、ページ全体を整えるための見える構造です。

ギャップを吸収する方法

  1. HTML構造はスクリーンリーダーで確認する。
  2. 見た目の順序、余白、視線誘導は目視確認者に確認してもらう。
  3. 確認依頼では、「どこが変か」ではなく、「こちらの意図通りに見えているか」を尋ねる。
  4. 目視確認者の返答を、評価語辞典にある言葉へ置き換えて記録する。
  5. 修正後も、読み上げ順と目視印象の両方を再確認する。

確認用の対話例

制作者:読み上げでは、見出し、説明文、申し込みボタンの順に自然に読めます。目で見たときも、その順に自然に目が動きますか。

確認者:見出しは分かりますが、申し込みボタンが少し下に離れていて、最初は気づきにくいです。

制作者:つまり、読み上げ順は問題ないが、目視では主ボタンの存在感が弱いということですね。ボタンを本文に近づける、または大きくする方向で調整します。

講義のまとめ

スクリーンリーダー利用者と晴眼者の違いは、優劣ではありません。情報を受け取る経路が違うだけです。よいWeb制作では、読み上げの順序と、目視でのまとまり・視線誘導の両方を成立させます。