---
title: "OGP画像が更新されないときに共有前に確認するチェックリスト"
description: "HTMLページを公開・更新するたびにOGP画像が反映されない問題で困っているWeb制作者向けに、共有前と更新後のタイミングごとに実施すべき確認項目をチェックリスト形式で整理した実践的な記事。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/ogp-image-not-updating-checklist"
markdown: "https://giga-site.com/articles/ogp-image-not-updating-checklist/index.md"
category: "トラブルシュート"
publishedAt: "2026-06-25"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# OGP画像が更新されないときに共有前に確認するチェックリスト

SNSやSlackでURLをシェアしたとき、OGP画像が古いままになっているトラブルは、共有前の確認を徹底することで大半を防げる。「なぜ更新されないのか」を毎回調べる手間を省くために、発行前・更新後それぞれのタイミングで確認すべき項目をチェックリスト形式でまとめた。

> Source HTML: https://giga-site.com/articles/ogp-image-not-updating-checklist
> Article index: https://giga-site.com/articles/index.md

## よくある原因

OGP画像が更新されない原因の多くは「画像URLが変わっていないのにファイルだけ差し替えた」ことにある。Cloudflare CDNやAWSのCloudFrontなどを使っている場合、同じURLへのGETリクエストに古い画像を返し続ける。キャッシュのTTL（有効期間）が長い設定になっていると、サーバー側はすでに新しい画像を持っていても配信が切り替わらない。

もう一つはHTMLファイルの変更がデプロイされる前にシェアしてしまったケースだ。ステージング環境のURLをそのままSlackに貼ったり、デプロイが完了する前にFacebookデバッガーを使ったりすると、古いOGPタグが読み取られてキャッシュされてしまう。更新を確認してからシェアするという順序を守るだけで多くのトラブルを防げる。

- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく

## 自分側で確認すること

公開前チェックとして、HTMLのheadタグ内に`og:title` `og:description` `og:image` `og:url`の4つが揃っているかを確認する。og:imageに指定したURLにブラウザで直接アクセスして最新の画像が取得できるかを目視で確認し、画像サイズが1200×630pxの推奨サイズに近いかも検証する。

更新後チェックとして、Facebookシェアデバッガー（developers.facebook.com/tools/debug）にURLを入力して「もう一度スクレイピング」を実行し、表示されるog:imageのプレビューが最新のものになっているかを確認する。GDSやCDNのキャッシュをパージしている場合は、キャッシュのクリア完了を待ってからデバッガーを実行するとより正確に確認できる。

- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する

## 相手側で確認すること

共有相手がスマートフォンのSNSアプリからURLを貼った場合、アプリがOGPカードをデバイスレベルでキャッシュしていることがある。この場合はアプリを一度終了して再起動するか、シークレットモードで確認してもらうと最新状態を取得できるケースがある。

Twitterカードが表示されない場合は、Twitterの「Card Validator」（旧称、現在はXのカードプレビュー機能）を利用して確認できる。og:imageのほかにtwitter:imageを別途指定するとTwitter側でより確実に取得されるため、両方のメタタグを設定しているかもチェックリストに含める。

- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する

## 再発防止の運用

運用チェックリストに「OGP画像を変更するときは必ずURLも変える」を追加しておく。ファイル名にバージョン番号（ogp_v3.png）を付けるか、ビルドツールのコンテンツハッシュ機能（Viteなら`[hash]`拡張子）を利用してデプロイのたびにURLが自動的に変わる設定にすることで、キャッシュの問題を構造的に防げる。

ページ更新のたびにOGP確認を行うフローを社内標準に組み込む。確認手順を社内Notionやスプレッドシートに「3ステップ：①og:imageのURLに直接アクセスして最新画像確認 ②Facebookデバッガーでスクレイピング ③Slackに貼って表示を確認」と記載しておくと、担当者が変わっても同じ品質を保てる。

- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する

## よくある質問

### OGP確認を毎回Facebookデバッガーでやるのは手間です。もっと簡単な方法はありますか？

ogp.meにURLを貼るとFacebook・Twitter・Slack等の表示プレビューを一覧できます。更新後の簡易確認ならogp.meが手軽です。問題があればFacebookデバッガーで詳細を確認します。

### ビルドツールを使っていない静的HTMLサイトでコンテンツハッシュを付けるにはどうすればいいですか？

手動でファイル名にYYYYMMDD（例：ogp-20260625.png）を付けてog:imageのURLを書き換えるのが最も簡単です。更新のたびに日付を変えるだけでキャッシュバイパスになります。

### og:imageのURLをCloudflareで管理している場合、キャッシュはどこで消せますか？

Cloudflareダッシュボードの「キャッシュ→設定→カスタムパージ」から特定URLのキャッシュをパージできます。ワイルドカードで画像ディレクトリ全体を一括パージすることも可能です。

## 関連記事

- [OGP画像が更新されないときの原因と直し方](https://giga-site.com/articles/ogp-image-not-updating-fix/index.md)
- [OGP画像が更新されない問題をAI生成HTMLで防ぐプロンプト](https://giga-site.com/articles/ogp-image-not-updating-ai-prompt/index.md)
- [OGP画像が更新されないときに相手へ伝える確認依頼の書き方](https://giga-site.com/articles/ogp-image-not-updating-request-message/index.md)
- [画像の向きが勝手に回るときに共有前に確認するチェックリスト](https://giga-site.com/articles/image-orientation-rotated-checklist/index.md)
- [レスポンシブ画像が荒く見えるときに共有前に確認するチェックリスト](https://giga-site.com/articles/responsive-image-blurry-checklist/index.md)
- [SVGが表示されないときに共有前に確認するチェックリスト](https://giga-site.com/articles/svg-not-showing-checklist/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "OGP画像が更新されないときに共有前に確認するチェックリスト",
  "description": "HTMLページを公開・更新するたびにOGP画像が反映されない問題で困っているWeb制作者向けに、共有前と更新後のタイミングごとに実施すべき確認項目をチェックリスト形式で整理した実践的な記事。",
  "datePublished": "2026-06-25",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/ogp-image-not-updating-checklist",
  "url": "https://giga-site.com/articles/ogp-image-not-updating-checklist",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "トラブルシュート",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "OGP確認を毎回Facebookデバッガーでやるのは手間です。もっと簡単な方法はありますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "ogp.meにURLを貼るとFacebook・Twitter・Slack等の表示プレビューを一覧できます。更新後の簡易確認ならogp.meが手軽です。問題があればFacebookデバッガーで詳細を確認します。"
      }
    },
    {
      "@type": "Question",
      "name": "ビルドツールを使っていない静的HTMLサイトでコンテンツハッシュを付けるにはどうすればいいですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "手動でファイル名にYYYYMMDD（例：ogp-20260625.png）を付けてog:imageのURLを書き換えるのが最も簡単です。更新のたびに日付を変えるだけでキャッシュバイパスになります。"
      }
    },
    {
      "@type": "Question",
      "name": "og:imageのURLをCloudflareで管理している場合、キャッシュはどこで消せますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Cloudflareダッシュボードの「キャッシュ→設定→カスタムパージ」から特定URLのキャッシュをパージできます。ワイルドカードで画像ディレクトリ全体を一括パージすることも可能です。"
      }
    }
  ]
}
```