2026年の画像altテキスト実践ガイド

なぜaltテキストは今も重要なのか

altテキストは1995年からHTML仕様の一部です。30年が経った今でも、Web上の多くの画像にはalt属性がないか、スクリーンリーダーを使ったことのない人が書いたようなaltテキストが付いています。

問題はもはや認知不足ではありません。現在の多くのコンテンツ管理システムでは、altフィールドが必須になっています。問題は、altテキストがコミュニケーションのための手段ではなく、コンプライアンス上のチェック項目になってしまったことです。本来の文脈が「CEOが第4四半期の業績を発表している」である場面で、「笑っている人物の画像」と書いてしまうのです。

altテキストが存在する理由はひとつです。画像を見ることができない人に、その画像の目的を伝えることです。その目的は文脈によって変わります。カフェのホームページにあるコーヒーカップの写真と、陶器の釉薬技法についてのブログ記事にある同じ写真とでは、果たす役割が異なります。

2026年には、altテキストを自動生成できるAIツールもあります。こうしたツールは改善されていますが、それでも文脈を理解することはできません。見えているものは説明できますが、その画像がなぜそこにあるのかは説明できないのです。

判断ツリー：この画像にaltテキストは必要か？

すべての画像に説明的なaltテキストが必要なわけではありません。装飾目的の画像もあります。周囲のテキストと重複している画像もあります。キャプションや本文で説明したほうがよい画像もあります。

判断の流れは次のとおりです。

その画像は、周囲のテキストにはない情報を伝えていますか？ はいなら、altテキストが必要です。いいえなら、おそらく装飾画像です。

その画像が消えたとき、目の見えないユーザーは重要な何かを見逃しますか？ はいなら、altテキストを書きます。いいえなら、空のalt属性（alt=""）を使い、スクリーンリーダーにスキップさせます。

その画像はリンクまたはボタンですか？ altテキストがリンクテキストになります。画像そのものではなく、遷移先を説明します。「料金プランを見る」は「矢印アイコン」より適切です。

その画像は複雑なもの、つまりグラフ、図、インフォグラフィックですか？ altテキストには実用上の長さの目安があります（多くのスクリーンリーダーでは約125文字が扱いやすい長さです）。複雑な画像には、キャプション、本文、またはaria-describedbyによる、より長い説明が必要です。

良いaltテキストは実際にどう聞こえるか

良いaltテキストは具体的で、簡潔で、文脈を踏まえています。問いはこうです。なぜこの画像がここにあるのか？

悪い例：「グラフの画像」

より良い例：「2026年1月から3月にかけてモバイルトラフィックが23%増加したことを示す折れ線グラフ」

悪い例：「ノートパソコンを使っている人」

より良い例：「FigmaでWebサイトのモックアップを確認しているデザイナー」

悪い例：「ここをクリック」

より良い例：「アクセシビリティ監査チェックリスト完全版（PDF）をダウンロード」

良いaltテキストには、数値、行動、結果が含まれることがよくあります。すべての視覚的な詳細を説明するのではありません。重要なことを説明します。

ヒーロー背景のテクスチャ、装飾的な枠線、純粋に美観のためのイラストなど、装飾目的の画像にはalt=""を使います。これは手抜きではありません。意味に対して正直であるということです。スクリーンリーダーはその画像を完全にスキップします。それが望ましい挙動です。

誰の時間も無駄にするよくある間違い

「〜の画像」や「〜の写真」から始める：スクリーンリーダーは、それが画像であることをすでに読み上げます。すぐ説明に入ってください。

SEOのためのキーワード詰め込み：altテキストは「best organic coffee beans Brooklyn artisan roasted」のような語句を詰め込む場所ではありません。Googleの画像検索は、何年も前からこれを検出するのが得意です。人間のために書きましょう。

ファイル名を説明する：「IMG_3847.jpg」は誰の役にも立ちません。「hero-banner-final-v3」も同じです。

小説を書く：altテキストが2文を超えるなら、その情報はおそらくキャプションや本文に置くべきです。

隣接するテキストを繰り返す：見出しが「サワードウブレッドの焼き方」で、画像が生地を成形している人を示しているなら、altテキストで見出しを繰り返す必要はありません。視覚的に異なる点を説明します。「打ち粉をした台の上でサワードウ生地を折りたたむ手。」

実際に役立つツールとワークフロー

現在の多くのCMSには、altテキストのフィールドが組み込まれています。WordPress、Webflow、Contentful、Sanityはいずれも、アップロード時にalt属性を目立つ形で表示します。ただし、フィールドが見えていることは、適切に入力されることを意味しません。

altテキストの欠落や質の低さを監査する場合、Accessibility Insightsやaxe DevToolsのようなブラウザー拡張機能は、alt属性のない画像を検出できます。手早く手動で確認するには、ブラウザーで画像をオフにして（FirefoxとChromeはいずれも対応しています）、ページを読んでみてください。altテキストが文脈の中で意味をなしていれば、問題ありません。

Azure Computer Vision、Google Cloud Visionのようなツールで利用できる、あるいはCloudflare Imagesのようなプラットフォームに組み込まれているAI生成のaltテキストは、特に大規模な画像ライブラリでは妥当な出発点になり得ます。ただし、AIのaltテキストは初稿として扱ってください。画像の内容は正確に説明できても、その画像がページ上にある理由までは分かりません。文脈を加えるには、やはり人間の編集者が必要です。

画像を多用するサイトに取り組んでいて、パフォーマンス上の問題を早期に見つけたい場合は、Wux Webtools' Image Compressorのようなツールを使うと、アップロード前にファイルサイズを最適化できます。画像が実際に読み込まれてこそ、altテキストは役に立つからです。

2026年のaltテキストとSEO

Googleは長年、altテキストが画像検索のランキング要因であると述べてきました。それは今も変わりません。ただし、画像検索最適化とアクセシビリティは同じものではありません。

SEOを主目的にaltテキストを書くと、キーワードを詰め込んだ意味のない文になり、スクリーンリーダーユーザーにとってページの移動が難しくなります。アクセシビリティを第一にaltテキストを書けば、SEO上の利点は自然についてきます。説明的で文脈に合ったaltテキストこそ、Googleの画像検索アルゴリズムが提示しようとしているものだからです。

ひとつ補足があります。現在のGoogle Imagesは、以前よりも周囲のページコンテンツをかなり重視しています。altテキストが適切でも汎用的（「フロスティングのかかったチョコレートケーキ」）で、ページのテーマがヴィーガンベーキングであれば、Googleは文脈を理解します。その違いが画像上で視覚的に明らかでない限り、「乳製品不使用のフロスティングを使ったヴィーガンチョコレートケーキ」と書く必要はありません。

重要なポイント

• altテキストは、すべての視覚的詳細を説明するためではなく、画像の目的を伝えるためにある
• 装飾画像にはalt=""を使い、スクリーンリーダーに完全にスキップさせるべきである
• 良いaltテキストは具体的で、文脈を踏まえ、「なぜこの画像がここにあるのか？」に答える
• AI生成のaltテキストは有用な出発点だが、文脈に合わせるには人間による編集が依然として必要である
• まずアクセシビリティのために書く。明確で説明的なテキストから、SEO上の利点は自然についてくる

FAQ

Q: すべてのaltテキストをAIで生成してもよいですか？

A: AIツールは画像の中に何があるかを説明するのは得意ですが、文脈は理解しません。何百もの商品画像を扱っていて基準となる説明が必要な場合、AIのaltテキストは問題ありません。編集コンテンツ、マーケティングページ、あるいは画像が存在する理由が重要なものについては、人間が確認し、編集する必要があります。

Q: altテキストはどのくらいの長さにすべきですか？

A: 多くのスクリーンリーダーでは、125文字以下が扱いやすい長さです。それ以上が必要な場合、その情報はおそらくキャプション、本文、またはaria-describedbyでリンクされた長い説明に置くべきです。厳密な技術的制限はありませんが、長いaltテキストは移動しづらくなります。

Q: ロゴにもaltテキストは必要ですか？

A: はい。ただし簡潔にします。ロゴがヘッダーにあり、ホームページへリンクしている場合、altテキストは会社名にします：alt="Acme Corp"。それがロゴであるという事実が文脈上なんらかの意味を持つ場合を除き、alt="Acme Corp logo"とは書かないでください。

Q: altテキストとキャプションの違いは何ですか？

A: altテキストは画像の直接的な代替です。画像に到達したときにスクリーンリーダーで読み上げられます。キャプションは補足情報で、誰にでも見え、文脈や出典を追加します。両方がある場合、互いに繰り返すべきではありません。

Q: CSSの背景画像にaltテキストを追加すべきですか？

A: いいえ。CSSの背景画像は定義上、装飾的なものであり、スクリーンリーダーには公開されません。背景画像が重要な情報を伝えている場合は、適切なaltテキストを持つHTML内の<img>要素にするべきです。

Sources

• W3C Web Accessibility Initiative: Images Tutorial
• WebAIM: Alternative Text
• Nielsen Norman Group: Alt Text for Images
• Google Search Central: Image SEO Best Practices