
マンガ画像のaltテキストは、絵柄を細かく描写するより「その画像がページで伝えている要点」を短く伝えます。ストーリーに必要なコマなら場面の変化や結論を、セリフが情報の中心なら重要な言葉を含めます。装飾だけの画像は空のalt(alt="")、リンク画像はリンク先や操作の目的を説明し、長いあらすじや全セリフは本文など別のテキストで補います。
altテキストは「見た目」より画像の役割で決める
alt(代替テキスト)は、画像を見られない場合にも画像の情報や機能を伝えるためのテキストです。同じマンガ画像でも、サービスの仕組みを説明するコマ、雰囲気を添える背景、別ページへ移動するバナーでは役割が違います。まず「この画像がなくても、ページの要点や操作が同じように伝わるか」を確認しましょう。
W3Cの画像チュートリアルも、情報を伝える画像、装飾画像、機能を持つ画像、文字を含む画像など、目的に合わせて代替テキストを変える考え方を示しています。マンガも一律の定型文を付けるのではなく、読者に何を伝えるコマなのかから考えます。詳しくはW3C WAI「Images Tutorial」を参照してください。
画像の種類別:altの判断基準と記入例
| 画像の役割 | altの考え方 | 記入例 |
|---|---|---|
| 内容を伝える1コマ | 読者の理解に必要な場面・変化・要点を短く書く | 「担当者が申請内容を確認し、承認前に不足書類へ気づく」 |
| 複数コマで一つの流れを伝える | 細部を一枚ずつ列挙せず、まとまり全体の結論や変化を伝える | 「申請の不備を本人へ確認し、必要書類をそろえて再提出する流れ」 |
| セリフが情報の中心 | 重要な言葉が画像以外にない場合、その意味をaltまたは近くのテキストで補う | 「先輩が新人に『提出前に日付と金額を確認しよう』と伝える」 |
| 装飾・雰囲気づくり | 本文と重複し、意味や機能を追加しないなら空にする | alt="" |
| リンク・ボタンになった画像 | 絵の説明ではなく、押したときの目的・移動先を伝える | 「マンガLPの無料診断を申し込む」 |
例文は説明用の架空の内容です。実際には、画像とページ本文を見て、伝えるべき情報を置き換えてください。「漫画の画像」「マンガ制作」だけでは、画像が伝える内容やリンクの機能が分からないため、具体的な役割を一言で示します。
セリフを全部書き起こすべき?
すべてのセリフを毎回altへ詰め込む必要はありません。判断のポイントは、その言葉が理解に欠かせないのに、ページ内のほかのテキストでは読めないかどうかです。たとえば、コマが手順の注意点を伝えていて、その注意点が画像内にしかないなら、重要な文言をaltに含めるか、画像のすぐ近くに同じ情報を文章で掲載します。
一方、長いマンガ全編や細かな説明図を短いaltだけで完全に再現しようとすると、読み上げが長くなり、ページの流れも分かりにくくなります。altは簡潔な要約にし、必要なセリフ・手順・結論は本文や画像の後にあるテキスト版で補う方法を検討します。W3Cはaltを可能な限り簡潔にし、短い一文を超える説明が必要なら複雑な画像向けの別の説明方法を使う考え方を案内しています。
マンガのaltを書く4ステップ
- 画像を分類する:内容を伝える、装飾、リンク・ボタン、文字を含む画像のどれかを決めます。
- 画像が担う情報を一つに絞る:場面の変化、結論、重要な注意、リンク先など、読者が知る必要のある要点を選びます。
- 短い文にする:大切な情報から始め、絵柄の細部や「画像です」のような重複表現は省きます。キーワードを並べず、画像の内容を自然に説明します。
- ページ全体で読み返す:本文と重複していないか、必要な情報が抜けていないか、リンク画像なら目的が分かるかを、画面を見ずに読み上げるつもりで確認します。
W3Cのヒントでは、最も重要な情報を先に置き、画像の目的に必要な最短の説明を目指すことが勧められています。また、意味のある文字を画像で示す場合、その文字が内容理解に必要なら代替テキストにも同じ情報を含めます。HTMLの具体例はW3C「Using alt attributes on img elements」で確認できます。
公開前のチェックリスト
- 画像を外しても、重要な結論・手順がテキストで分かる。
- 説明が画像の役割に合い、人物の服装や背景など不要な細部を列挙していない。
- セリフが重要なら、その意味がaltか近くのテキストで伝わる。
- 装飾画像は空のaltになっていて、読み上げを増やしていない。
- リンク画像は、リンク先や操作目的が分かる。
- altに検索語を不自然に詰め込まず、画像とページ本文が同じテーマを自然に説明している。
Google Search Centralは、画像の内容を理解する手がかりとしてalt属性だけでなく、ページ上のテキストなども利用すると説明しています。altは検索順位を保証する欄ではありません。読者に画像の意味を伝えることを優先し、画像の周辺にある見出しや説明文も内容に合うよう整えましょう。Google Search Central「Google 画像 SEO のベストプラクティス」
よくある質問
altテキストに「マンガ画像」と書けば十分ですか?
画像が伝える情報やリンクの目的が分からないため、内容を伝えるコマなら場面や要点を短く書きます。装飾だけなら空のaltにします。
マンガの全セリフをaltに書く必要はありますか?
一律に全て書くのではなく、理解に必要な情報が画像以外にあるかで判断します。長い内容は短いaltと本文のテキスト説明に分ける方法があります。
検索対策のため、altにキーワードを入れるべきですか?
画像に関係のない語句を追加するのではなく、画像の役割と内容を正確に説明します。Googleもaltとページ内容など複数の情報を使って画像を理解すると案内していますが、特定の順位を保証するものではありません。
まとめ:読者に必要な情報だけを、役割に合わせて伝える
マンガ画像のaltは、絵を長く描写するための欄ではありません。内容を伝えるコマなら要点を、リンク画像なら目的を、装飾画像なら空のaltを選びます。セリフやストーリーが重要なときは、短いaltだけで抱え込まず、本文のテキスト説明も組み合わせてください。
マンガLPをスマートフォンで公開する場合は、画像の説明だけでなく、コマの順序や文字の読みやすさもあわせて確認しましょう。スマホ向けマンガLPの公開前チェックも参考になります。
参考情報
- W3C WAI: Images Tutorial
- W3C WAI: Tips and Tricks for Images
- W3C: Technique H37 — Using alt attributes on img elements
- Google Search Central: Google 画像 SEO のベストプラクティス