こんにちは。GIGのディレクター林です。

Webサイト制作やリニューアルの現場で、「OGPを設定したのにSNSで表示が変わらない」「faviconを差し替えたはずなのに検索結果が以前のまま」といった相談を受けることがよくあります。

CMS上では正しく設定できているように見えても、じつはSNSや検索エンジン側の仕様やキャッシュが原因で、意図した表示にならないケースは少なくありません。

本記事では、新規サイト・リニューアルサイトそれぞれのケースに分けて、OGP・favicon設定時の注意点と、表示が変わらない原因・対処法を実務目線で整理します。

林 瑞希（はやし みずき）：PM事業部ディレクター。関西外国語大学外国語学部を卒業後、新卒で株式会社GIGに入社。コーポレートサイトや採用サイトを中心に新規サイト制作の企画・設計・進行管理などのPMやディレクション業務を担当。最近は先輩の影響で登山にはまりそう。

OGP・faviconの基礎知識

まず最初に「OGP・faviconってなんだろう？」という方もいると思うので、どういったものなのかをご説明します。

OGPとは

OGP（Open Graph Protocol）は、SNSでURLがシェアされた際の表示内容を制御する仕組みです。

上記の画像のように、XなどのSNSにURLを載せると設定されている画像やタイトルなどが表示されます。

 OGPでは主に以下の情報を指定します。

・og:title：表示されるタイト
・og:description：説明文
・og:image：サムネイル画像
・og:url：正規URL

SNSごとに多少の差はあるものの、これらが正しく設定されていないと意図しない表示になります。

faviconとは

faviconは以下のような場所で使用されるサイトアイコンです。

・ブラウザのタブ
・ブックマーク
・Google検索結果
・スマートフォンのホーム画面

PCのブラウザでタブがずらっと並んでいるときは、このfaviconに何度助けられただろうか……。

ちなみに私たちは普段これらをGoogleのディベロッパーツールや拡張機能を使用して問題なく設定できているかどうかを確認しています。

【新規サイト】CMSでOGP・faviconを設定する際の注意点

新規サイトの場合、リニューアルに比べて過去のキャッシュが存在しない分、比較的トラブルは少なめですが、以下の点は押さえておく必要があります。

CMSの「共通設定」と「ページ個別設定」

CMSによっては、

・全ページ共通のOGP設定
・ページ単位で上書きできるOGP設定

が存在します。

どちらが優先されるかを把握せずに設定すると、意図しないOGPが出力されることがあります。

新規であっても間違ったOGPやfaviconを最初に登録したままサイトを公開をしてしまうと、公開後すぐに変更をしても一定期間表示が変わらない……というケースもあるので設定時には注意が必要です。

og:imageの仕様

SNSで安定して表示させるためには、以下を満たすのが無難です。

・1200×630px以上
・比率 1.91:1
・容量は1MB以下推奨

【リニューアル】CMSでOGP・faviconを設定する際の注意点

リニューアル案件では、設定が正しくても表示が変わらないケースが頻発します。

何も知らないときは不安に感じますが、理由さえ分かれば落ち着いてすぐに対応することが可能となります。

URLが同じ場合はキャッシュが残る

URLを変えずにデザインや構成だけをリニューアルすると、SNSや検索エンジン側では「同じページ」と認識され、 過去のOGP情報がキャッシュされたままになります。

なかなか新しいOGPやfaviconに変えられない時はこれが原因のことが多いです。では、その主な原因と解決策について詳しく見ていきましょう。

SNSで表示がリニューアル前と変わらない主な原因

よくある原因は以下です。

・SNS側のキャッシュが残っている
・og:imageのURLが変更されていない
・301リダイレクト前のURLが参照されている
・開発環境の表示を本番と勘違いしている

SNS上で変わらないのは「設定が間違っている」のではなく、キャッシュによる仕様であるケースが大半となります。

「あれ、OGPやfavicon変わらないかも？」となったときは一度上記が問題なく設定されているか確認してみてください。

SNSごとのキャッシュ仕様と確認方法

ちなみにSNSのキャッシュは思っているよりも強力で、SNS側で待っていれば変わる場合もありますが、長い場合で1週間もかかるケースもあるようです。

とは言っても急いでキャッシュをクリアさせたい人も中にはいるはず。

そんな方はツールを使用することで解消できるケースもあるので、該当するSNSによって対応内容を変える必要があります。

・Facebook / Instagram
 → Facebook Sharing Debugger で「Scrape Again」
・X（旧Twitter）
→ Card Validator（反映に時間がかかることあり）
・LINE
 → キャッシュが非常に強力。URL変更が必要な場合もある

私も以前Xのキャッシュが残ってしまい、OGPが変わらないという状況になった際に、Card Validatorを使用して1時間程度で解消したケースがありました……。

とくにSNSで宣伝などをよく行うクライアントの場合は注視されるケースが多いので、制作側はご注意ください。

 Google検索結果でfaviconが変わらないケースと対処法

SNSとは別で、Google検索結果のfaviconが変わらないという相談も多くあります。こちらもSNSと同じく原因があるので、見ていきましょう。

主な原因

次のようなことが主な原因として挙げられます。

・Google側のクロール・インデックスが更新されていない
・faviconのファイル名・URLが以前と同じ
・サイズ・形式がGoogle推奨を満たしていない

そのためGoogle検索では、以下の仕様が重要です。

・正方形
（48px以上推奨）
・PNG / SVG / ICO形式
（ちなみにGoogleは「.ico」形式のファイルでの登録を推奨しているので、なかなかうまく登録されない時は一度.icoで登録してみましょう）
・/favicon.ico もしくは link rel="icon" で明示

対処法

まずは以下のような点を確認してみてください。

・faviconのファイル名・パスを変更する
・Search Consoleでインデックス再登録をリクエスト
・反映まで数日〜数週間かかる前提で待つ

Google検索のfaviconは即時反映されない仕様のため、SNSと同じ感覚で確認しないことが重要です。

早めに解消したい場合はGoogleにクロールをリクエストすることで、「早く見てね〜」という連絡をGoogle側に行うことが可能になります。

まとめ

OGP・faviconは、「CMSで設定して終わり」ではなく「表示確認とキャッシュ対応まで」がセットです。

とくにリニューアル案件では、表示が変わらない＝失敗ではなく、仕様通りであるケースも多いことを理解しておく必要があります。 「SNS・Google検索の反映には時間がかかる場合がある」 と認識しておくだけでも、不要な不安や手戻りを減らせます。

今回OGP・Favion等がうまく表示されないという方はぜひチェックしてみてくださいね。

株式会社GIGでは、Web制作を通じて戦略設計からデザイン、開発、運用まで一貫してサポートし、お客さまのビジネス課題を解決しています。ぜひWeb制作を検討されている方はお気軽にお問い合わせください。

また、私たちと一緒に働きたいディレクターやデザイナー、エンジニアも積極募集中です。ぜひご応募お待ちしております。

■株式会社GIG
お問い合わせはこちら
採用応募はこちら（GIG採用サイト）
採用応募はこちら（Wantedly）

林 瑞希

PM事業部ディレクター。関西外国語大学外国語学部を卒業後、新卒で株式会社GIGに入社。コーポレートサイトや採用サイトを中心に新規サイト制作の企画・設計・進行管理などのPMやディレクション業務を担当。最近は先輩の影響で登山にはまりそう。