Blog
漫画でわかるALTテキストの書き方
Acqua Academy × SEO Manga
この漫画は、ホームページ育成アカデミーの実践編です。
漫画で要点をつかんだあと、アカデミーの通常講座でチェックリストや実務手順まで確認できます。前後の記事を読む場合はSEO漫画一覧へ進んでください。
漫画でわかるALTテキストの書き方
漫画で見るポイント
冒頭の結論
ALTテキストは、画像にキーワードを入れる場所ではありません。
画像が表示されないとき、支援技術で読むとき、検索エンジンが画像の意味を理解するときに使われる「画像の説明」です。SEOやLLMO/AIOを意識するなら、ALTには「何が写っているか」だけでなく、「その画像が記事の中で何を説明しているか」まで自然に書きます。
中小企業サイトでよくある失敗は、ALTを空欄にすること、すべて同じALTにすること、SEO SEO SEO のようにキーワードを並べることです。これでは読者にも検索エンジンにも画像の役割が伝わりません。
この記事では、SEO漫画 第8章の「LLMO向け記事テンプレート」をもとに、画像ALTをどう書けば、読者、検索エンジン、AIに伝わりやすくなるかを実務目線で整理します。対応する通常講座は /academy/llmo-article-template/、章別漫画は /academy/manga/chapter-08/ です。
漫画で分かる要点
- ALTテキストは画像の説明であり、キーワード置き場ではない
- 画像の内容と、記事内での役割を自然文で書く
- 写真、図解、比較表、手順画像、漫画でALTの書き方を変える
- 画像内の重要情報は、本文や表にも書く
- 装飾だけの画像は、無理に説明しない
- 同じ画像を使い回す場合でも、ページ文脈に合わせてALTを見直す
- WordPressではアップロード時だけでなく、記事公開前にもALTを確認する
ALTテキストとは何か
ALTテキストは、HTMLの alt 属性に入る画像の代替テキストです。
画像が読み込めない場合、スクリーンリーダーなどの支援技術で読む場合、検索エンジンが画像の内容を理解する場合に手がかりになります。つまり、ALTは検索向けの小技ではなく、読者体験とアクセシビリティと画像SEOの土台です。
| 見る人・仕組み | ALTが役立つ場面 | 書き方の方向 |
|---|---|---|
| 読者 | 画像が表示されないとき | 何の画像か分かる |
| スクリーンリーダー | 画像を音声で理解するとき | 画像の意味が伝わる |
| 検索エンジン | 画像とページの関係を見るとき | ページテーマとの関連が分かる |
| AI検索 | 画像の周辺文脈を理解するとき | 本文、見出し、ALTがそろう |
| 運用担当者 | メディア管理をするとき | どの記事用の画像か分かる |
ALTを書くときは、「この画像を見られない人に、何を伝えれば本文が理解できるか」を考えると外しにくくなります。
ALTに入れる3つの要素
ALTは長ければよいわけではありません。短い自然文で、次の3つを必要に応じて入れます。
- 画像に何が写っているか
- 何を説明している画像か
- 記事テーマとどう関係するか
| 要素 | 書く内容 | 例 |
|---|---|---|
| 内容 | 写真、図、表、人物、場所など | 店舗入口と営業時間が分かる外観写真 |
| 役割 | 比較、手順、全体像、事例など | 内部リンク改善の4ステップを示す図 |
| 文脈 | SEO、LLMO、サービス、業種など | 歯科サイトで予約前の不安を減らすFAQ設計図 |
たとえば、カフェの店内写真なら 店内写真 だけでは弱いです。カフェの客席とカウンターの雰囲気が分かる店内写真 のように書くと、画像の内容と読者への役割が伝わります。
悪いALTと良いALT
ALTの失敗は、だいたい3つに分かれます。空欄、抽象的すぎる、キーワードを詰め込みすぎる、です。
| 画像の種類 | 避けたいALT | 良いALT |
|---|---|---|
| 店舗写真 | 画像 | カフェの入口、看板、営業時間が分かる外観写真 |
| 比較表 | SEO LLMO AIO 対策 | SEOとLLMO/AIOの目的、対象、見る場所を比較した表 |
| 手順図 | 手順 | Search Consoleで表示回数、CTR、順位を確認する改善手順の図 |
| 事例写真 | 施工事例 | 外壁塗装前後の色味と仕上がりを比較できる施工事例写真 |
| 漫画画像 | 漫画 | SEO漫画 第8章1ページ目 LLMO向け記事テンプレートの全体像を説明する漫画 |
良いALTは、読者に説明しても不自然ではありません。逆に、声に出して読んだときに意味が通らないALTは、SEO目的に寄りすぎている可能性があります。
ALTはキーワードを詰め込まない
ALTにキーワードを入れること自体が悪いわけではありません。
ただし、画像の説明として必要な場合だけです。SEO 漫画 LLMO AIO 画像 ALT 対策 のように単語を並べると、画像の意味が分からなくなります。検索エンジン向けにも読者向けにも不自然です。
| 書き方 | 評価 | 理由 |
|---|---|---|
SEO LLMO AIO 対策 画像 | 弱い | 単語の羅列で画像内容が分からない |
SEO漫画 第8章の画像 | やや弱い | テーマは分かるが内容が浅い |
SEO漫画 第8章1ページ目 LLMO向け記事テンプレートの全体像を説明する漫画 | 良い | 画像内容と役割が分かる |
LLMO向け記事テンプレートで、結論、定義、悩み、比較、手順、FAQ、CTAの流れを示した図 | 良い | 画像が伝える情報が分かる |
キーワードは、画像の説明に自然に含まれるときだけ使います。大切なのは、画像を見ていない人にも意味が伝わることです。
写真のALTの書き方
写真のALTでは、写っているものと、読者が判断できる情報を書きます。
中小企業サイトでは、店舗、設備、スタッフ、施工事例、商品、現場写真などがよく使われます。どの写真でも、写真 だけで終わらせず、何が分かる写真なのかを書きます。
| 写真の種類 | ALTに入れる情報 | 例 |
|---|---|---|
| 店舗外観 | 店名、入口、看板、駐車場 | 駐車場と入口が分かるカフェ外観写真 |
| 店内 | 席数、雰囲気、利用シーン | 一人席とテーブル席がある落ち着いた店内写真 |
| 設備 | 機械、用途、対応範囲 | 小ロット加工に使うCNC加工機の設備写真 |
| 施工前後 | 変化、比較対象、部位 | 外壁塗装前後の色の違いが分かる比較写真 |
| スタッフ | 役割、対応場面 | 初回相談でヒアリングを行う担当スタッフの写真 |
写真のALTでは、必要以上に感情的な表現を入れすぎない方がよいです。素敵な写真 より、何が分かる写真か を優先します。
図解や比較表のALTの書き方
図解や比較表のALTでは、画像の中身を全部書こうとしすぎないことが大切です。
長い表を丸ごとALTに入れると読みにくくなります。図解の要点を短く説明し、詳細は本文やHTMLの表で補います。
| 図解の種類 | ALTで書くこと | 本文で補うこと |
|---|---|---|
| 全体像の図 | 何の流れを示す図か | 各ステップの詳しい説明 |
| 比較表の画像 | 何と何を比較しているか | 比較項目ごとの判断基準 |
| 手順図 | 何の作業順か | 具体的な操作手順 |
| サイト構造図 | どのページ同士の関係か | 内部リンクの理由 |
| CTA導線図 | どの行動へ進む図か | 無料診断や相談の流れ |
たとえば比較表の画像なら、ALTは SEOとLLMO/AIOの目的、対象、見る場所を比較した表 で十分なことがあります。表の全項目は本文側に書くと、読者にも検索エンジンにも分かりやすくなります。
漫画画像のALTの書き方
漫画画像のALTは、少し工夫が必要です。
漫画は複数のコマで構成されるため、全セリフをALTに入れると長くなりすぎます。基本は、章番号、ページ番号、テーマ、何を説明している漫画かをまとめます。
| 入れる情報 | 理由 | 例 |
|---|---|---|
| SEO漫画 | 画像カテゴリが分かる | SEO漫画 |
| 章番号・ページ番号 | シリーズ内の位置が分かる | 第8章1ページ目 |
| テーマ | 記事との関係が分かる | LLMO向け記事テンプレート |
| 要点 | 画像の意味が分かる | 記事構成の全体像を説明する |
| Acqua文脈 | アカデミー資産としてつながる | Acquaのホームページ育成アカデミー |
この形式にすると、漫画画像が単なるイラストではなく、記事内の学習素材として伝わります。
装飾画像は無理に説明しない
すべての画像に詳しいALTが必要なわけではありません。
装飾だけの区切り線、背景、意味を持たないアイコンなどは、詳しく説明すると逆に読みにくくなります。重要なのは、その画像が本文理解に必要かどうかです。
| 画像 | ALTの考え方 | 例 |
|---|---|---|
| 本文理解に必要な写真 | 内容と役割を書く | 駐車場の位置が分かる店舗外観写真 |
| 比較表・手順図 | 要点を書く | 内製と外注の判断軸を比較した表 |
| CTAアイコン | 役割が必要なら書く | 無料診断へ進むチェックリストのアイコン |
| 背景画像 | 説明しないことが多い | 空のALTまたはCSS背景 |
| 飾りのあしらい | 説明しないことが多い | 空のALT |
WordPressでメディアにALTを入れる運用にしている場合でも、画像の種類によって書き方を分けます。意味のある画像は説明し、装飾だけの画像は読者の邪魔をしない形にします。
画像内の文字は本文にも書く
画像の中に文字を入れる場合、重要な情報は本文にも書きます。
たとえば、図解内に 結論、定義、比較、手順、FAQ、CTA と書いてあるなら、本文でもその流れを説明します。画像ALTだけに頼るのではなく、見出し、本文、表、FAQにも同じ情報を置くことで、読者にも検索エンジンにも伝わりやすくなります。
| 画像内の情報 | 本文側で補う方法 |
|---|---|
| ステップ名 | 番号付きリストで説明する |
| 比較項目 | HTMLの表で整理する |
| 料金や条件 | 本文で注意点を書く |
| FAQの質問 | 記事末尾のFAQにも入れる |
| CTAの流れ | 無料診断やサービスページへのリンクを置く |
LLMO/AIOでは、画像そのものよりも、画像で伝えたい情報がページ内で整理されていることが大切です。ALTはその一部です。
WordPressでALTを管理する手順
WordPressでは、画像をアップロードしたときだけでなく、記事に挿入したあとにもALTを確認します。
同じ画像を複数の記事で使う場合、メディアライブラリのALTだけで済ませると、記事ごとの文脈に合わないことがあります。特に漫画ブログでは、同じ章の画像を使っても記事テーマが変わるため、ALTの書き方も少し変える必要があります。
- 記事テーマを確認する
- 画像の役割を決める
- 画像ごとにALTの下書きを書く
- 本文と見出しに同じ要点があるか確認する
- WordPressに画像を挿入する
- 画像ブロックまたはメディア設定でALTを確認する
- 公開前に画像4枚分を読み直す
- 公開後に一覧や個別ページで表示を確認する
ALTは公開前の確認項目に組み込むと漏れにくくなります。記事を書き終えてから考えるより、画像を選ぶ段階で「この画像は何を説明するのか」を決めておく方が自然です。
業種別のALT例
ALTは業種によって書き方が変わります。
同じ 写真 でも、カフェ、歯科、士業、製造業、採用サイトでは読者が知りたいことが違います。読者が判断したい情報をALTにも反映します。
| 業種 | 画像 | ALT例 |
|---|---|---|
| カフェ | 店舗外観 | 駐車場と入口の位置が分かるカフェ外観写真 |
| 歯科 | 診療室 | 個室診療室と治療設備が分かる歯科医院の院内写真 |
| 士業 | 相談フロー図 | 相続相談から必要書類の確認までの流れを示す手順図 |
| 製造業 | 設備写真 | 小ロット金属加工に対応するCNC加工設備の写真 |
| 採用 | 仕事風景 | 朝礼後に現場確認を行う施工スタッフの仕事風景写真 |
| EC | 商品比較画像 | サイズ違いの収納ケース3種類を横並びで比較した商品写真 |
ALTは、画像を見た人だけでなく、画像を見られない人にも同じ判断材料を届けるための文です。
ALTとキャプションの違い
ALTとキャプションは似ていますが、役割が違います。
ALTは画像の代替説明です。キャプションは、画像の下に表示して読者に補足する説明です。どちらも同じ文章にする必要はありません。
| 要素 | 主な対象 | 書く内容 |
|---|---|---|
| ALT | 画像を見られない読者、検索エンジン | 画像の内容と役割 |
| キャプション | 画像を見ている読者 | 画像から分かる要点 |
| 前後の本文 | すべての読者 | なぜその画像を見るのか、次に何をするのか |
| ファイル名 | 運用管理、画像検索の補助 | 画像内容が分かる短い名前 |
たとえばALTは 内部リンク改善の4ステップを示す図、キャプションは まずは親記事と子記事の関係から整理します のように分けられます。
ALT改善の優先順位
既存サイトの全画像を一気に直す必要はありません。
最初に直すべきなのは、検索流入がある記事、サービスページ、事例ページ、FAQ、比較表、漫画記事の画像です。問い合わせに近いページほど、画像説明の質が成果に影響しやすくなります。
| 優先度 | 対象 | 理由 |
|---|---|---|
| 高 | サービスページの主要画像 | 相談前の判断材料になる |
| 高 | 事例写真、施工前後、実績画像 | 一次情報として強い |
| 高 | 漫画ブログの4枚画像 | SEO漫画カテゴリの中心素材 |
| 中 | 比較表、手順図、FAQ図解 | 記事理解を助ける |
| 中 | 検索流入があるブログ画像 | クリック後の理解に影響する |
| 低 | 装飾画像、背景、雰囲気写真 | 本文理解への影響が小さい |
Search Consoleで表示回数がある記事から見直すと、作業の優先順位をつけやすくなります。
ALTテキスト改善チェックリスト
- 確認: 意味のある画像にALTが入っている
- 確認: ALTが
画像、写真、図解だけで終わっていない - 確認: キーワードの羅列になっていない
- 確認: 画像に写っている内容が分かる
- 確認: 記事内で何を説明している画像か分かる
- 確認: 写真、図解、比較表、手順図、漫画で書き方を変えている
- 確認: 画像内の重要情報を本文にも書いている
- 確認: キャプションとALTの役割を分けている
- 確認: 装飾画像を無理に説明していない
- 確認: 同じ画像を使い回すとき、記事文脈に合わせて見直している
- 確認: WordPress公開前に画像ごとに確認している
- 確認: 関連漫画や通常講座への導線がある
- 確認: 公開後に一覧と個別ページの画像表示を確認している
FAQ
Q1. ALTには何文字くらい書けばよいですか？
厳密な文字数だけで判断するものではありません。目安としては、短い自然文で画像の内容と役割が伝わる長さにします。長すぎるALTは読みにくくなるため、表や図解の細部は本文やHTMLの表で補う方が実務的です。
Q2. ALTにキーワードを入れるとSEOに有利ですか？
画像の説明として自然なら入れて構いません。ただし、キーワードを並べるだけのALTは避けます。ALTテキスト 書き方 SEO を狙う記事でも、画像ALTには「何の画像か」「何を説明しているか」を優先します。
Q3. 画像が装飾だけの場合もALTを書くべきですか？
装飾だけで本文理解に関係しない画像は、詳しい説明を入れない方がよい場合があります。意味のある画像にはALTを書き、背景や飾りは読者の理解を邪魔しない扱いにします。
Q4. 漫画画像のALTにはセリフを全部入れるべきですか？
基本的には全部入れなくてよいです。漫画画像では、章番号、ページ番号、テーマ、何を説明している漫画かをまとめます。セリフの内容や詳しい解説は、本文で補う方が読みやすくなります。
Q5. キャプションがあればALTは不要ですか？
不要にはなりません。キャプションは画像を見ている読者への補足、ALTは画像の代替説明です。似た内容になることはありますが、役割が違うため、意味のある画像ではALTも確認します。
Q6. 同じ画像を複数記事で使う場合、同じALTでよいですか？
画像の内容が同じなら近い文章になることはあります。ただし、記事テーマが違う場合は、画像の役割も変わります。漫画画像を使い回す場合でも、記事テーマに合わせて「何を説明する画像か」を調整します。
Q7. ALTを入れればAI検索に引用されますか？
ALTだけでAI検索に引用されるわけではありません。重要なのは、画像、ALT、見出し、本文、表、FAQ、内部リンクが同じテーマで整理されていることです。ALTはその土台を支える要素の1つです。
参考・関連リンク
- Google 画像 SEO ベストプラクティス: https://developers.google.com/search/docs/appearance/google-images
- Google SEO Starter Guide: https://developers.google.com/search/docs/fundamentals/seo-starter-guide
- Google Creating helpful, reliable, people-first content: https://developers.google.com/search/docs/fundamentals/creating-helpful-content
- W3C WAI Images Tutorial: https://www.w3.org/WAI/tutorials/images/decision-tree/
- 漫画章: /academy/manga/chapter-08/
- 関連漫画: /manga/image-diagram-usage-manga/
- 関連漫画: /manga/heading-structure-improvement-manga/
- 関連漫画: /manga/primary-information-manga/
- 関連漫画: /manga/evidence-source-manga/
- 関連講座: /academy/llmo-article-template/
- 関連講座: /academy/ai-search-page-structure/
- 関連講座: /academy/blog-asset-strategy/
- SEO漫画カテゴリ: /manga/
- ホームページ育成アカデミー: /academy/
- 無料診断: /academy/diagnosis/
- ホームページ育成プラン: /service/llmo_seo/auto-blog-lp/
無料診断CTA
ALTを入れても、画像、本文、見出し、FAQ、内部リンクがばらばらだと、記事全体の力は上がりにくくなります。まずは、どの記事にどの画像があり、その画像が何を説明しているのかを整理することが大切です。
Acquaのホームページ育成では、記事本文だけでなく、画像ALT、漫画、図解、一次情報、FAQ、内部リンク、Search Consoleの数字までまとめて確認します。自社サイトで「画像は入れているけれど検索や問い合わせにつながっていない」と感じている場合は、無料診断で改善の優先順位を整理してください。