alt属性の役割とは？SEOに効果的な代替テキストの付け方

通信状態が悪くてWebサイトの画像の読み込みに失敗した時、壊れたファイルのアイコンの隣に文字が表示されているのを見たことはありませんか？これが画像や動画に設定されているaltタグ（alt属性）です。ここでは、altを設置することのメリットやSEOに効果的なaltタグの付け方をご紹介します。

alt属性とは？

alt属性は「代替えテキスト」とも呼ばれ、Webサイトの画像の読み込みに失敗した時などに、画像や動画の代わりに表示されるテキスト情報のことです。Webサイトに画像の表示を設定するとき、htmlファイルには<img src=”http://” alt=”” >のように記述をしますが、この中で「alt=””」の部分がalt属性です。

altを設置することのメリット

画像が表示されなかった時の説明になる

冒頭でもご紹介したように、万が一画像が表示されなかったときは代わりにaltタグが表示されるので、代替手段（alternative）とも呼ばれており、画像内容を理解するのに役立ちます。また、画像にリンクを設定している場合は、altタグのテキストがアンカーテキストの代わりになります。

視覚障害を持つ人や高齢者を助ける

altタグを入力しておくと、Webサイトの音声読み上げ機能を使ったときに読み上げられるので、視覚障害を持つ人や小さい字を読むことが困難になった高齢者が利用するときに理解を助けます。

検索エンジンが画像を理解するのを助ける

私たちは画像を見てその内容を理解できますが、検索エンジンは、画像だけでその内容を把握することができません。検索エンジンが画像を理解するとき参考にしているのが、altタグや画像周辺のテキスト、ファイル名などです。altタグに画像の表している内容を適切に記述することによって、検索エンジン正しく理解され検索結果に反映されます。

SEOの効果を高める

altタグは、その設定することだけをとるとSEO効果はありません。テキストに関連性の低い画像を載せてそのaltを設定しても、ページの情報自体がユーザーにとって分かりにくいものなら効果は上がらないという意味です。テキストに関連性の高い画像を選び、そのうえで画像を適切に説明したaltに設定することで結果的にサイトがユーザーと検索エンジン両者にとってわかりやすいものとなり、SEOの効果を高められる可能性はあります。

SEOに効果的なaltタグの付け方

Webサイトで画像を表示するとき、htmlファイルには<img src=”http://” alt=”○○○○” >のように記述をしますが、「alt=”○○○○”」部分がalt属性です。”○○○○”にはどのような画像か説明が入ります。説明では次の点に注意が必要です。

画像の内容を具体的に書く

Webサイトの音声読み上げ機能にも使われることがあるので、画像を見なくても写っている内容がわかるように具体的に書きましょう。また、クローラーは単語の羅列は理解できないため、端的な文章で記述しましょう。

画像内容と関係ない言葉を入れない

飾り罫や背景に使われるような装飾的な画像は、コンテンツとしては意味を持たないので、あえてalt属性は入れないようにしましょう。この時に説明の言葉は入れなくても<img src=”http://” alt=”” >のように「alt=””」の記述は必要です。

キーワードを詰め込み過ぎない

画像内容を分かりやすく伝えようと、キーワードを入れ過ぎたり、長すぎたりすると、1番伝えたいことがわかりにくくなります。さらに検索エンジンからスパム行為と誤解され、ペナルティを受ける可能性もあります。ユーザーにとっても検索エンジンのクローラーにとってもわかりやすい説明になるようできるだけ簡潔に表現しましょう。

まとめ

altは、画像が表示されなかったときの代わりテキストで表示されたり、Webサイトの音声読み上げ機能を使ったときに読み上げられたり、検索エンジンにとってもコンテンツの内容を把握しやすくするなど、ユーザーや検索エンジンのクローラーにとって重要な役割を持っています。キーワードを入れ過ぎたり、画像とは関係の無い言葉を入れるとスパムと疑われる可能性もありますが、そのような点に注意しながらalt属性を設定しSEO施策に活かしましょう。

サイト良くして委員会　トップページに戻る