Webページ上に画像を設置する際、何もしないとクローラーは「画像」であることは認識できても、「何の画像か」までは判別できません。
そこで役立つのがalt属性（altタグ）です。alt属性を付与することで、画像に「説明文」を付けることができ、クローラーにその画像の意味を伝えることができます。
このページでは、alt属性がSEOにどのような影響を与えるか、その重要性と正しい使い方を解説します。
インターネット検索をし、出てくるWebページを見ていると綺麗な画像を挿入しているものの、alt属性が付いていないものをちらほら目にします。
このページを読んで、自社サイトに設置している画像に意味を与え、SEO対策を進めましょう。
この記事でわかること
動画でわかるalt属性の全体像
記事の要点を先に動画で掴みたい方は、以下をご覧ください。(動画をクリックすると音声が出ます)
alt属性とは
alt属性（altタグ）とは、Webページ内に画像を表示させる際、その画像に関する説明をテキストで付与させられる属性タグです。
altタグで指定したテキストは、使っているブラウザやインターネット環境によって画像が表示できない場合、代替テキストとして表示されます。
検索エンジンのクローラーは、imgタグから「画像」であることは認識できるものの、どのような画像かを理解するのは得意ではありません。しかし、altタグを設定しておけば、クローラーに画像の内容をテキストで伝えることができます。
titleタグとの違いについて
HTMLでページ内に画像を挿入する際は、imgタグを使用します。imgタグの中にはalt属性タグとtitle属性タグ、両方を利用できるのですが、この2つは何が違うのでしょうか？
alt属性は上記でもお伝えしましたが、「画像が表示されない場合の代替テキストになる、画像に関する説明文」として判別されます。一方、title属性は画像以外にも使える属性で、「情報を補足する」ために使われます。
例えば、というHTMLタグをページ内に設置したとします。
ブラウザが問題なく画像を表示できている状態で画像にカーソルを合わせると、titleタグに入力した「ある日の山の風景」というコメントが表示されます。画像が表示されている状態だと、altタグで入力した代替テキストは表示されません。
一方で、ブラウザやインターネット環境によって画像が表示されない場合には、altタグで指定したテキストが表示されます。
titleタグにはヘッダー内に使う「ページタイトル（～）」のためのものと、上記に紹介した「各要素の補足情報を表示させるもの（要素内にtitle=""として記述）」の2つがあるので、使い方を間違えないようにしましょう。
alt属性の重要性、その役割について
画像にalt属性を与えることで得られる、2つの機能を詳しく説明します。
画像が表示されない場合の代替テキスト
ページ内の画像にaltタグを設置しておけば、使用しているブラウザやインターネット環境の不具合で画像が表示されない場合に、指定した代替テキストが表示されます。
そもそも、ページ内に画像を設置するのは、ユーザーがコンテンツを読む際に、想像しやすく情報を理解してもらいやすくするためです。
しかし、altタグを設定していない状態で、画像が表示されなければ、そこに何があるのかユーザーには伝わりません。
代替テキストとなるaltタグを設置することで、インターネット環境により画像が表示されない場合、ユーザーにどのような画像を見てもらいたかったか知らせることができるという重要な役割を果たします。
検索エンジンに「どのような」画像か理解してもらう
Webページ内に画像を設置する場合、検索エンジンのクローラーはimgタグから画像があることは分かるものの、altタグを設置していなければ、「どのような画像」なのかまでは理解できません。
alt属性を与えることで、クローラーは画像が何に関するものなのか、テキストから情報を読み取れます。
altタグには、検索エンジンのデータベースにより正しくページ情報をインデックスしてもらうという重要な役割があることを覚えておきましょう。
SEO対策におけるalt属性の役割
画像にalt属性を与えると、上記にご紹介した2つの役割に加え、SEO効果も期待できます。
altタグにキーワードが含めておくと「画像検索」された際に上位表示される可能性があり、Webページそのものに良いSEO効果を与えられます。
画像を挿入する際、altタグの役割を知らずそのまま未入力にしてしまうのは非常にもったいないです。必ずaltタグを設置するようにしましょう。
alt属性の正しい設定方法
alt属性を付与することは、ユーザーとクローラーの両方に役立ち、さらにSEO効果もあることをお伝えしました。そのalt属性は、どのように設定すれば良いのでしょうか？正しい設定方法をご紹介します。
HTMLで記述する場合
ページ内に画像を挿入し、altタグを設定する場合は、以下を記述します。
「代替テキスト」部分に、「画像を簡単に説明するフレーズ」を入力します。
WordPressで設定する場合
サイト運用のCMSとしてWordPressを使っている場合、画像のaltタグは「メディアの追加」から設定できます。
画像を挿入したい箇所を選んでメディアの追加を選択し、希望の画像を選びます。その際、画像の詳細情報として代替テキスト（alt属性）やタイトル（タイトル属性）を入力できます。
それぞれに適したテキストを挿入しておきましょう。
alt属性の確認方法について
alt属性を設定した後、正しく設定できているか確認する方法をご紹介します。
インターネットブラウザにChromeを使用し、デベロッパーツールを利用することで確認できます。
Chromeでaltタグを設定したページを開き、デベロッパーツールを表示させます（Windows OSならF12、またはCtrl＋Shift＋I、Mac OSの場合はoption+command+Iを押します）。
表示されたソースコードから、該当するaltタグを設定した要素を選び、alt="〇〇"が設定されているか、確認しましょう。
alt属性は、スマートフォンやパソコンでご利用になっているインターネットブラウザによっては表示されないこともあることを、あらかじめ知っておきましょう。
alt属性とアクセシビリティ
alt属性はSEOだけでなく、Webアクセシビリティの観点でも欠かせない設定です。視覚に障害のあるユーザーがスクリーンリーダー（音声読み上げソフト）を使ってページを閲覧する場合、画像のalt属性に設定されたテキストが読み上げられ、画像の内容が音声で伝わります。altが未設定だとファイル名がそのまま読み上げられることがあり、ユーザー体験を大きく損ねます。
装飾画像にはalt=""（空のalt）を設定する
すべての画像にaltテキストを入れればよいわけではありません。罫線やアイコンなど、情報を持たない装飾目的の画像には、alt=""（空のalt属性）を設定するのが適切です。空のaltを指定すると、スクリーンリーダーはその画像を読み飛ばし、本文の流れを妨げません。altそのものを省略するのとは異なり、「この画像には説明が不要」と明示する意味があります。
2026年時点のアクセシビリティ基準
2026年現在、Webアクセシビリティの国際基準であるWCAG（Web Content Accessibility Guidelines）2.2では、テキスト以外のコンテンツには代替テキストを提供することが求められています。日本でも2024年4月施行の改正障害者差別解消法により、民間事業者のWebアクセシビリティ対応への関心が高まっています。alt属性の設定は、法令対応の第一歩としても重要です。
alt属性の注意点
altタグを設定する際に、注意したいのがテキストの書き方です。
どのようなテキストを選べば良いのか、ポイントをご紹介します。
キーワードを詰め込み過ぎない
altタグで設定する代替テキストには、対策キーワードや関連キーワードを入れるとSEO効果があります。しかし、「SEO効果がある」と書くと、キーワードを詰め込み過ぎてしまう方が少なくありません。
altタグに設定するテキストは、キーワードを優先するのではなく、画像の説明であることが大切です。
やってしまいがちな失敗が、キーワードを詰め込みすぎて意味の分からいテキストになってしまうことです。
画像の説明であることが前提で分かりやすく、かつ、対策キーワードや関連キーワードを入れられる場合のみ、挿入しましょう。
画像と関係のない言葉を入力しない
上記に説明させていただいた通り、altタグにキーワードを入れることでSEO効果が期待できます。
しかし、画像と関係のないキーワードを入れても意味がありません。どのような画像なのか、理解できるフレーズを選ぶことが重要です。
コンテンツは、対策キーワードを決め、ユーザーの検索意図を分析して作成します。挿入する画像も、必然的にキーワードに関係したものになるはずです。
altタグ内のテキストに無理やり画像とは関係のない言葉を入れる必要はなく、画像を説明する自然な文章を作成すれば、対策キーワードや関連キーワードが含まれることでしょう。
画像リンクの場合はリンク先ページの情報を記載する
画像をコンテンツ内に設置し、他のページへのリンクボタンとして使う場合、altタグのテキストにはリンク先ページを説明するものを選びます。
altタグには、リンク先ページのタイトルや、要点を含んだ分かりやすいテキストを入れておきましょう。
コンバージョンにつながる資料請求や、問い合わせページへのリンクの場合、altタグ内のテキストとテキストの両方にこだわり、ユーザーがクリックしたくなるような、ボタンや画像を作りを心がけましょう。
当社EXIDEAが考えるalt属性運用の基本方針
当社では、alt属性は「SEO目的の文字列」ではなく、アクセシビリティと検索エンジンの両方に画像内容を伝える説明文として位置付けています。スクリーンリーダーを使う読者、ブラウザの設定で画像読み込みを切っている読者、画像配信エラーが起きたときの読者——すべてのユーザーに対してページの意味が壊れない状態を作ることが、結果的にSEO評価にもつながります。
運用の基本動作は3つです。1つ目は、装飾画像と意味のある画像を分けること。アイコンや背景装飾のように、文章を補強しない画像はalt=""（空alt）にし、スクリーンリーダーが読み飛ばせるようにします。意味のある画像にだけ、内容を1〜2文で説明する。
2つ目は、画像の文脈に合わせて説明文を変えること。同じ「グラフ画像」でも、本文で数字を解説しているなら「2024年の検索流入推移グラフ」のように対象を伝えるだけで十分。グラフ画像が単独で意味を持つ場面なら「2024年1月から12月にかけて検索流入が約2倍に伸びたことを示すグラフ」のように、結論まで含める。同じ画像でも文脈で適正な説明文は変わります。
3つ目は、キーワードを無理に詰め込まないこと。alt属性のキーワード詰め込みは過去のSEOテクニックとして有名ですが、Googleの公式ガイダンスでは「画像の内容を正確に説明すること」が重要だと明示されています。画像と関係のないキーワードを入れると、かえってスパム判定のリスクが上がります。当社では、画像を説明する自然な日本語の中に、文脈が合うときだけ対策キーワードを織り込むようにしています。
よくある質問
altタグはすべての画像に入れるべきですか？
意味のある画像（コンテンツの理解に必要な画像）には必ずalt属性を入れます。装飾目的の画像（背景・飾り・スペーサーなど、文章の理解に影響しないもの）は、alt=""（空alt）に設定するのが推奨です。空altにすることで、スクリーンリーダーが装飾画像を読み飛ばせるため、視覚障害のあるユーザーの読書体験を損ねません。
altタグにキーワードを入れると順位は上がりますか？
キーワードを画像内容に沿って自然に含めるのは有効ですが、無理に詰め込むのは逆効果です。Googleの公式ガイダンスでも「キーワードの詰め込みはランキングに役立たないどころか、ユーザー体験を損なうため避けるべき」と明示されています。画像を正確に説明する文章を書き、その中で文脈が合えばキーワードを入れる、という順番が重要です。
altタグは何文字くらいで書くのが適切ですか？
明確な文字数の規定はありませんが、目安としては10〜80文字程度の自然な日本語が適切です。スクリーンリーダーは長すぎるalt文を読み上げると聴き手に負担がかかるため、画像の意味が伝わる必要最小限の説明にとどめるのが基本です。図表や複雑な画像で長文の説明が必要な場合は、本文中で別途解説する方法を検討してください。
画像内の文字をそのままaltタグに書けばよいですか？
画像内に意味のあるテキスト（バナーのキャッチコピー、図表の見出しなど）が含まれている場合は、そのテキストをaltに書くのが基本です。ただし、画像内の装飾的な文字や、本文で同じ内容を記載している場合は、altで重複させる必要はありません。画像の役割と本文との関係を見て判断します。
WordPressで設定したaltタグが反映されないことはありますか？
テーマやプラグインの実装によって、メディアライブラリで設定したalt属性が出力されないケースがあります。Chromeのデベロッパーツール（F12）で該当のimgタグのalt属性が出力されているか確認してください。出力されていない場合は、テーマのテンプレートファイルやブロックエディタの設定を確認するか、HTMLビューで直接alt属性を追記する方法が確実です。
まとめ
コンテンツ内の画像に、alt属性を設定する重要性と、正しい設定方法について解説しました。
alt属性を設定しておけば、インターネット環境で画像が表示されない場合に代替テキストを表示し、クローラーには画像の「説明文」を伝えることで正しくWebページをインデックスしてもらえます。
また、説明文にキーワードを入れておくことで、画像検索された際に上位表示される可能性もあり、SEO効果も期待できます。
すでにコンテンツをいくつか作成し、画像を挿入しているものの、alt属性を知らず何も設定していないのであれば、alt属性を付与しましょう。
コンテンツSEOでもやってしまいがちなことですが、altタグ内のテキストにキーワードを詰め込むのはNGです、くれぐれもご注意ください。
また、alt属性を与える画像と説明文の内容がマッチしていないければ意味がありません。画像がどのようなものか説明するフレーズで、可能な場合に限りキーワードを入れるよう意識しましょう。
自社サイト内を見直し、画像にalt属性を付与する際は、この記事で紹介した内容を踏まえ、適切なテキストを選ぶようにしましょう。
そのほか、SEOで重要なHTMLタグについては以下のページで詳しく解説しているので、ぜひ、ご一読ください。
