ポイント2：タグで構造や役割を示す
a. 見出しを明確に示す
【関連するJIS X 8341-3 個別要件】 5.2.a
見出し（h1〜h6）を正しくタグ付けし、明確に示すことは重要なことです。たとえば、ホームページの内容を音声で読み上げさせている場合、そのページの構成を把握するために、見出しだけを抜き出して読み上げる機能を利用して拾い読みをすることもあります。その場合、見出しが正しくタグ付けされていなければ、見出しとして認識されず読み上げられません。また、逆に文字を大きく表示させたいなどの理由で、見出しでない部分に見出しのタグ付けがされていると、関係ない部分が読み上げられて混乱する可能性もあります。見出しは画像になっていることが多いですが、たとえ画像であっても見出しとしてタグ付けする必要があるという点にも注意してください。
<h1>情報バリアフリーのための情報提供サイトへようこそ</h1>
見出しの例とそのソース。適切に見出しのタグが付けられている。
b. 強調したい部分のタグ付け
【関連するJIS X 8341-3 個別要件】 5.2.a
文字の色を変える、太字にする、下線を引く。これらは、その部分を強調したい時の手段です。しかし、HTMLで表示方法を指定するだけだと、その通りに表示できない環境を利用している人には、強調されていることが伝わりません。HTMLで強調を示すには、emタグ(普通の強調)またはstrongタグ(普通より強い強調)を使います。そのままの状態だと、一般的にemタグの内容は斜体で、strongタグの内容は太字で表示されますが、表示方法はスタイルシートで自由に変更できます。HTMLで強調されていることを構造的に示しておくと、たとえば音声で表現される場合でも、音量や抑揚などの変化でそれを伝えることが可能になります。
em {
font-style: normal; /* 斜体を戻す */
font-weight: bold /* 太字にする */
}
strong {
font-weight: bold; /* 太字にする */
text-decoration: underline; /* 下線を引く */
color: #ff0000; /* 文字を赤に */
background: #ffffff /* 背景を白に */
}
c. ブロックレベルとインライン
【関連するJIS X 8341-3 個別要件】 5.2.a
HTMLで使うことのできるタグの中には、１つのまとまった単位として扱われるもの（ブロックレベル：見出し・段落など）と、その中の文章の一部として使われるもの（インライン：強調・リンク・画像など）があります。HTMLの基本的なルールとして、インラインのものは、ブロックレベルの中に入れることになっています。たとえば、<body>〜</body>の中に画像やリンクを直接入れるのではなく、まず見出しや段落などのタグを書いて、インラインのものはその中に入れるということです。このようにページの内容を構造的な単位でまとめておくと、音声などの環境では、ブロックレベルの単位で読み飛ばすなどの操作ができるようになり、内容がより扱いやすくなります。
| ブロックレベル要素の例 | address / blockquote / div / dl / fieldset / form / h1〜h6 / ol / p / pre / table / ul |
|---|---|
| インライン要素の例 | a / abbr / acronym / b / big / br / button / cite / code / dfn / em / i / img / input / kbd / label / object / q / samp / select / small / span / strong / sub / sup / textarea / tt / var |
