Facebookの仕様に記載されているog:imageのアスペクト比についての誤解を解く

FacebookのOpen Graph Protocolの解説ページにはOGPに関する詳しい説明が記載されていますが、og:imageの仕様に関して下記のような記載があります。

og:image – An image URL which should represent your object within the graph. The image must be at least 50px by 50px and have a maximum aspect ratio of 3:1. We support PNG, JPEG and GIF formats. You may include multiple og:image tags to associate multiple images with your page.

Open Graph protocol – Facebook開発者

要はog:imageに利用する画像は、縦横のサイズが50ピクセル以上、アスペクト比は3:1までという仕様のようで、この仕様にあわない画像は取り扱ってくれません。

というような簡単な説明なのですが、あまりに簡単すぎるためか、このog:imageのアスペクト比に関しては、横長の画像なら大丈夫だけど縦長の画像はダメ!という誤解をしている方を、ちらほら見かけます。

アスペクト比の定義

しかしながら、このアスペクト比というのは、Wikipediaによると下記のように解説されています。

アスペクト比(アスペクトひ)またはアスペクト・レシオ(Aspect Ratio)とは2次元形状の物の長辺と短辺の比率を指し示す言葉。

アスペクト比 – Wikipedia

アスペクト比とは長辺と短辺の比率ということになので、縦の長さが横の長さの3倍だったとしても、3:1という比率で表現できるわけですね。

ということで、Facebookのog:imageに利用できる画像の規格は、正しくは長辺の長さが短辺の3倍までの画像となります。

実際に登録してみる

実際に縦長の画像をog:imageに登録してみました。

これを指定したページを、FacebookのURL Linterで読み込ませてみます。

URL Linterにも正しく認識されていますね。