Alt属性を書こう

マークアップエンジニアやフロントエンドエンジニアの方であれば、alt属性が何を表すのかはご存知だと思います。しかし、HTMLを勉強された経験がないと、「alt属性って、何ですか？」という疑問が出ると思います。今回は、alt属性について、解説していきたいと思います。

alt属性の基礎知識

「オルトぞくせい」と読みます。
このalt属性というのは、ホームページ上に画像を埋め込む際に利用されます。具体的に説明すれば、img要素の中に記述される画像の代替テキストだということです。何のための代替かというと、テキストブラウザや音声読み上げブラウザでは、画像は表示されません。そこで、altに記述された内容がテキストとして表示されたり、読み上げられたりします。

altを書くことのメリットとSEO効果とは？

では、altを書くことでどんなメリットがあるのでしょうか。また、SEOには効果があるのでしょうか。

1. 何かしらの理由によって画像表示ができない場合、文字を表示する
   インターネットで情報を閲覧している際に、画像が表示されていないページを見かけることはないでしょうか？小さな四角が画面に表示されているため、多くの方がここにしっかりとした画像があったのだなと認識できると思います。このとき、alt属性で設定していると、どのような画像があったのか文字を表示してくれます。そのため、訪問者に画像を表示することができなかったとしても、どんな画像が掲載されていたのか認識してもらうことができます。
2. アンカーテキストのように扱われる
   ホームページを運用していれば、画像からリンクを張ることがあるでしょう。alt属性を利用し、リンクを張ることで画像のaltテキストがリンクに対するアンカーテキストとして表示されます。そのため、リンク先が分かるように明示しておくことで、訪問者にとって、分かりやすい運用ができるようになるでしょう。alt属性を利用した、運用を行うことで、ページ内を上手く訪問者が循環してくれると言えるのではないでしょうか。
3. Googleに画像サイトだと認識してもらえる
   alt属性を有効に利用すれば、画像を利用しているサイトだとGoogleに認識してもらうことができます。これを利用すれば、画像検索によって、訪問者が来る可能性があります。あなたも画像検索を1度利用した経験があるのではないでしょうか？例えば、「シャープペンシル」と検索すると、シャープペンシルの画像が出ると思います。その画像の1枚をクリックしてみてください。その画像が掲載されているページに移動するでしょう。これが、alt属性の効果です。alt属性を利用すれば、画像検索によってアクセスを伸ばすことができます。これは、SEO効果として、最も分かりやすい事例ではないでしょうか。

alt属性と検索順位について

alt属性を利用することで、直接SEOに効果が出るかというと、必ずしもそうではありません。なので、altをたくさん書いたからといって検索順位が上がるということはほとんど無いでしょう。逆にaltにキーワードを繰り返し記述したりすることでスパムと判断される可能性があります。しかし、正しく記述すれば検索エンジンに対してホームページの情報を正しく伝える事が出来るので、そうした事で間接的にSEO効果が現れるでしょう。

alt属性の書き方について
alt属性には、正しい書き方というものが存在します。何でも書けば良いというわけではなく、基本的なルールがありますので、そのルールに従って記述していきましょう。

• キーワードをたくさん入力したり、文章をコピーして貼り付けたりするようなことは、してはいけない。
• 非常に長いaltテキストを作成してはいけない。（15文字前後で作成する）
• テキストリンクのアンカーテキストを書くイメージで、作成すると上手く書ける。
• 意味のない画像に関しては、空白でも問題ない。

良い例
＜img src=”puppy.jpg” alt=”ボランティアで譲ってもらった柴犬の子犬”＞

alt属性評価チェックツールを利用してみる

alt属性が正しく利用できているか確認したいという方もいるでしょう。そのような方は、チェックツールを利用すれば、alt属性を評価することができます。自分で作成したサイトを確認してみると良いでしょう。
http://seolaboratory.jp/alt/

最後に

普段からhtmlを記述する人でなければ、alt属性を自分で書くという経験がないかもしれません。しかしながら、これらのことを基礎的な知識として覚えておくと、よりアクセシビリティに優れた良いホームページになるでしょう。