- 更新日:2024.11.07
- 投稿日:2024.11.07
【初心者向け】altタグはSEOに有利!設定方法や注意点なども解説
今回紹介するのが、alt(オルト)タグです。画像に代替テキストの設定を行うことで、「何の画像なのか」が読者だけでなく検索エンジンにも伝わるので良い評価を期待できます。
HTMLを少し変えるので、設定方法が難しく感じてしまうかもしれませんが、非常に簡単な内容なので誰でも設定可能です。注意点なども一緒に解説していくので記事を上位表示させるために、是非活用してください。
altタグについて
altタグとは、検索したページの画像が何かの原因で読み込めない時に表示させる代替テキストです。altタグを設定しなくてもWeb上で画像を載せることはできますが、表示されていない時、ユーザーに画像の意味が伝わらなければ意味がありません。webサイトの画像が見れない理由はいくつかあります。
- ・ネット環境の関係で画像だけ表示されない
- ・スマホの速度制限が来ていて画像だけ表示されない
- ・視覚障害で画面を見ることができない
このような悩みはあるユーザーに対してaltタグの設定を行うことで解決できます。画像が表示されなくて困っているユーザーの悩みを解決できる重要な設定でもあり、検索エンジンにも評価されるので画像をWeb上に載せる時にはaltタグの設定をおすすめします。
altタグとtitleタグの違い
altタグとTitleタグの違いは以下になります。
altタグ | titleタグ |
---|---|
web上の画像を読者や検索エンジンに分かりやすく伝えるために簡単なキーワードを記載する | web上の画像を読者に分かりやすく伝える為に補足するような文章を追加する |
titleタグの設定をした場合、画像にマウスカーソルを当てると画像の意味を補足する文章が出てきます。たとえば、犬と散歩している様子の画像が貼ってある場合は「犬と一緒に散歩している」のような感じでツールチップが表示されます。
画像が表示されている時にはtitleタグで内容を補足することができ、何らかの原因で画像が表示されない場合はaltタグの代替テキストが読者を満足させます。
altタグの設定方法
alttタグの設定方法には2つの方法があります。
- ・HTMLでの設定
- ・WordPressでの設定
どちらの設定方法も簡単にできるので難しい作業はありません。HTMLとWordPressの設定方法をそれぞれ紹介します。
HTMLでの設定方法
HTMLで設定する場合には、以下のように記述します。
<img src=”載せる画像のURL” alt=”画像の代替テキスト”> |
「alt=”画像の説明テキスト”」の部分がaltタグの部分になります。設定する際に別の場所を変更させてしまったり、説明のテキストが画像にふさわしくない文だと検索エンジンに間違った情報を与えてしまうので注意が必要です。以下のような代替テキストであれば、検索エンジンに正しい画像の情報を伝えられます。
<img src=”載せる画像のURL” alt=”エプロンを付けた主婦が座ってパソコンを操作している”> |
画像が表示されていない状況でも、文字だけで頭の中で画像が想像できる文章を考えることが大切です。
WordPressでの設定方法
WordPressで設定する場合には、以下のように記述します。
WordPressの場合は、画像を載せる際に「代替テキスト」という項目が出てきます。こちらがaltタグの設定になるので「エプロンを付けた主婦が座ってパソコンを操作している」と入力すれば設定完了です。
altタグの注意点
altタグの設定を行うときの注意点は以下の5つです。
- ・分かりやすく記載する
- ・文章が長くなりすぎないようにする
- ・altタグはモバイル用にも設定する
- ・altタグを設定した方がいい場合
正しく設定されていないとSEOに不利になることもあるので注意が必要です。
それぞれ解説します。
分かりやすく記載する
altタグの設定を分かりやすい文章やキーワードにすることで、検索エンジンのクローラーに見つけられやすくなります。
検索エンジンのクローラーとは |
---|
検索エンジンがweb上の情報を収集するためのロボットのことを「クローラー」といいます。世界中のデータが検索エンジンに保管されており、クローラーが読者に最適な検索結果を選びます。 |
大切なのは、「この画像が何の画像なのか」を短い言葉で伝えることが大切です。読者に向けて文やキーワードを設定するのもいいですが、検索エンジンのクローラーに評価されるための対策の一つとして、altのタグは分かりやすく記載することをおすすめします。具体的には以下のような表現を意識することが大切です。
- ・見た目や服装の表現
- ・画像に人物が写っている場合、表情や感情
- ・人数や個数
- ・どんな表情をしているか
読者に画像を見せていない状態で、どのような表現をしたら伝わるかを考えながら記載することが重要です。
文字が長くなりすぎないようにする
画像を分かりやすく伝えるために文章を長くしたり、キーワードを多く入れてしまうのはおすすめしません。読者や検査エンジンに悪影響を及ぼす可能性があります。
最悪の場合、キーワードを詰め込みすぎてしまうとSEOスパムになってしまうので乱用するのは控えることをおすすめします。スパム報告されるとブログサイトは上位表示されにくくなってしまいます。
キーワードの乱用とは、Google検索結果のランキングを操作する目的で、ウェブページにキーワードや数字を詰め込むことです。キーワード乱用では、不自然にリストやグループの形式を使ったり、関連性のない場所でキーワードが記載されたりする傾向があります。
上記の画像でalt設定を行う際に、SEOスパムに引っかからない良い例と悪い例を紹介します。
良い例 | 悪い例 |
---|---|
自宅で家族が笑顔で笑っている | 家族、家、自宅、祖父、祖母、父、母、娘、息子、用事、ソファー、椅子、服、電気 |
短いキーワードや文章で伝えることで、読者や検索エンジンに評価されます。SEOを意識しすぎて、画像からの情報を全てキーワードにしてしまうのはキーワードの乱用と判断されてしまうので注意が必要です。具体的な文字数はありませんが、できるだけ少ない文字数で記載することをおすすめします。
altタグはモバイル用にも設定する
PC用ページのaltタグの設定は行いますが、モバイル用の設定をしていない方が多いです。検索時の端末はPCよりも圧倒的にスマホの方が多く、Googleはモバイル用のページを優先しています。
モバイル用のページでalt設定をすることで、Googleから読者へ分かりやすい記事と判断されて上位表示される可能性があります。運営しているサイトがモバイル用のalt設定がされていない場合は設定することをおすすめします。
altタグを設定した方がいい場合
タイトルや見出し部分と画像の意味が一緒の場合、altタグの設定をすることをおすすめします。altタグの設定をすることで画像からタイトルや見出しの内容を理解でき、読者は記事を理解しやすくなります。
altタグの設定をしなくてもいい場合は、装飾目的の画像です。装飾目的の画像はコンテンツとして意味をもっていないのでaltタグの設定は行わず、空白のままで大丈夫です。
altタグによるSEO効果
altタグの設定を行うことでSEO効果はあります。
SEOの本質 |
---|
読者の悩みを解決できるサイトであるかが大切です。altタグの設定を行うだけでは、読者は満足できません。ただ、画像が表示されない状況やテキストを読むことができない方には喜ばれる機能です。一つの設定でも読者のためにWebサイトを作成することが大切です。 |
画像にaltタグの設定を行うことで、どのような効果が期待できるのかをそれぞれ紹介します。
ネット環境が悪い場所でも画像の内容を伝えられる
人が多くて電波の調子が悪かったり、コンクリートで囲われている部屋などはネット環境があまりよくありません。ネット環境が悪い場所では、ウェブ上の画像を表示させるためにデータ容量を使いますが、なかなか表示させることは難しいです。
しかし、ネット環境が悪い場所でもaitタグの設定をしていれば問題ありません。画像が表示されていなくても記載してある文字が代わりに表示されます。画像が表示されていなくても、意味が分かるだけで読者にも満足してもらうことで検索順位が上がる可能性は十分にあります。
音声で読み上げる機能がある
視覚障害の方や高齢者はweb上の文章を読むのが困難なので、音声で記事を読み上げる機能を使用することがあります。記事のテキストは全て読み上げてくれるので読者は理解できますが、画像は読み上げ機能に対応していません。画像部分はスキップされるか、ファイル名を音声で読み上げてしまい読者を混乱させてしまいます。
ただ、alt設定を行っている場合は代替テキストが音声で読み上げてくれます。音声で記事を読んでいる方にも、何の画像が貼ってあるのかを伝えることができます。画像にalt設定を行っていないと画像は音声で読まれることないので、音声の読み上げ機能を使って記事を読んでいる方には画像を伝えることができません。
検索エンジンのクローラーに画像内容を伝えられる
altタグの設定を行うことで、検索エンジンのクローラーに画像の内容を伝えられます。本来のクローラーは、テキストの内容を理解することはできても画像の理解はできません。
検索エンジンのクローラーに画像の内容を伝えることでSEO対策にもなります。正しいキーワードや文を記載することで検索順位表示を十分に狙えます。
画像検索で表示されてWebサイトへ誘導ができる
検索エンジンは画像の解析が得意ではないので、画像から分かるテキスト、画像のファイル、見出し、説明文など複数の情報がなければ画像の内容を正確に認識できません。
そこで、altタグの設定を行うことで検索エンジンは画像の内容を正確に理解します。読者がキーワードを打ち込んで画像検索する場合、検索エンジンが最適な画像を提供するので表示された画像からWebサイトへ誘導することも可能です。
アンカーテキストとして判断される
altタグの設定をしていると検索エンジンから、アンカーテキストと判断されるので評価されます。
アンカーテキストとは |
---|
リンクが設定してある文字の事です。ユーザーを別のサイトへ誘導したり、引用したサイトにすぐ移動できるように使われることもあります。 |
アンカーテキストの例は「プロ野球速報」のように文字が水色っぽくなっており、クリックすることで別のサイトへ移動できます。これは、テキストの中にURLが埋め込まれているので別のサイトに飛べるようになっています。読者は検索する手間が減るのでwebサイトに長く滞在してもらう重要な設定です。
このように、altタグがアンカーテキストと判断されることで検索エンジンは重要なキーワードと認識します。上手くキーワードを使いこなせば、検索上位に向上させることも可能です。
まとめ
altタグの設定を行うことで、画像が読み取れない方や視覚障害の方にも何の画像がweb上にあるのかを伝えられます。読者だけでなく検索エンジンにも画像の内容が伝わるため、読者が求めている最適な画像として表示される可能性も出てきます。
ただ、altタグの設定は全ての画像にする必要はありません。タイトルや見出しと意味が一致する画像のみになります。全ての画像にキーワードや文字の乱用をしてしまうとスパムになりかねないので注意が必要です。
記事を上位表示させるためには、様々な対策が必要です。今回紹介したaltタグも読者に対してだけでなく、検索エンジンにも画像の内容を伝えられるのでSEO対策の一つと言えます。
この記事のタグ
この記事の監修者
-
H.I|株式会社PIA全日本SEO協会・SEO検定1級保持者。最近筋トレをはじめました!