SEOで効果が得られるimgタグalt属性のすすめ

alt属性 正しく設定してる?

SEO対策であまり意識されていないケースが多いimg タグのalt属性。今回はそのimgタグのalt属性の書き方、不適切な例や正しい例をご紹介していきます。

alt属性はなぜ設定しないといけないか?

alt属性はページを読み込む際、何らかしらの原因で画像が表示されなかったときの代替え手段として表示させるテキスト情報です。

上記の要因以外にも視覚障害者の方などが使用するスクリーンリーダーというページのテキストを読み上げてくれるブラウザでも、画像部分にalt属性が設定されていれば読み上げられます。

alt属性の書き方

alt属性の指定の仕方解説

上記イメージの通りにalt属性を指定するようにしましょう。

alt属性の記述
<img src="outswan.png" alt="ここに画像の説明をテキストで入れます。">

Alt属性の指定の注意点

Alt属性は下記のポイントを注意しながら設定するようにしましょう。

  • 画像の具体的な内容を書きましょう
  • 見出しの要素またはリンクの要素なっている場合、必ずalt属性を指定しましょう。
  • 多数のキーワードを詰め込みすぎないようにしましょう。
  • 飾り目的の画像はalt属性を指定しなくていい

Alt属性の具体的な書き方

検索エンジンへ画像の情報を適切に伝えるために画像の内容を具体的に書くことをお勧めします。たとえば、スポーツの画像を張る場合、なんのスポーツをしているのか・選手の画像であれば選手の名前の情報・チームの情報などを記載するようにしましょう。

Alt属性の悪い例

画像の内容がわからない不適切なalt属性の記述
<img src="orange.png" alt="bp212">

Alt属性の良い例

画像の内容がわかる適切なalt属性の記述
<img src="orange.png" alt=""広島県産の名物果物 「ネーブルオレンジ"」>

見出し、リンクの要素は必ずalt属性を指定

検索エンジンに見出しの要素・リンクの要素はテキストとして情報を伝えないといけないため、必ずalt属性を記述するようにしましょう。

画像の内容がわかる適切なalt属性の記述
<a href="https://example.co.jp/orange/">
<img src="orange.png" alt=""広島県産の名物果物 「ネーブルオレンジ"」>
</a>

なお、アンカーテキスト・見出し・ナビゲーションなどはページにとって重要な要素となるため、検索エンジンが正確にクロールされるよう、画像ではなくテキストでの表現が好ましいです。

alt属性にキーワードを詰め込みすぎない

画像内に多数のキーワードを詰め込みすぎると、画像の内容が伝わりにくく検索エンジンにとっても不正行為・スパム行為と認識される可能性があるため、避けましょう。

キーワードを詰め込みすぎな例
<img src="orange.png" alt="果物 オレンジ Orange おれんじ 広島県 fruits  人気 ">

画像の周辺ワードの文脈についても意識

alt属性を付与されたテキスト情報は、その画像の周辺にある文脈情報も参考にしています。各都道府県の天気予報を表すグラフ画像の場合、alt属性は天気予報のグラフ情報を端的に表す内容を記述してあげ、その画像の近くに天気予報の説明を記述することによって、検索エンジンは画像の内容をより認識できます。

都道府県毎のグラフ表示とその画像付近の説明事例
<img src="orange.png" alt=""各都道府県毎の今週の天気予報グラフ">
<p>今週、関東・甲信越では晴れ間が続きますが、週末にかけて天気は下り坂になっていくでしょう。</p>

画像へのアンカーテキストの指定について

画像に向けられたアンカーテキストは、Googleへ画像の内容を提供していることとなります。そのため、画像に向けられたリンクを設置する場合は、alt属性同様に、画像を的確に表すリンクテキスト記述するようにしましょう。

不適切な画像へのリンク
<a href="orange.png">
画像を拡大する
</a>
適切な画像へのリンク
<a href="orange.png">
広島県産の「ネーブルオレンジ」拡大画像はこちら
</a>

画像のファイル名も内容を表すワードに

画像のファイル名についてもGoogleが画像内容を理解する1つの要素となっています。そのたえ、ファイル名も「img1.jpg」といった連番画像の内容にせず、画像内容を表す文字列に設定しましょう。

不適切な画像ファイル名
<img src="img01.jpg" alt="青森県産 りんご">
適切な画像ファイル名
<img src="aomori-apple.jpg" alt="青森県産 りんご">

画像情報を検索エンジンに正確に伝えることで、コンテンツの内容をより正確にGoogleに伝えることができ、画像検索結果にもコンテンツの画像が表示されやすくなり新しい集客につながるため、できる限りalt属性やファイル名などの意識をして実施することをおすすめします。