ALT属性とは｜SEO・画像検索・アクセシビリティとの関係を解説

ALT属性は画像の内容を伝える大切な情報

Webサイトに画像を掲載するとき、画像そのものはきれいに表示されていても、「その画像が何を表しているのか」という情報が十分に伝わっていない場合があります。そこで確認しておきたいのが「ALT属性」です。

ALT属性は、画像の内容をテキストで伝えるために設定するHTML属性です。「代替テキスト」と呼ばれることもあります。WordPressを利用している場合は、画像をアップロードしたときに表示される「代替テキスト」の欄に入力した内容が、基本的にALT属性として使われます。普段のWebページではALT属性の内容がそのまま画面に表示されることは少ないため、設定していなくても気づきにくい項目です。しかし、SEOやアクセシビリティを考えるうえでは、画像の内容に合わせて設定しておきたい情報です。

ALT属性はSEOキーワードを入れる場所ではない

ALT属性という言葉をSEOの情報として知った方のなかには、「検索キーワードを入れておけばSEOに有利になる」と考えてしまう方もいるかもしれません。ただし、ALT属性の本来の目的は、検索したいキーワードを並べることではありません。画像が何を表しているのかを、ユーザーや検索エンジンに分かりやすく伝えることです。

たとえば、ゴールデンレトリーバーの子犬が遊んでいる写真であれば、「ゴールデンレトリーバーの子犬」や、画像の内容に応じて「ボールで遊ぶゴールデンレトリーバーの子犬」などと記述できます。カフェの店内写真であれば「木製テーブルが並ぶカフェの店内」、商品画像であれば「黒色のワイヤレスイヤホン本体と充電ケース」、料理の写真であれば「トマトとモッツァレラチーズを使ったマルゲリータピザ」のように、何が写っているのかを具体的に説明できます。

反対に、「犬 子犬 ペット ゴールデンレトリーバー ドッグフード 犬用品」といった形で検索されそうな単語を並べても、画像の説明としては分かりにくくなります。ALT属性を設定するときは、検索順位だけを意識するのではなく、その画像を見ていない人にも内容が伝わるかどうかを考えることが大切です。

Googleは画像理解に代替テキストを利用

Googleは、画像の周辺にある文章やページの内容、画像ファイル名、コンピュータービジョンなど、複数の情報を使って画像のテーマを理解しています。そのなかでも、ALT属性に設定する代替テキストは、画像について追加の情報を伝える重要な要素です。

そのため、ALT属性を設定しただけで検索順位が上がると考えるのではなく、「画像が何を表しているのかを検索エンジンへ伝えるための情報」と考えるほうが分かりやすいと思います。画像とページ本文の内容が一致していて、そのうえで画像に適切なALT属性が設定されていれば、検索エンジンがページと画像の関係を把握しやすくなります。

ALT属性は画像検索からの流入にも関係する

通常のGoogle検索だけでなく、Google画像検索を利用して情報を探すユーザーもいます。商品、観光地、料理、住宅、ファッション、人物、操作方法、図解などは、文章だけでなく画像を見ながら探したいケースが多い分野です。

Googleは、画像が掲載されているページの内容や画像周辺のテキスト、ファイル名、ALT属性などを参考にして画像について理解します。そのため、画像検索を意識する場合も、画像の内容に合ったALT属性を設定することが基本です。ここでも、不自然に検索キーワードを増やす必要はありません。画像と関係のある内容を、具体的で分かりやすい文章にすることが重要です。

ALT属性はアクセシビリティにも重要

ALT属性はSEOだけの設定ではありません。Webサイトを利用する方のなかには、スクリーンリーダーなどの音声読み上げ機能を利用している方もいます。画像を直接確認することが難しい場合、ALT属性に設定された代替テキストが画像の内容を理解するための情報として利用されます。

たとえば、売上の推移を示したグラフが掲載されていても、ALT属性が設定されていなければ、画像を確認できないユーザーには内容が伝わりにくくなります。「2025年から2026年までの月別売上推移を示したグラフ」のように、画像の役割が分かる代替テキストが設定されていれば、どのような情報が掲載されているのかを把握しやすくなります。通信環境などの影響で画像が正常に読み込まれない場合にも、ALT属性は画像の内容を補う情報として役立ちます。

図解やグラフにも内容に合ったALT属性を設定

ブログやオウンドメディアでは、本文だけでなく、図解やグラフを使って内容を説明する機会も多いと思います。このような画像は、単なる装飾ではなく、本文の内容を補足する情報として使われています。そのため、画像の意味が分かるALT属性を設定しておくことが大切です。

たとえば、検索順位の変化を示すグラフであれば、単に「グラフ」と書くのではなく、「SEO施策実施前後の検索順位推移」のようにすると、何を示しているのかが分かります。アクセス数のグラフなら「2026年1月から8月までの月間アクセス数推移」、流入元を示す円グラフなら「Webサイト流入元の割合を示した円グラフ」のような設定が考えられます。

操作画面のスクリーンショットにも同じ考え方が使えます。「スクリーンショット」だけではなく、「WordPressの画像設定画面にある代替テキスト入力欄」「Google Search Consoleの検索パフォーマンス画面」のように、どの画面の何を示しているのかが分かる内容にします。ただし、画像内の文章をすべてALT属性へ書き写せばよいわけではありません。画像の役割を考え、必要な情報を分かりやすく伝えることが基本です。

商品画像は写真ごとにALT属性を変える

ECサイトでは、同じ商品について複数の画像を掲載するケースがあります。その場合、すべての画像に同じALT属性を設定するのではなく、それぞれの画像が何を見せているのかに合わせて内容を変える方法があります。

たとえば、白いスニーカーの商品ページなら、正面から撮影した画像には「白いレザースニーカーの正面」、横から撮影した画像には「白いレザースニーカーの側面」、靴底を見せている画像には「白いレザースニーカーの靴底」のように設定できます。バッグであれば、「黒いレザートートバッグの正面」「黒いレザートートバッグの内側収納」「黒いレザートートバッグの持ち手部分」のように、画像ごとの違いを表現できます。

商品名だけをすべての画像に同じように設定するより、それぞれの画像で確認できる内容を反映したほうが、画像の情報を具体的に伝えられます。

店舗や施設の写真にも具体的なALT属性を設定

店舗サイトや企業サイトでは、外観、店内、設備、会議室、アクセス案内などの画像を掲載することがあります。このような画像でも、写真の内容や目的に合わせてALT属性を設定できます。

店舗の外観写真なら「店舗の正面外観」、店内写真なら「カウンター席とテーブル席がある店内」、駐車場の写真なら「店舗入口横にある来客用駐車場」、会議室なら「8人用テーブルとモニターを備えた会議室」のような説明が考えられます。アクセス案内の画像であれば、「渋谷駅から店舗までの徒歩ルートを示した地図」のように、何を示した地図なのかまで含めると内容が分かりやすくなります。

すべての画像に説明文が必要なわけではない

Webページに画像があるからといって、すべての画像に詳しいALT属性を設定する必要があるわけではありません。背景画像や区切り線、装飾のためだけに配置している画像など、ページの内容を理解するうえで情報として意味を持たない画像もあります。

このような装飾画像までスクリーンリーダーで読み上げられると、ユーザーに不要な情報を伝えてしまう場合があります。装飾だけを目的とした画像では、空のALT属性を設定する方法があります。大切なのは、「画像があるから必ず説明を書く」と判断するのではなく、その画像がユーザーに伝えるべき情報を持っているのかを確認することです。

画像リンクではリンク先が分かるALT属性を設定

バナー画像やボタン画像にリンクを設定しているWebサイトも多いと思います。通常のテキストリンクであれば、「料金を見る」「お問い合わせはこちら」などのリンクテキストから、リンク先の内容を判断できます。一方で、画像だけにリンクが設定されている場合は、ALT属性が重要になります。

たとえば、お問い合わせページへ移動する画像であれば「お問い合わせページへ」、資料ダウンロード用のバナーなら「SEOコンサルティング資料をダウンロード」、料金ページへの画像リンクなら「SEOコンサルティング料金を見る」のような内容が考えられます。

Googleは、画像をリンクとして利用している場合、その画像の代替テキストをアンカーテキストとして使用できると案内しています。バナーや画像ボタンを内部リンクとして使用している場合は、リンク先の内容や画像の役割が分かるALT属性になっているか確認しておきたいところです。

WordPressでは「代替テキスト」から設定

WordPressでは、画像をアップロードするとメディアの設定画面に「代替テキスト」という入力欄があります。ここに画像の内容を入力することで、ALT属性を設定できます。すでに公開している記事についても、メディアライブラリや投稿編集画面から確認できます。

Webサイト上で実際にどのようなALT属性が設定されているか確認したい場合は、Google Chromeの検証機能を使う方法もあります。確認したい画像を右クリックして「検証」を選び、HTML内のimgタグを見ると、alt="○○"という形式で設定内容を確認できます。

長期間運営しているWordPressサイトでは、過去に登録した画像の代替テキストが空欄になっていたり、現在のページ内容とは合っていないALT属性が残っていたりすることもあります。記事のリライトやSEO改善を行うときに、一緒に画像のALT属性を確認してみるのもよいと思います。

ALT属性は短く具体的に画像に合わせて設定

ALT属性を書くときに迷った場合は、画像を直接見られない人へ説明すると考えると内容を決めやすくなります。長い文章を書く必要はなく、画像に写っているものや、画像が示している内容を必要な範囲で具体的に説明します。

「商品」「画像」「グラフ」「人物」のように短すぎる説明では、画像の内容までは十分に伝わりません。一方で、画像とは直接関係のないサービス説明やSEOキーワードまで大量に追加すると、本来の目的から外れてしまいます。

SEOを意識すること自体は問題ありませんが、画像と関係のないキーワードまで入れる必要はありません。画像に関連する言葉が自然に含まれるのであれば、その言葉を使いながら内容を説明すれば十分です。

ALT属性は目立つSEO施策ではありませんが、画像の意味を検索エンジンやユーザーへ伝えるための基本的な設定です。商品画像、サービス紹介画像、グラフ、図解、スクリーンショット、店舗写真、バナーなどを多く使用しているサイトほど、一度確認しておく価値があります。

画像を追加するときに「この画像には何が写っているのか」「この画像は何を伝えるためのものなのか」を確認し、その内容に合わせてALT属性を設定しておく。この基本を続けることで、検索エンジンにもユーザーにも画像の情報を伝えやすいWebページになります。

▼ALT属性について詳しい記事はこちら
https://www.tsuyoshikashiwazaki.jp/blog/html-tag-seo/alt-attributes/

#SEO #SEO対策 #ALT属性 #代替テキスト #画像SEO #内部SEO #Webマーケティング #WordPress