- SEO対策でじぶんたちでもできることを探している！
- WordPressにログインして、管理画面上で操作が可能な設定について検索していた！
- 画像のalt属性とは何かを知りたい！
こんなお悩みがありましたら、株式会社クロコにご相談ください。
Webサイトにおける画像や資料（データ）を開示するのが当たり前になりました。
では、普段見慣れているサイトやブログをSEO対策の目線で見るとどうなるのでしょうか？
今回の記事では、画像のALT属性の特徴や書き方をわかりやすく解説します。
alt属性とは
alt属性とは、HTMLとXHTMLで使われているHTML属性の一つです。
HTML要素が表示できない時に、レンダリングされるテキストを指定する時に使います。
わかりやすく言えば、img要素の中に記述される画像の代替となるテキスト情報のことです。
具体的には、テキストブラウザや音声読み上げブラウザで、写真を表示させる際、その画像の代替テキストを指定するための属性です。
alt属性の効果【メリット】
alt属性を記述するメリットを解説します。
alt属性を適切に記述することで、検索エンジン、ユーザー両者に優しいサイトに一歩近づきます。
Googleの掲げる「ユーザーファ―スト」の条件を一つでも多く満たすことで、検索順位を上位に表示させやすくします。
検索エンジンへの効果
検索エンジンのAIには、画像を解析する能力は備わっていません。
簡単に言えば、白紙のimgファイルが存在している状態です。
つまり、コンテンツを検索エンジンがクロールする際に、どんな画像なのかを適切に知らせることが可能になります。
検索ユーザーへのメリット
ではalt属性は、検索しているユーザーにとっては、どんなメリットがあるのでしょうか？
一般的には、視覚障害をお持ちの方や高齢者向けに音声読み上げ機能を利用する際に役立ちます。
alt属性を適切に配置することで、ユーザーにとっても、その画像が何を意味するのかを伝えることが可能になります。
alt属性とtitle属性の違い
alt属性と間違えてしまう専門用語の一つが、title属性です。
title属性とは
title属性とは、要素に補足情報を設定するための属性です。
上記の文章を読むと、altと同じだと思われてしまうことがあります。
title属性の使い方
対応している種類が異なります。
altは、画像以外には設定できません。
titleは、画像以外にもテキストなどすべての要素に対して設定を行うことが可能になります。
SEO対策の支援が必要な方は、お気軽にご相談ください。
alt属性の記述方法【書き方】
alt属性を探す際には、imgファイルを探しましょう。
<img src=”画像のURL” alt=”画像の説明”＞
上記のHTMLの記述を探してみましょう。
上からすべてを見ていく必要はありません。
Windowsのパソコンであれば、｢Ctrl」+Fを押すことで、小窓に「alt」と入力し、エンターすることで、検索が可能です。
alt属性のテキストに何を書く？
alt属性の本来の目的は、通信環境などの影響により、画像が表示されない場合や画像を認識するのが困難なユーザー向けに、画像内容を届けることです。
つまり、画像を見なくても、その画像が示している内容を記述することが大切です。
例えば、「青い空」をイメージしていただきたいのであれば、「東京の青い空」など参考にした画像の場所や内容を記述してあげるとわかりやすくなります。
他にも、「セミナー」「スクール」「体験会」など、シーンを撮影した時の光景を思い浮かべることが可能なテキストを入れてあげると親切です。
alt属性テキスト入力時の注意点
いくら、説明したいことがあっても、長い文章にするのは、避けましょう。
なぜなら、画像内容に沿ったテキストとはいえ、間接的な情報ですから、必要最低限の情報にとどめておくことが大切です。
装飾目的の場合の対処法
alt属性を記述しないという選択肢もあります。
具体的には、「文章の間にあるだけで、画像には、特別な意味が何もない時」です。
具体的には、大見出しの下に、文章ばかりでは、目が疲れることを考慮して貼り付けた画像には、特別な意味もありません。
よって、alt=”話が切り替わります”などでもかまいませんが、特別な意味を含める必要はありません。
見出しやリンクに使われている画像
バナー広告やサイト内で目立つ位置に資料請求などの案内用に画像を利用している企業のホームページも増えました。
こうした時には、titleタグの他にも、hタグ、aタグなどさまざまな要素が含まれています。
中でも、画像がリンク先に誘導するための配置であれば、別のページに飛びます等の解説を入れておくことも大切です。
alt属性が表示されない時の対処法
記述したはずなのに、反映されません。
このような時には、確認していただきたいことがあります。
閲覧している環境に注目
スマートフォン、IE8やIE11のブラウザを使用している場合には、表示されないようになっていますので、反映されないのは仕様です。
alt属性の無料添削サービス実施中
自社メディアや公式サイト、LPなどさまざまなサイト運営を行っていると、どのページにどの程度のaltが記述されているのかわからなくなってしまうこともあります。
弊社では、まずは現状分析を行います。
その中で、設定が完了していない画像のHTMＬを共有させていただくことで、記述漏れを防ぐ対策を実施しております。
Webに関する情報をこれからも色々発信してまいりますので、これからも興味がある方は、他の記事もご覧ください。
弊社では、Web制作だけではなく、システム開発や設計、動画制作、アプリ開発なども行っております。
広告運用やWeb制作のみではありませんので、お気軽にご相談ください。