seo-images

画像最適化の分析

共有データキャッシュ

ステップ 0 -- 共有データキャッシュを確認する：

情報を収集する前に、.seo-cache/ を確認し、関連する SEO スキルで再利用できるコンテキストがないか確認します。 スキーマと依存関係マップについては、../seo/references/shared-data-cache.md を参照してください。

次のキャッシュファイルが存在する場合は確認します：

• .seo-cache/site-meta.json：ドメイン、ビジネスの種類、業界、クロールのコンテキスト

• .seo-cache/audit-scores.json：過去のフル監査での優先事項

• .seo-cache/pages/{url-slug}/page-analysis.json：URL が指定された場合のページレベルのコンテキスト

• 見つかった場合：明らかに有効なフィールドを解析して使用します（「[日付] の [X] をキャッシュから使用」と記録します）

• 見つからない、破損している、または関連性がない場合：新たな証拠を使って続行します

• ユーザーが「refresh」または「re-run」と指示した場合：キャッシュの読み取りを無視し、書き込み時に上書きします

チェック項目

代替テキスト

• すべての <img> 要素に設定されている（装飾目的の場合を除く：role="presentation"）
• 内容を説明している。「image.jpg」や「photo」ではない
• 不自然にならない範囲で関連キーワードを含み、キーワードを詰め込んでいない
• 長さ：10～125 文字

良い例：

• 「キッチンシンクの蛇口を修理するプロの配管工」
• 「赤い 2024 Toyota Camry セダンの正面」
• 「モダンなオフィスの会議室でのチームミーティング」

悪い例：

• 「image.jpg」（説明ではなくファイル名）
• 「plumber plumbing plumber services」（キーワードの詰め込み）
• 「こちらをクリック」（内容を説明していない）

ファイルサイズ

画像カテゴリ別の段階的な基準：

画像カテゴリ	目標	警告	重大
サムネイル	< 50KB	> 100KB	> 200KB
コンテンツ画像	< 100KB	> 200KB	> 500KB
ヒーロー／バナー画像	< 200KB	> 300KB	> 700KB

画質を損なわずに可能な場合は、目標サイズまで圧縮することを推奨します。

フォーマット

フォーマット	ブラウザーのサポート状況	用途
WebP	97%+	デフォルトの推奨形式
AVIF	92%+	圧縮率が最も高い新しい形式
JPEG	100%	写真のフォールバック
PNG	100%	透過が必要なグラフィック
SVG	100%	アイコン、ロゴ、イラスト

JPEG／PNG より WebP／AVIF を推奨します。フォーマットのフォールバックを指定した <picture> 要素があるか確認します。

推奨する <picture> 要素のパターン

最も効率的な形式を先に指定し、プログレッシブエンハンスメントを使用します：

<picture>
  <source srcset="image.avif" type="image/avif">
  <source srcset="image.webp" type="image/webp">
  <img src="image.jpg" alt="Descriptive alt text" width="800" height="600" loading="lazy" decoding="async">
</picture>

ブラウザーは最初にサポートされている形式を使用します。現在のブラウザーサポート状況：AVIF 93.8%、WebP 95.3%。

JPEG XL：登場しつつあるフォーマット

2025 年 11 月、Google の Chromium チームは 2022 年の決定を覆し、Rust ベースのデコーダーを使用して Chrome で JPEG XL のサポートを復活させると発表しました。実装は機能的に完成していますが、Chrome の安定版にはまだ搭載されていません。JPEG XL は JPEG の可逆再圧縮（画質を一切損なわず約 20% 削減）と、競争力のある非可逆圧縮を提供します。ウェブへの導入にはまだ実用的ではありませんが、今後の採用に向けて注目する価値があります。

レスポンシブ画像

• 複数サイズに対応する srcset 属性
• レイアウトのブレークポイントに合わせた sizes 属性
• デバイスのピクセル比に適した解像度

<img
  src="image-800.jpg"
  srcset="image-400.jpg 400w, image-800.jpg 800w, image-1200.jpg 1200w"
  sizes="(max-width: 600px) 400px, (max-width: 1200px) 800px, 1200px"
  alt="Description"
>

遅延読み込み

• ファーストビューより下の画像に loading="lazy" を設定
• ファーストビュー内／ヒーロー画像は遅延読み込みしない（LCP に悪影響があります）
• ネイティブ方式と JavaScript ベースの遅延読み込みを確認

<img src="photo.jpg" loading="lazy" alt="Description">


<img src="hero.jpg" alt="Hero image">

LCP 画像に fetchpriority="high" を指定

ヒーロー画像／LCP 画像に fetchpriority="high" を追加し、ブラウザーのネットワークキューでのダウンロード優先度を高めます：

<img src="hero.webp" fetchpriority="high" alt="Hero image description" width="1200" height="630">

重要： ファーストビュー内／LCP 画像を遅延読み込みしないでください。LCP 画像に loading="lazy" を使用すると、LCP スコアに直接悪影響を与えます。loading="lazy" はファーストビューより下の画像にのみ使用してください。

LCP 以外の画像に decoding="async" を指定

LCP 以外の画像に decoding="async" を追加し、画像のデコードによってメインスレッドがブロックされないようにします：

<img src="photo.webp" alt="Description" width="600" height="400" loading="lazy" decoding="async">

CLS の防止

• すべての <img> 要素に width 属性と height 属性を設定
• 代替手段として aspect-ratio CSS を使用
• 寸法が指定されていない画像を指摘

<img src="photo.jpg" width="800" height="600" alt="Description">


<img src="photo.jpg" style="aspect-ratio: 4/3" alt="Description">


<img src="photo.jpg" alt="Description">

ファイル名

• 内容がわかる名前にする：IMG_1234.jpg ではなく blue-running-shoes.webp
• ハイフン区切りの小文字を使用し、特殊文字は使わない
• 関連キーワードを含める

CDN の使用

• 画像が CDN から配信されているか確認します（異なるドメイン、CDN ヘッダー）
• 画像が多いサイトには CDN を推奨します
• エッジキャッシュヘッダーを確認します

出力

画像監査の概要

指標	状態	件数
画像の合計数	-	XX
代替テキストなし	❌	XX
サイズ超過（>200KB）	⚠️	XX
不適切な形式	⚠️	XX
寸法の指定なし	⚠️	XX
遅延読み込みなし	⚠️	XX

優先度順の最適化リスト

ファイルサイズへの影響が大きい順（削減量の大きいものから）：

画像	現在のサイズ	形式	問題	削減見込み
...	...	...	...	...

推奨事項

1. X 枚の画像を WebP 形式に変換します（削減見込み：XX KB）
2. X 枚の画像に代替テキストを追加します
3. X 枚の画像に寸法を追加します
4. ファーストビューより下にある X 枚の画像で遅延読み込みを有効にします
5. サイズ超過の X 枚の画像を圧縮します

---

画像の SERP 分析

DataForSEO MCP が利用可能な場合、競合データを使って画像監査を強化します。

/seo images serp <keyword>

ページ上の画像を Google 画像検索の SERP ランキングと照合します。

ワークフロー：

1. serp_google_images_live_advanced（depth=100）を使って Google 画像検索の結果を取得します
2. 上位ドメイン、画像の種類、代替テキストのパターンを抽出します
3. 競合の画像 SERP の状況を出力します

出力：

順位	ドメイン	タイトル／代替テキスト	画像 URL	ページ URL
1	example.com	"青いランニングシューズ..."	.../shoes.webp	/products/...

分析内容：

• ドメインの優勢度：画像の掲載順位を最も多く獲得しているサイト（件数上位 10 位）
• 代替テキストのパターン：上位表示される画像に共通するタイトル／代替テキストのパターン
• 形式の分布：上位の検索結果における WebP、JPEG、PNG の割合
• 機会スコア：ページの検索順位は獲得しているものの、画像が表示されていないキーワード

DataForSEO MCP が利用できない場合は、ユーザーにその旨を伝え、拡張機能のインストールを提案します。

---

画像ファイルの最適化

形式変換、メタデータの埋め込み、圧縮により、画像ファイルを SEO 向けに最適化します。

/seo images optimize <path>

画像ファイルをウェブおよび SEO 向けに最適化します。WebP／AVIF に変換し、IPTC メタデータを埋め込み、圧縮して、レスポンシブ対応のバリエーションを生成します。

使用するツール（優先順）：

• exiftool -- EXIF／IPTC／XMP の読み書き（インストール：sudo apt install libimage-exiftool-perl）
• cwebp -- WebP への変換（インストール：sudo apt install webp）
• ImageMagick convert -- 形式変換、サイズ変更（ほとんどのシステムにプリインストール済み）
• FFmpeg -- 形式変換のフォールバック（プリインストール済み）

実行前： which exiftool cwebp convert ffmpeg で利用可能なツールを確認します。

形式変換

メタデータを保持したまま、画像を最新の形式に変換します。

# WebP (recommended default) - with metadata preserved
cwebp -q 82 -metadata all input.jpg -o output.webp

# WebP via ImageMagick (fallback if cwebp not installed)
convert input.jpg -quality 82 output.webp

# AVIF via FFmpeg (slower encode, best compression)
ffmpeg -i input.jpg -c:v libaom-av1 -crf 30 -still-picture 1 output.avif

# Responsive variants (400w, 800w, 1200w)
convert input.jpg -resize 400x -quality 82 image-400.webp
convert input.jpg -resize 800x -quality 82 image-800.webp
convert input.jpg -resize 1200x -quality 82 image-1200.webp

メタデータの埋め込み（Google リッチリザルト向け IPTC）

Google 画像検索では、検索結果に IPTC の Creator、Credit Line、Copyright が表示されます。 これはランキング要因ではありませんが、リッチリザルトでの表示とブランドの帰属表示を改善します。

exiftool を使用する場合（推奨）：

# Read all metadata
exiftool image.jpg

# Inject IPTC + XMP metadata for Google Images rich results
exiftool \
  -IPTC:ObjectName="Product Photo Description" \
  -IPTC:Caption-Abstract="Detailed image description" \
  -IPTC:By-line="Brand Name Photography" \
  -IPTC:Credit="Brand Name" \
  -IPTC:CopyrightNotice="Copyright 2026 Brand Name" \
  -IPTC:Source="brandname.com" \
  -XMP:Title="Product Photo Description" \
  -XMP:Description="Detailed image description" \
  -XMP:Creator="Brand Name Photography" \
  -XMP:Rights="Copyright 2026 Brand Name" \
  image.jpg

# Batch inject to all images in directory
exiftool -overwrite_original \
  -IPTC:By-line="Brand Name" \
  -IPTC:CopyrightNotice="Copyright 2026 Brand Name" \
  *.jpg *.webp *.png

ImageMagick を使用する場合（フォールバック）：

identify -verbose image.jpg | head -50

convert input.jpg \
  -set comment "Product Photo Description" \
  -set IPTC:2:80 "Brand Name Photography" \
  -set IPTC:2:116 "Copyright 2026 Brand Name" \
  output.jpg

重要： WebP は EXIF と XMP に対応していますが、IPTC には標準で対応していません。WebP ファイルでは、 IPTC の代わりに XMP フィールドを使用してください。exiftool はこの変換を自動で処理します。

メタデータ監査

# Quick audit with exiftool
exiftool -IPTC:all -XMP:all -EXIF:ImageDescription image.jpg

# Batch audit - find images missing IPTC Creator
exiftool -if 'not $IPTC:By-line' -filename *.jpg *.webp *.png

最適化の全工程

画像 SEO を最大限に高めるには、各画像に対して次の工程を実行します。

1. 既存のメタデータを監査する：exiftool -IPTC:all -XMP:all image.jpg
2. IPTC／XMP メタデータを埋め込む：Creator、Copyright、Description
3. WebP に変換する：cwebp -q 82 -metadata all image.jpg -o image.webp
4. レスポンシブ対応のバリエーションを生成する：400w、800w、1200w
5. メタデータが保持されていることを確認する：exiftool image.webp
6. <picture> HTML を生成する：AVIF > WebP > JPEG のフォールバック順

Google 画像検索で重要な要素と重要でない要素

要素	影響	設定場所
代替テキスト	重大（ランキング）	HTML <img alt="">
ファイル名	高（ランキング）	ファイルシステム（内容が分かるハイフン区切りの名前）
ページのコンテキスト	高（ランキング）	周囲の HTML コンテンツ
ファイルサイズ／速度	中（CWV を介した間接的な影響）	圧縮＋形式変換
IPTC Creator/Copyright	低（表示のみ）	画像ファイルのメタデータ
EXIF カメラデータ	なし	SEO には関係ありません
IPTC Keywords	なし	Google は無視します

---

エラー処理

シナリオ	対応
URL にアクセスできない	ステータスコードを含めて接続エラーを報告します。URL の確認と、サイトで認証が必要かどうかの確認を提案します。
ページに画像が見つからない	<img> 要素が検出されなかったことを報告します。画像が JavaScript または CSS の background-image で読み込まれているか確認するよう提案します。
CDN または認証の背後にある画像	画像ファイルに直接アクセスできず、サイズを分析できなかったことを記載します。取得可能なメタデータ（代替テキスト、寸法、マークアップから取得した形式）を報告し、アクセスできないリソースを明示します。
exiftool がインストールされていない	メタデータの取得には ImageMagick を代わりに使用します。次のコマンドを推奨します：sudo apt install libimage-exiftool-perl
cwebp がインストールされていない	WebP への変換には ImageMagick または FFmpeg を代わりに使用します。次のコマンドを推奨します：sudo apt install webp
DataForSEO MCP が利用できない	Image SERP Analysis セクションを省略します。拡張機能がインストールされていないことを記載します。

共有データキャッシュへの書き込み

すべての作業が完了したら、ワークフローで永続的に保存すべき調査結果が得られた場合に、簡潔な JSON の概要を .seo-cache/ に書き込みます。 ../seo/references/shared-data-cache.md のスキーマと命名規則を使用し、少なくとも cache_type、analyzed_at、ソース URL／ドメイン、主な調査結果、問題点、推奨事項、ツールの制限事項を含めます。.gitignore に .seo-cache/ がない場合は追加します。