Accessibility
Guidelines

3.1.1 ページの言語を指定する

適合レベル

A

※各レベルについては適合レベルとはをご覧ください

概要

プログラムが解釈できるように、Webページのデフォルトの言語を指定する。

詳細

html要素のlang属性に適切な言語を指定することで、以下のように全てのユーザーがコンテンツを理解しやすくなる。

  • スクリーンリーダーなどの支援技術を用いているユーザーにも正しい発音規則を提供する
  • ビジュアルブラウザは、文字や書体を正しく表示する
  • メディアプレイヤーは、キャプションを正しく表示する
  • 自動翻訳、検索エンジンでインデックスされやすくなる
  • textareaでハイライト表示される

また、部分的にページ全体と異なる言語を適用する場合、その要素に個別にlang属性を定義すると尚良い。

テスト・チェック方法

マークアップ時、コードレビューによるチェックを行う。

実装方法

Web

良い実装例

HTML文書の内容が日本語の場合
<!DOCTYPE html>
<html lang="ja">
部分的に異なる言語を適用する場合
<!DOCTYPE html>
<html lang="ja">
  ...
  <body>
    ...
    <h3 lang="en">How to use</h3>
    ...

Android

ローカライズに対応させるため、フォルダを言語ごとに配置する。

drawable

  • 日本語:drawable-ja-hdpi/hoge.webp
  • その他:drawable-hdpi/hoge.webp

values

  • 日本語:values-ja/strings.xml
  • その他:values/strings.xml
<resources>
  <string name="hello">こんにちは</string>
</resources>

values/strings.xml

<resources>
  <string name="hello">hello</string>
</resources>

values-ja/strings.xml

iOS

Appの対応言語を設定し、文字列リソースをローカライズする。

"Hello" = "こんにちは";

Resources/ja.lproj/Localizable.strings

"Hello" = "Hello";

Resources/en.lproj/Localizable.strings

参考文献