OGPとは“Open Graph Protocol（オープン グラフ プロトコル）”の略で、FacebookやTwitterなどのSNSにURLがシェアされた際、そのページのタイトルやURL、画像、概要などを表示させるシステムのことです。
大手ニュースサイトの記事をSNSでシェアすると、記事の内容をイメージできる画像が表示されると思います。
これはそれぞれのサイトがOGPの設定をしているから表示されているのであり、自動で表示される仕組みにはなっていません。
例えばOGPの設定ができていないページのURLをTwitterでシェアすると以下のように表示されます。
画像が表示されないので、せっかくシェアされても一目で内容が伝わりにくくなってしまいます。画像がある場合とない場合、どちらの方がクリックされやすいかというのは言うまでもないでしょう。
htmlをある程度理解できていれば比較的簡単に設定することができるので、自社サイトのOGPを設定していない場合は設定しておくことをおすすめします。
OGPについて詳しく知りたい方は以下をご覧ください。
目次
●他のサイトでの説明
いまさら聞けない！OGPとは？ | ホームページ制作・作成なら大阪のweb制作.com
https://www.e-webseisaku.com/column/marketing/3947/
OGPとは – Content Hub（コンテンツハブ） | ナイル株式会社
https://cont-hub.com/knowledge/glossary/ogp/
●OGP画像を設定するコツ
URLをシェアする概念の強いSNSであるFacebookとTwitterではOGPの設定の仕方が異なるのですが、特にFacebookは設定が難しいです。
というのも、FacebookではOGP画像が横長で表示されたり、正方形で表示されたりすることがあるため、どちらで表示されても大丈夫なように画像をデザインする必要があるのです。
FacebookでOGP画像がどのように表示されるかをチェックするには以下のサイトを使うとわかりやすいです。
OGP画像シミュレータ | og:image Simulator
http://ogimage.tsmallfield.com/
例えばこの縦長に写った東京スカイツリーの画像をOGP画像として設定したとしましょう。こちらをOGP画像シミュレータでチェックしてみると以下のようになりました。
正方形の画像はツリーの先端がトリミングされたため東京スカイツリーだと認識できますが、横長の画像はツリーの中央部分が切り抜かれてしまいました。これでは何の画像なのかわかりにくいですよね。
続いて、横長の画像で人物が左側に寄っている写真でチェックしてみました。
すると今度は正方形の画像が意味不明になってしまいました。これではOGP画像を設定していてもしていなくても同じです。
このように、OGP画像を設定する場合はSNSで実際にどのように表示されるかまでチェックしておくことが重要となります。
●復習クイズ
説明がわかりづらい、間違っているなど御指摘ありましたらお問い合わせよりご連絡いただけると幸いです。
