H57:html要素の言語属性を使用する
出典:WAIC. “
H57: html 要素の言語属性を使用する
” WCAG 2.0 達成方法集(参照2024年7月1日)
概要
H57は、ウェブページ全体の主言語を指定するためにhtml要素に言語属性langを使用する技術であり、WCAG 2.0の達成基準3.1.1「ページの言語」に対応しています。これにより、スクリーンリーダーなどの支援技術が正しい言語設定でページを読み上げ、視覚障害者や読み上げ技術を使用するユーザーがページの内容を正しく理解しやすくなります。
このページでは、ウェブサイト制作でよく直面する課題に対して、基本的で取り組みやすい方法を紹介しています。
ただし、他にも対処すべき状況や多くの手段があり、具体的な状況に応じて最適な方法を選ぶことが大切です。
適用(対象)
こちらは、次の達成基準に関連する達成方法です。
実践的な方法
言語属性の追加
html要素にlang属性を追加し、ページの主言語のコードを指定します。言語コードはISO 639-1標準に従います。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>サンプルページ</title>
</head>
<body>
<p>これは日本語のサンプルページです。</p>
</body>
</html>
適切な言語コードの使用
ページの主言語に適した言語コードを使用します。以下に一般的な言語コードの例を示します。
- 日本語:ja
- 英語:en
- フランス語:fr
- ドイツ語:de
- スペイン語:es
- 中国語:zh
- 韓国語:ko
まとめ
H57は、ウェブページの主言語を正確に指定するために不可欠です。html要素にlang属性を追加することで、支援技術がページの内容を適切に提供し、利用者の理解を助けます。正しい言語設定は、アクセシビリティを向上させ、ユーザーエクスペリエンスを改善するための基本的なステップです。
WCAG 2.0とその翻訳文書の利用について
本ページの内容は、「Web Content Accessibility Guidelines (WCAG) 2.0」、「WCAG 2.0 解説書
」および「WCAG 2.0 達成方法集
」からの引用を含んでいます。引用された内容は、W3CおよびWAICによって公開されており、以下のクリエイティブ・コモンズライセンスに基づいて使用されています。これらのガイドラインを参考にしつつ、ウェブアクセシビリティの向上に向けた具体的な取り組みを分かりやすく説明しています。
WCAG 2.0
この作品はクリエイティブ・コモンズ 表示 4.0 国際ライセンスの下に提供されています。
WCAG 2.0 解説書及び達成方法集
この作品はWCAG 2.0 解説書及び達成方法集からの引用を含みます。翻訳はWAICによって提供されており、文書のステータスは「勧告」です。なお、この文書の正式版はあくまでW3Cのサイト内にある英語版であることにご注意ください。