OGPとは？
OGPは、Open Graph Protocol の略称。
OGPは、SNS上でWebコンテンツの内容を伝えるための仕組みです。OGPは、他者がWebコンテンツを拡散する上では、必ずおさえておきたい設定です。
OGPを設定しておくと、SNSでシェアされた時に指定した画像・タイトル・説明文を表示させることができます。（ 一度SNSでシェアしたページは、SNS側でOGP設定がキャッシュされるため、SNSのキャッシュをクリアする必要があります。）
OGPで設定する画像の推奨設定
- 最も目立たせたいモノが上下左右の中央に配置されている。
- 解像度：1200×630
- png画像
基本的な記述
<meta property="og:{プロパティ}" content="{設定内容}" />最低限設定しておくべき6つのOGP設定
<meta property="og:title" content="ページのタイトル見出し" />
<meta property="og:description" content="ページの紹介文" />
<meta property="og:url" content="ページのURL" />
<meta property="og:image" content="表示したいイメージ画像のURL" />
<meta property="og:type" content="ページの種類を記述する。 website / article / blog といった種類がある。" />
<meta property="og:site name" content="ページが所属しているWebサイトの名前" />Facebook用OGP設定
<meta property="fb:app_id" content="App-ID（15文字の半角数字）" />※ App-ID の取得は手間がかかるみたい。
Twitter用OGP設定
<meta name="twitter:card" content="Twitterカードの種類" />
<meta name="twitter:site" content="@[Twitter ID]" />
<meta name="twitter:player" content="@[Twitter ID]" />twitter:card は、twitterでOGPを表示させるときの表示タイプ。
参考サイト
The Open Graph protocol
https://ogp.me/
OGPデバッガー・シミュレーター
https://rakko.tools/tools/9/
OGPとは？設定方法と画像サイズ、表示例＆テクニック集（Facebook、Twitter、LINEごと）
https://mieru-ca.com/blog/ogp/