1. トップページ >
  2. コーディング関連情報 >
  3. コーディングコラム >
  4. alt属性とtitle属性の違い

コーディングコラム

alt属性とtitle属性の違い

imgタグの属性として「alt」と「title」があります。どちらも画像に対する説明テキストですが、どのように使い分けるのでしょうか。

「alt属性」は画像の代わりに表示する代替テキストで、主にブラウザ設定で画像を非表示(テキストのみの表示)にした場合を対象としています。
「titl属性」の場合は、ポインタを画像に合わせたときに表示される画像の説明テキストとなります。

どちらも画像の説明には変わりないのですが、画像非表示を対象としたものは「alt属性」、表示画像に対しては「titl属性」とするのが適切といえます。大したことではないのですが、以下のような使い方があります。

【画像にポインタを合わせてもテキストが表示されず、画像非表示にすると代替テキストを表示】

<img alt="立替テキスト" title="">

だからどーした?
といった感じですが、アクセシビリティが重要になったときに役立つかも?