デザイン担当のAKです。
ホームページやブログなどのWebページをSNSでシェアすると、自動的に画像が表示されると思います。
これは貼り付けたURLで使用している画像が読み込まれるのですが、勝手にトリミングされるのでわかりにくくなってしまう場合があります。
あらかじめ専用の画像を準備しておくと、意図どおりに表示することができます。
FacebookのOGP画像がそれにあたるのですが、画像の他にも一緒に指定が必要な内容がありますので、詳しくは公式ドキュメントをご参照ください。
※Facebookはちょこちょこ仕様変更があるので必ず公式サイトから最新情報を確認しましょう。
「適切なOpen Graphタグを使用する（Facebook／ベストプラクティス）」
画像の推奨サイズは横1200ピクセル×縦630ピクセルですが、画像の縦横比（アスペクト比）が1.91:1になっていれば大丈夫です。
ただし正方形の状態で表示されることもあるので、左右がトリミングされてもいいようにロゴなどの必要な情報は中央に置くようにします。
逆に正方形の画像を使うと、上下がトリミングされて中央の1.91:1部分が表示されることになります。
こちらのサイトでは、実際にどのように表示されるかがチェックでき便利です。
「OGP画像シミュレータ」
保存形式はPNGが推奨されていますが、JPEGに比べてデータサイズが大きくなってしまうので、こちらのサイトなどで必ず圧縮してからアップしましょう。
「TinyPNG」
そしてOGP画像を設定したのに反映されない！と困ったときにはこちらからキャッシュをクリアしましょう。
「シェアデバッガー（Facebook）」
どうぞ試してみてください。
