HTMLにおけるimg要素のalt属性
HTML Standardの4.8.1.1 Requirements for providing text to act as an alternative for imagesをざっと把握できるように日本語で箇条書きにしただけのものです。最終的には原文をしっかりと読むべきでしょう。
- 基本
- 必ず定義されるべきである
- その値は空であってはならない
- その画像に代わりになる最適な文字列である
- ページ上の全ての画像をその
alt属性の値で置き換えてもページの意味合いが変わってはならない
- 画像のキャプションや題名、銘とみなされるような補助的な説明を意味するものであってはならない
- 前後で解説されている情報の繰り返しであってはならない
- 画像以外に何も含まれていないリンクやボタンで使われる場合
- リンクやボタンの目的を明確に伝える文字列を指定する
- わかりやすく説明するために文章ではなく画像のチャートやグラフを利用する場合
- 画像と完全に同じ内容を伝える文字列を指定する
- 画像の説明であってはならない
- アイコンやロゴのような同じ意味を持つ文字列やラベルが付随する場合
- 空文字列を指定する
- 同じ意味を持つ文字列やラベルが付随しない場合は空文字列であってはならない
- 文字列を画像化したものの場合
- 画像に書かれている文字列とまったく同じ文字列を指定する
- 前後の文章を画像で表現したものの場合
- 空文字を指定する
- キャプションを指定してはならない
- キャプションを付ける時には
title属性かfigcaption要素を利用する
- 完全な飾り目的の画像の場合
- そのページのコンテンツと関係ない場合は
img要素を使うべきではなく、CSSから利用されるべきである
- 飾り目的にも拘らずページのコンテンツと一定の関連性がある場合は空文字を指定する
- 大きな画像を分割した画像の一群をリンクなしで並べる場合
- そのうち一つに対してのみ他のルールに従って適切な文字列を指定する
- 残りの画像には空文字列を指定する
- 大きな画像を分割した画像の一群をリンク付きで並べる場合
- クリッカブルマップを利用するべきである
- リンクが張られている画像にはリンクの目的を明確に伝える文字列を指定する
- リンクが張られていない画像には空文字列を指定する
- 画像がコンテンツの最も重要な要素の場合
- 基本
- 説明が困難な画像の場合
- 画像と完全に同じ内容であるべきだが、難しい場合は簡単な説明でも良い
- 画像の内容がわからない場合
alt属性は指定しなくて良いが、以下のどちらかを併用すべきであるfigure要素に格納し、figcaption要素に何か文字列を指定するtitle属性に何か文字列を指定する
- 訪問者に何か意味のある画像ではない場合
img要素を使うべきではない- アクセスカウンターのための画像などの場合は空文字列を指定し、
widthとheight属性には0を指定する
- 確実に画像を見ることができると知っている相手へ向けたEメールや私的な文書で使う場合
- マークアップ・ジェネレーター向けのガイド
- リンクで使われる場合
- キャプションがある場合
figcaption要素かtitle属性を使い、alt属性は使わない
- その他
- 空文字を指定する
- その画像がコンテンツの最も重要な要素の場合は
alt属性を指定しなくても良い
generator-unable-to-provide-required-alt属性を代わりに指定しても良い- 画像のファイル名を使うべきではない
- 検証ツール向けのガイド
alt属性がない場合はエラーにするべきであるが、以下の場合はその限りではない
figure要素に格納し、figcaption要素に何か文字列を指定している場合title属性があり、その値が空文字でない場合- 確実に画像を見ることができると知っている相手へ向けたEメールや私的な文書で使う場合を想定した検証ツールの場合
generator-unable-to-provide-required-alt属性がある場合