Webサイト上の画像データに紐づくデータとして「alt属性」と呼ばれるものがあります。

alt属性とはHTMLのimg要素、つまり画像に設定することにより、画像を表示することや見ることができない環境であってもこの画像はこういうものですよと画像の情報を表すためのテキストです。

今回はこのalt属性の適切な使用方法やSEOにおける役割、確認方法、文字数などについて紹介します。

alt属性とは

Webブラウザでは様々な事情で画像を表示させることができない状況になってしまうことがあります。

例えばスマートフォンの通信制限等による表示の遅延によってページの生成がタイムアウトしてしまった場合にはalt属性として設定している代替えテキストが画像の部分に表示されます。

その他にもページの読み上げ機能を使用する場合において、alt属性が設定されていると画像の代わりにその代替えテキストを読み上げられます。

つまりalt属性は、なんらかの要因でユーザーが画像を画像として認識できない場合に、その画像が何を意味しているのかを伝えるためのテキストです。

alt属性のSEO効果について

alt属性は画像を見ることのできないユーザーにどのような画像なのかを伝えるためのテキストと紹介しましたが、SEOにおいて切っても切れない関係にあります。

ユーザーのほかにも画像を認識することができない要素、つまりクローラーです。

クローラーとはGoogle Botに代表される、検索エンジン（Google）がページやサイトを評価するためにWeb上で巡回させているプログラムのことです。

クローラーはWebページをコードを読み取ることによってその情報を収集しているため、どのような画像なのかを認識・判断することができず、alt属性によってどのような画像なのかを判断しています。

そのため、alt属性で代替えテキストを設定することは、画像を見ることのできないユーザーのためだけではなく、テキストに加えて画像を情報としてクローラーに伝える、つまりSEOの観点からも設定しておくべきだと言えます。

SEOにおけるalt属性の適切な書き方

SEOにおいて適切とされているalt属性の書き方について紹介していきます。

まずはこの画像をみてあなたであればどういったalt属性の代替えテキストを設定しますか？

image1.jpg

最も間違えやすいのが、SEO効果があるからとキーワードを詰め込みすぎるミスです。

この画像に対して「海で走る白と黒のMarinelleのモーターボートを運転する男性とそれを眺めている女性」というalt属性を設定するのは、無理に情報を詰め込みすぎて逆にわかりづらくなってしまいます。

では逆にこの画像に対して「ボート」とだけalt属性を設定するのもSEOにおいて適切とは言えません。

ボートの画像ということはすぐにわかりますが、そのボートはゴムボートなのか、あひるボートなのか、競艇用のボートなのかといった情報は伝わりません。

なのでこの画像において適切なalt属性の代替えテキストは「海でモーターボートに乗る2人組の男女」ほどの情報量ということになります。

ただし、SEOにおいてalt属性に設定する代替えテキストの正解は無数にありますので、あくまでユーザーに伝わりやすいalt属性を設定しましょう。

グラフやフローチャートなどについても、そのグラフやチャートで伝えたいことをなるべくテキストに起こして本文にしておくことで「〇〇の〇〇に関するグラフ、詳細は本文で」といったalt属性の使い方も可能です。