Level AWCAG 2.2
3.1.1 ページの言語
ウェブページのデフォルトの自然言語がプログラムで解釈可能である。
なぜ重要か
スクリーンリーダー
lang属性がないと誤った言語エンジンで読み上げられ、内容が全く伝わりません。
多言語対応
ブラウザの翻訳機能や辞書ツールが正しく動作するために言語情報が必要です。
文字レンダリング
ブラウザは言語に応じて最適なフォントや文字間隔を選択します。
点字ディスプレイ
点字変換は言語によって規則が異なります。正しい言語指定が不可欠です。
ライブデモ
ページの言語指定とスクリーンリーダー
lang 属性なし
<!DOCTYPE html>
<html>
<head><title>お知らせ</title></head>
<body>
<h1>お知らせ一覧</h1>
<p>最新のお知らせです。</p>
</body>
</html> スクリーンリーダーの読み上げ
言語が不明 → デフォルト言語(例: 英語)で読み上げ
"oh-shee-rah-seh ee-chee-rahn"
※ 英語の発音規則で日本語テキストを読む
※ 英語の発音規則で日本語テキストを読む
lang 属性がないと、スクリーンリーダーはOSのデフォルト言語で読み上げます。 日本語ページなのに英語の発音規則で読まれると意味が伝わりません。ペルソナで理解する
山田さん(28歳)— 全盲
スクリーンリーダーを使っていますが、lang属性がないサイトでは英語エンジンで日本語が読まれ、意味不明な発音が流れます。「おしらせ」が「oh-shee-rah-seh」になると何のことかわかりません。