◆ ALT属性（代替テキスト）の使い方
ALT属性で指定する代替テキストには、どのような書き方すればいいのか? 画像のタイプや用途別に、代替テキストの使い方を説明しましょう。
ファイル名（***.gif）を書いている人や、どういった画像かの説明を長々書いている人などもいますが、それでは役に立つテキスト＝画像の「代替となるテキスト」とは言えません。
あくまでも「ALT属性」は、画像が表示されていない場合の代替テキストにすぎません。
もし、説明を書くなら、「title="説明文"」の属性を加えましょう。title属性でも、３０字以上になる場合は通常の段落で説明するか、他に説明するページを作りましょう。画像が表示されるとALT="代替テキスト"よりもtitle="説明文"が優先表示されます。
・メニューボタン
下のようなメニューボタンでは、画像の役割は明確です。この絵は「Link」という字を飾っているので、代替テキストもずばり「Link」でOK。画像が表示できない環境でも、目的のメニューをちゃんと選べるようになります。
ソース：ALT="代替テキスト"のみ <A HREF="**.htm"> <IMG src="kuma.gif" alt="link" width="126" height="40"> </A>
表示結果：ALT="代替テキスト" のみ
この画像はK's Parts Landさんより、戴いた画像です。
ソース：TITLE="説明" を加えたもの <A HREF="**.htm"> <IMG src="kuma.gif" alt="link" title="この画像はK's Parts Landの画像です" width="126" height="40"> </A>
表示結果：TITLE="説明" を加えたもの
・飾りのための
マーカー（リスト・マーク）
ページを装飾する以上の意味がないアイコンの場合、W3Cでは「ALT=" " にしてもいいよ」となっていますが、非視覚者のためにも「ALT="リスト"」「"マーカー"」「"マーク"」書きましょう。
ソース： <IMG src="apple.gif" width="25" height="27" alt="リストマーク">今月は、アップルパイ
表示結果：
今月は、アップルパイ
この画像はK's Parts Landさんより、戴いた画像です。
・タイトル画像や「作品」として貼り込んでいる画像
ホームページのタイトル画像や写真ギャラリーの各作品などには、画像解説をつけておくのが妥当です。大きな画像は、解説に加え「ファイル名、ファイルサイズ」を書いておけば、完璧です。
HTMLソース： <SMALL> パリ・「エッフェル塔」 89,130バイト</SMALL><BR> <IMG src="FR_K003.jpg" width="455" height="312" alt="「エッフェル塔」写真、８９ＫＢ">
表示結果：
パリ・「エッフェル塔」 89,130バイト
この画像はG-TOOLさんより、戴いた画像です。
・画像の罫線
罫線の代替テキストがないと、非視覚者には意図した区切りでなく単に画像になってしまいます。
だからといって「ALT="これは、次の文章に移る罫線で、ピンク色のハートの模様が縦のライン上に並んだ可愛い画像です"」などと長い解説は見苦しいでしょう。
罫線代わりに貼り込む画像には、「ALT="罫線"」「ALT="ライン"」「ALT="区切り"」）です。
画像の多くなる環境も意識するならば、罫線代わりに画像を使うのは控えたが無難です。（画像が多いと、重い！！）
罫線利用での例：
この画像はふぁんし〜・ぱ〜つ・しょっぷさんより、戴いた画像です。
【←BACK ┃NEXT→】