【HTML Living Standard】lang属性の使い方
lang属性の使い方について、初心者にもわかりやすく解説します。
基本的な使い方
langプロパティは、HTML要素の内容が使用している自然言語を保持するプロパティです。このプロパティは、HTMLのあらゆる要素に指定できるグローバル属性の一つとして定義されています。
langプロパティの主な目的は、ウェブページや特定の要素内のテキストがどの言語で書かれているかを明確に宣言することにあります。これにより、Webブラウザ、検索エンジン、スクリーンリーダーなどのユーザーエージェントが、コンテンツを適切に処理し、ユーザーに最適な形で提供できるようになります。例えば、検索エンジンは言語情報を利用して適切な検索結果を表示し、スクリーンリーダーは正しい発音でテキストを読み上げることができます。また、ブラウザは適切なフォントを選択したり、自動翻訳機能の判断基準としたりします。
通常、ウェブページの主要な言語は<html>タグにlang属性を指定して設定します。例えば、日本語のページであれば<html lang="ja">と記述します。もしページの一部に異なる言語のコンテンツが含まれる場合は、その部分を囲む要素（例: <p>, <span>, <div>など）に個別にlang属性を設定することで、その部分の言語を宣言できます。属性の値には、ISO 639-1で定義された言語コード（例: "en", "ja"）や、さらに地域コードを加えた形（例: "en-US", "ja-JP"）を指定します。
このプロパティを正しく設定することは、ウェブコンテンツの国際化対応、アクセシビリティの向上、そして検索エンジン最適化（SEO）において非常に重要です。
構文(syntax)
1<element lang="language-code"></element>
引数(parameters)
引数なし
引数はありません
戻り値(return)
戻り値なし
戻り値はありません
サンプルコード
HTML文書の言語をjaで指定する
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>日本語のウェブページ</title> 7</head> 8<body> 9 <!-- lang="ja" は、この文書の主要な言語が日本語であることを示します。 --> 10 <h1>ようこそ</h1> 11 <p>これは日本語で書かれたウェブページです。</p> 12 <p>ユーザーエージェントや検索エンジンに言語情報を提供します。</p> 13</body> 14</html>
HTMLのlang属性は、ウェブ文書の主要な言語を指定するためのグローバル属性です。これはHTMLの全ての要素で使用できますが、通常は文書全体の言語を示すために<html>タグに指定されます。
サンプルコードでは、<html lang="ja">と記述されており、jaは日本語を表すISO 639-1コードです。これにより、このウェブページ全体が日本語で書かれていることを明示的に宣言しています。
この言語情報は、ウェブページを閲覧するユーザーだけでなく、検索エンジン、スクリーンリーダーなどの支援技術、そしてブラウザにとって非常に重要です。例えば、検索エンジンは言語情報を利用して適切な検索結果を表示し、スクリーンリーダーは指定された言語で正しくコンテンツを読み上げます。また、ブラウザは言語に応じたフォントの選択、スペルチェック、自動翻訳機能の提供などにこの情報を活用します。
lang属性自体に特別な引数はなく、また特定の値を戻り値として返すこともありません。単に言語コードを属性値として設定することで、ウェブページの言語情報を伝達する役割を担っています。これにより、ウェブコンテンツのアクセシビリティとユーザビリティが向上し、多種多様なユーザー環境で情報が正しく解釈されるようになります。
lang属性は、ウェブページの主要言語をhtml要素に宣言する重要なグローバル属性です。これにより、検索エンジンは言語を正しく認識し、適切な検索結果に表示します。音声読み上げソフトは指定言語の発音でコンテンツを読み上げ、アクセシビリティが向上します。ブラウザの自動翻訳機能の精度も高まります。ページの一部で言語が変わる場合、その特定の要素に個別のlang属性を指定し、正確な情報提供が必須です。言語コードは国際標準規格に従い、「ja」のように正確に記述してください。