アレっぽいやつ

web系エンジニアがカチャカチャ書く

FacebookのOGP画像サイズについてまとめる

Facebookでシェアされたときに表示される画像を

<meta property="og:image" content="https://example.com/exmample-image.png">

で設定した場合の、サイズについてまとめる(下記を参照)

https://developers.facebook.com/docs/sharing/best-practices#tagsdevelopers.facebook.com

最低限守るべきこと

最小画像サイズ : 200 x 200ピクセル

最大ファイルサイズ : 8MB

最適化

アスペクト比 : 1.91:1
(PC,モバイル共通で、アスペクト比が違う場合はこのアスペクト比に切り取られる)

推奨画像サイズ 1200 x 630 以上 (600 x 315未満の画像だと大きい画像で表示されない)

f:id:pechokan:20170218133435p:plain

f:id:pechokan:20170218133724p:plain
引用:ベストプラクティス - シェア機能 - ドキュメンテーション - 開発者向けFacebook

ちなみに画像サイズのシュミレーションは

OGP画像シミュレータ | og:image Simulator

で確認できる。

注意点

og:image が正しく反映されているか、

https://developers.facebook.com/tools/debug/og/object/
で確認する。

関連

pechokan.hatenablog.com