Page Top
OGPは、Webページをソーシャルメディア上でシェアした際に、視覚的に魅力的な情報を表示するための仕組みです。OGPを適切に設定することで、リンクのクリック率やシェアが促進され、認知度向上にも繋がります。
本記事では、OGPの重要性や効果的な設定方法、ソーシャルメディアごとの最適な活用ポイントについて詳しく解説します。
<この記事で紹介する3つのポイント>
目次
OGP(Open Graph Protocol)とは、Webページの情報をSNS上で効果的に表示するためのプロトコルです。簡単に言えば、Webサイトの内容をSNSでシェアした際に、リンクのサムネイル画像やタイトル、説明文などが正しく表示されるようにする仕組みです。
OGPを設定しておくことで、ユーザーがリンクをシェアしたときに視覚的にわかりやすく、魅力的な形で情報を表示できるため、クリック率の向上にもつながります。
OGPのリンクがついた投稿をシェアした際に、適切な画像や説明文が表示されることで、ユーザーの目に留まりやすくなり、クリックされる確率が高まります。そのため、OGP はSNSやメッセージアプリでの情報拡散において重要です。
OGPを設定していない場合でも、SNSに投稿する際に手動でタイトルや画像を追加することで、ある程度は情報を補足できます。しかし、この作業を手動で行うのは手間がかかり、また、見栄えや統一感に欠けるでしょう。
また、OGPが適切に設定されていないと、意図しない画像やテキストが表示される、または何も表示されないこともあり、閲覧者にとって魅力的に映らない可能性があるため注意が必要です。OGPを正しく設定することは、コンテンツの視覚的な訴求力を高め、ソーシャルメディアでの拡散力を強化するために不可欠な要素です。
OGPを正しく設定することで、Webサイトやコンテンツの見え方が改善され、ソーシャルメディア上での効果的な拡散が期待できます。特に、クリック率の向上やシェアの促進、そして認知度のアップにはOGPの設定が欠かせません。
SNSにOGPを設定すると、リンクをシェアした際、ページのサムネイル画像、タイトル、説明文が自動で表示され、リンクが視覚的に豊かになります。ユーザーは投稿を見た瞬間にリンクの内容を直感的に理解できるため、そのリンクが目に留まりやすくなり、結果としてクリック率が向上する効果があります。
特にSNSでは、短い時間で大量の情報が流れるため、いかにして短時間でユーザーの注意を引くかが重要です。単なるテキストリンクだけでは、リンク先がどのような内容なのかがわかりにくいため、ユーザーの関心を引くのは難しいでしょう。サムネイル画像や明確なタイトル、簡潔で魅力的な説明文が付いていると、ユーザーはその投稿をすぐに認識し、興味を持つ可能性が高まります。
OGP設定により、ページの内容が正しく伝わり、ビジュアル的にもインパクトを与えることで、他の情報よりも目立つ存在になります。クリック率が向上すれば、コンテンツの閲覧数やコンバージョンも増加しやすくなるため、OGPはビジネス成果に直接的な影響を与える重要な設定です。
OGPを適切に設定することで、ソーシャルメディア上でのシェアがより活発になる効果も期待できます。鮮やかなサムネイル画像や、キャッチーなタイトル、簡潔で役立つ説明がついていると、リンクの見栄えが良くなり、ユーザーがそのコンテンツを他の人と共有したいという意欲を高めるからです。
シェアが増えれば、コンテンツが広く拡散され、ブランドのリーチの拡大ができます。また、シェアされる回数が増えると、信頼性や影響力も高まります。多くの人にシェアされたコンテンツは、それだけ評価されていると捉えられることが多いため、新たなユーザーも興味深い情報として受け取る可能性が高まるのです。
シェアが積み重なることで、短期間に拡散する効果も期待でき、コンテンツの潜在的な影響力が格段に向上します。
OGP設定により、ソーシャルメディア上でのブランドやサイトの認知度を大幅に向上させることが可能です。リンクに付与するサムネイル画像に、ブランドロゴや商品イメージを使用することで、ユーザーに強くブランドを印象づけられます。
定期的にシェアされるリンクが一貫したビジュアルを持つと、ユーザーはそのブランドやサイトに対して自然と親近感や信頼感を持つようになります。また、OGP設定ではリンクに表示される説明文をカスタマイズすることができるため、ブランドの価値や商品の魅力を的確に伝える文章を入れることが可能です。
このように、ブランドのメッセージや強みを視覚的にもテキスト的にも一貫して伝えられることで、潜在的な顧客に対して深い印象を与え、ブランド認知度の向上に貢献します。
OGPを設定する際、Webページがソーシャルメディア上で適切に表示されるためには、いくつかの構成要素を正しく設定する必要があります。OGPの構成要素には、必須項目と任意項目があり、それぞれがページの表示に大きな影響を与えます。OGPを適切に設定することは、クリック率の向上や認知度のアップに繋がるため、正しく理解しておくことが重要です。
まず、OGPの必須項目として設定しなければならない要素には、ページの基本的な情報が含まれます。具体的には「ページのタイトル」「ページの種類」「サムネイル画像」「ページのURL」「ページの説明文」の5項目です。
必須ではありませんが、設定することでより詳しい情報をソーシャルメディア上に提供でき、表示されるコンテンツの質を向上させる項目があります。
例えば、「サイト名(og:site_name)」を設定すると、リンクの上部にサイト名が表示され、ブランドの認知度を高めることが可能です。これにより、ユーザーはどのサイトから情報が提供されているのかを瞬時に把握でき、信頼感が増します。
また、ページが提供されている言語を指定したい場合は、「og:locale:alternate」を使って追記します。この情報を設定することで、異なる言語環境にいるユーザーがページを正しく理解できるようになります。特に多言語対応のサイトでは、この設定が重要です。
OGPに音楽や動画のコンテンツを使いたい場合は、ページの種類(og:type)に「content」属性を足します。1曲の音楽ならば「music.song」、音楽アルバムであれば「music.album」です。動画の場合は、映画なら「video.movie」、テレビドラマなら「video.tv_show」その他の動画は「video.other」で指定できます。
このような追加設定により、ユーザーのエンゲージメントをさらに高め、視覚的なインパクトを与えることが可能です。
OGPには基本的な設定の流れがあります。OGPを流れに沿って正しく設定することによって、初めてさまざまな効果を発揮します。
まずはOGPを使用することをソーシャルメディアに宣言する必要があります。これは、SNSプラットフォームがWebページを認識し、OGPデータを正しく読み込むための準備段階です。この宣言により、FacebookやX(旧Twitter)などがWebページに含まれているOGP情報の取得が可能です。
具体的には、Webページのhead要素へ、次のように「prefix」属性を追記します。
<head prefix=”og: https://ogp.me/ns#”>
この宣言を行っていないと、OGPが設定されていたとしても、ソーシャルメディア側が正確に読み取れない可能性があります。
なお、OGPの詳細設定は、「meta」要素に「property」属性を加えて指定していきます。
シェアされるページのURLとページの種類を設定します。URLはそのページの正確なアドレスで、ユーザーがリンクをクリックした際にどこへ移動するかを決定します。
具体的には、次のように記述します。
<meta property=”og:url” content=”ページのURL”>
「ページのURL」には、表示させたいページのURLを記載します。
また、ページの種類も指定します。例えば、一般的なWebページなら「Webサイト」、ブログやニュース記事なら「記事」、動画であれば「動画」というようにページのカテゴリーを選ぶことがページの種類の指定です。
具体的には、次のように記述します。
<meta property=”og:type” content=”ページの種類”>
トップページへリンクさせたい場合は、「ページの種類」に「website」と、それ以外の場合は「article」と記載します。
ページのタイトルと説明文は、シェアされた際に表示される重要な情報です。タイトルは、ユーザーにページの魅力を伝える最初のポイントであり、キャッチーで分かりやすいものにすることが推奨されます。
具体的には、次のように記述します。
<meta property=”og:title” content=”ページのタイトル”>
「ページのタイトル」には、サイトや記事のタイトルを入力します。
説明文は、ページの概要や特徴を簡潔にまとめ、ユーザーがリンクをクリックしたくなるような内容を記載します。適切なタイトルと説明文を設定することで、ユーザーの興味を引き、シェアやクリック率を向上させることが可能です。
具体的には、次のように記述します。
<meta property=”og:descripion” ctontent=”ページの説明文”>
「ページの説明文」部分に、表示させたい文章を記載します。文字数は、80~90字程度にまとめましょう。それ以上長い文章は、途中で表示されなくなる恐れがあります。
シェアされた際に表示されるサムネイル画像と、ページが属するサイトの名前を指定します。
サムネイル画像は、視覚的に最も目立つ部分で、ユーザーの目を引きつける要素です。
画像は高解像度で、ページやブランドの魅力を伝えるものを選ぶことで高い効果を発揮します。
具体的には、次のように記述します。
<meta property=”og:image” content=”画像のURL”>
「画像のURL」へ、サムネイルに設定したい画像のURLを記載します。
また、サイト名を設定することで、ユーザーはどのブランドやサイトがこのコンテンツを提供しているのかを一目で理解することが可能です。
具体的には、次のように記述します。
<meta property=”og:site_name” content=”サイト名” />
「サイト名」へ表示させたい文字列を入力します。
OGP(Open Graph Protocol)の設定は、プラットフォームによって微妙に異なる表示の仕方があります。
X(旧Twitter)では、HTMLにて行ったOGP設定に加え、「Twitterカード」という独自のメタデータも使用することが推奨されています。Twitterカードを設定することで、ツイートにURLが含まれている場合にリンク先の情報がリッチな形式で表示され、画像、タイトル、説明文が一緒にポスト内に表示されます。
また、ポスト内に必要な情報が表示されることにより、ポストが視覚的に魅力的になり、クリック率やエンゲージメントが向上する効果があります。
具体的な設定としては、まずOGPタグを用いてタイトルや説明文、画像を指定します。それに加えて、Twitterカード用のタグを追加することで、Xのプラットフォーム上でリンクがよりリッチに表示されるようにします。
XにはいくつかのTwitterカード形式があり、よく使われるのが「サマリーカード(Summary Card)」です。これは、小さな画像と共にタイトルや説明文が表示される形式です。
具体的には以下のように記述します。
<meta name=”twitter:card” content=”summary”>
また、画像を大きく表示させたい場合は「サマリーカード・ウィズ・ラージ・イメージ(Summary Card with Large Image)」を選びましょう。視覚的なインパクトが強い方が目を引くため、商品やサービスのプロモーションには「ラージ・イメージ」カードが適しています。
具体的には以下のように記述します。
<meta name=”twitter:card” content=”summary_large_image”>
設定が終わったらXのデベロッパーツール「Card Validator」を使って、正しく表示されるかどうかの確認が可能です。
Facebookは、OGPが最も広く使われているプラットフォームのひとつです。OGPメタデータを正しく設定することで、リンクがシェアされた際に画像、タイトル、説明文などが自動的に表示されます。なお、Facebook特有のOGP設定などはなく、HTMLにて追記した属性が反映されます。
FacebookのOGP設定において最も重要な要素は、サムネイル画像、タイトル、説明文の3つです。特にサムネイル画像は大きく表示されるため、解像度の高い画像を用意し、最低でも1,200ピクセルx630ピクセル以上のサイズを推奨しています。
また、タイトルや説明文もシンプルでわかりやすいものを設定することで、Facebookのフィードで目にしたユーザーに効果的なアピールが可能です。
Facebookで設定したOGPの内容が正しく反映されているかどうかは、Facebookの「シェアデバッガー」を使って確認できます。シェデバッガーを使用すると、シェア時にどのように表示されるかを事前にチェックでき、問題があれば修正が可能です。
また、Facebookは定期的にキャッシュを更新するため、内容が古い場合はこのツールでキャッシュのクリアもできます。
OGPを正しく設定しても、実際にソーシャルメディアでどのように表示されるか確認することが重要です。設定が正確であれば、魅力的なタイトルや画像、説明文がシェアされた際に正しく表示され、クリック率やシェアの促進が期待できます。
OGP画像シミュレータは、設定したOGP情報がSNS上でどのように見えるかを表示するツールです。画像シミュレータを使用することで、実際にシェアされる前に、画像やテキストが正しく表示されるか、または設定に漏れがないかを視覚的に確認できます。
特に、サムネイル画像やタイトル、説明文のレイアウトやサイズが意図した通りに表示されるかを事前に確認できるのがポイントです。
また、各SNSの表示形式に対応しているOGP画像シミュレータもあります。このようなツールを利用することで、各SNSでどのようにリンクが見えるかのプレビューを確認できます。これにより、設定のミスや画像のサイズが小さすぎるといった問題に早期に気づくことができ、修正することが可能です。
複数のSNSでシェアする場合も、シミュレータでそれぞれのプラットフォームに応じた最適な表示を確認することが大切です。
OGPの確認方法として、FacebookやX(旧Twitter)などのソーシャルメディアプラットフォームが提供している公式のシェアデバッガーツールがあります。シェアデバッガーツールを使うことで、実際にOGP情報がどのように解析され、表示されるかを確認できると同時に、問題があれば修正ポイントも教えてくれます。
例えば、Facebookの「シェアデバッガー」は、URLを入力するだけで、そのページがシェアされた際にどのように表示されるかのプレビューを表示します。また、キャッシュのクリアも可能で、以前にキャッシュされた古い情報が表示されないようにすることが可能です。
同様に、X(旧Twitter)の「カードバリデーター(Card Validator)」を使用すれば、ツイート内でのリンクがどのように表示されるかを確認できます。これらのデバッガーツールは、URLがシェアされる際に正しいOGP情報が反映されているか確認するのに有効です。
もし設定に誤りや不足があった場合、エラーメッセージや改善のヒントが表示されるため、適切に修正できます。デバッガーツールは無料で利用でき、定期的にチェックすることで、OGP設定が最新の状態に保たれているか確認できます。
OGPを正しく設定することで、ソーシャルメディア上でページがシェアされた際に魅力的なビジュアルと適切な情報が表示されます。しかし、設定ミスや不備があると、意図しない表示になってしまうことがあります。
OGPを設定する前に、自分のWebサイトやプラットフォームがOGPをサポートしているかを確認することが重要です。特に、CMSを使用している場合、プラグインやカスタムコードによるOGP設定が可能かどうかの確認は欠かせません。
多くのCMSやWebサイトビルダーにはOGPメタタグを自動的に生成する機能や専用のプラグインが用意されています。しかし、すべてのプラットフォームが自動生成機能やプラグインに対応しているわけではありません。
また、OGPの設定が可能であっても、管理画面上で設定方法がわかりにくいこともあるため、ドキュメントやサポートを活用しながら正しく設定を進めることが重要なポイントです。OGPのサポートが確認できた後、タイトルや説明などの必須項目がきちんと設定されているかを確認し、不足している場合は追加する必要があります。
OGPで設定する画像が小さすぎたり、または解像度が低かったりする場合、見栄えが悪くなり、シェアした際の視覚的な効果が大きく損なわれます。そのため、適切な画像サイズを設定することが非常に重要です。
推奨される画像サイズは、最低でも1,200ピクセルx630ピクセル以上です。FacebookやX(旧Twitter)などの多くのプラットフォームでは、このサイズを基準としています。画像が表示されないトラブルを避けるために、ファイルサイズを過度に大きくしないことに注意しましょう。画像のファイル形式はJPEGまたはPNGが一般的です。
また、縦横比にも注意が必要です。OGPでは、横長の画像が好まれるため、横3:縦2の比率を保つと、ソーシャルメディア上で最適に表示されます。縦長の画像は表示される範囲が狭くなることがあるため、見栄えを考慮し、横長の画像を選ぶことが重要です。
OGP(Open Graph Protocol)を活用してソーシャルメディア上での効果を最大化するためには、いくつかの重要なポイントに注意する必要があります。各ページの内容に応じてOGPを適切に設定することで、視覚的にも内容的にもユーザーに対して強い訴求力を持たせることが可能です。
OGPを効果的に活用するための第一のポイントは、サイト内の各ページに独自のOGP設定を行うことです。多くのWebサイトでは、サイト全体に共通のOGPを設定しています。しかし、共通のOGPを設定すると個々のページの内容を反映できないため、シェアされた際にそのページの具体的な価値を伝えることが難しくなります。
特に、製品ページ、ブログ、ニュース記事など、異なるコンテンツタイプがある場合には、それぞれのページで異なるOGPを設定し、そのページ特有の魅力を伝えることが大切です。
ページごとのOGP設定では、タイトルや説明文にページで取り扱っている具体的な情報を反映させることでページの訴求力が高まります。例えば、製品ページではその製品の主な特徴やメリット、ブログ記事ではトピックに即した要点をタイトルと説明文に盛り込むと効果的です。
また、画像もコンテンツに合わせたものを設定することで、視覚的に興味を引くことができます。これにより、シェアされたページの内容がソーシャルメディア上で正確に伝わり、ユーザーの関心をより強く引き付けることが可能です。
OGPの設定を各ページで使い回さないことも、OGPの効果を上げるための重要なポイントです。ページに合った情報を設定することで、ユーザーに対して明確なメッセージを伝えられるからです。
同じOGP情報を複数のページに設定すると、ユーザーは各ページの違いを認識できず、どのページをクリックするか判断に迷ってしまう可能性があります。そのようなリンクではコンテンツの差別化がなされなくなり、結果的にクリック率が下がりかねません。
異なる内容のページには、それぞれ固有のタイトルや説明文を設定し、サムネイル画像もそのページに合ったものにすることが重要です。
特に、複数の製品ページやサービス紹介ページがある場合は、それぞれの製品やサービスの個別の特徴を反映したOGPを設定することが求められます。
例えば、A商品とB商品のページに同じタイトルや画像を使用した場合、ユーザーはそれぞれの違いを認識できません。そのため、A商品の特徴を強調したOGP、B商品にはそれに応じたOGPを設定し、各ページが持つ独自の魅力を強調することで、クリックされる確率が高まります。
X(旧Twitter)の場合、OGP設定の中でも特にディスクリプション(説明文)の最適化が重要です。
Xは140文字前後の短文で情報を伝えるプラットフォームであり、リンクの説明文も短い形式で表示されます。リンクの説明文が短い形式で表示されるため、ディスクリプションは簡潔でありながらも、コンテンツの核心を効果的に伝える内容にすることが重要です。
X上でリンクがシェアされた際、表示されるディスクリプションは数秒でユーザーの目に留まるかどうかを左右します。そのため、特に強調したいポイントやユーザーに対しての訴求点を明確にすることが大切です。
例えば、製品のセール情報や新機能の紹介であれば、「今だけ限定価格!」「最新アップデートで新機能をお試しください」といった魅力的なコピーを使用し、クリックを誘導する仕掛けを取り入れるのが効果的です。
ディスクリプションに魅力を感じたユーザーがリンクをクリックし、ページにアクセスすることで、コンバージョンやサイトへの滞在時間が増加する可能性が高まるため、XでのOGP設定においては、ディスクリプションを適切に最適化することが重要なポイントとなります。
X(旧Twitter)では、より多くのユーザーにリーチでき、投稿が拡散されるためにも、ディスクリプション内にハッシュタグやアカウント名を加えましょう。
ハッシュタグを使うことで、そのトピックに興味を持っているユーザーや、特定のキーワードで検索しているユーザーが投稿を見つけやすくなります。特にキャンペーンやイベントに関連する投稿では、専用のハッシュタグを使うことで投稿の露出を増やし、関連する話題に興味を持つ新規ユーザーへのリーチが可能です。
また、アカウント名を含めることで、公式アカウントの存在をユーザーに周知でき、投稿からアカウントのフォローにつなげられる可能性が高まります。
例えば、Xで製品のプロモーションを行う際に、ディスクリプションに「#セール」「@公式アカウント」のような形式でハッシュタグやアカウント名を追加することで、プロモーションの内容が広まりやすくなります。これらの施策は、フォロワーを増やしたり、購入意欲を高めたりするのに効果的です。
OGPは、ソーシャルメディア上でページを効果的に表示し、クリック率やシェアの促進、ブランド認知度の向上を図る重要なツールです。ページごとに適切なOGP設定を行うことで、コンテンツの訴求力を高め、ユーザーの目を引きます。
また、X(旧Twitter)やFacebookでは、特有のディスクリプションやハッシュタグの活用が拡散力を強化します。OGPを細かく設定することで、ホームページの訴求力が高まり、コンバージョンを増やすことができます。基本のルールを守って正しくOGPを設定しましょう。
OGPを使ったSNS戦略をお考えでしたら、DYMへご相談ください。SNS広告やSNSアカウント運用代行などを支援いたします。
DYMの「WEB事業」サービスページはこちら
「世界で一番社会を変える会社を創る」というビジョンのもと、WEB事業、人材事業、医療事業を中心に多角的に事業を展開し、世界で一番社会貢献のできる会社を目指しています。時代の変化に合わせた新規事業を生み出しながら世界中を変革できる「世界を代表するメガベンチャー」を目指し、日々奮闘しています。
SNS広告
(Instagram、Facebook、Twitter、LINE、TikTok)
SNSアカウント運用代行
(Instagram・Facebook・Twitter・LINE・TikTok・Youtube)