なんだか og:image のサイズが Facebook で 200px 以上推奨に【仕様変更された】っていう記事ばかり目につきますが、公式アナウンスを見つけるまで信じないよ！と思っている今日この頃。
仕様変更されたことは信じないけど、警告が出るのはいやだから256px四方の正方形に変えました。256px四方の正方形に深い意味はないのですけど。
それはさておき、いいねした後にTimelineで表示される画像のサイズがなんかおかしい(´・ω・`)と思ったので、実験してみました。
今回実験してみたサムネイルのサイズは下図の5種類で、Timelineでの見え方と、Newsfeedでの見え方をキャプチャしました。そして、あくまでも 2012年7月4日現在 の仕様です。
まずは 90px × 90px の正方形
ニュースフィードでの表示
ふつーに正方形に表示されています。
タイムラインでの表示
なんだこれ(´・ω・`)上下の部分どこいった？
余白あるんだしわざわざトリミングしてくれなくていいよ ｡ﾟ(ﾟ´Д｀ﾟ)ﾟ｡
じゃあ噂の 200px 以上を採用して 200px × 200px の正方形
ニュースフィードでの表示
ふつーに正方形。
タイムラインでの表示
ちょっと大きくなった！けど同じじゃないか(´・ω・`)上下の部分どこ？
ではもっと大きい正方形ならどうなるの？ということで 256px × 256px の正方形
ニュースフィードでの表示
正方形ですね。
タイムラインでの表示
やっぱり長方形。でも、200pxの正方形の時と表示部分の大きさが変化しなかったので、最大が 155px × 114px っぽいことはわかりました。
つぎに、Timeline合わせで 155px × 114px の長方形
ニュースフィードでの表示
かたくなに正方形ですね。
タイムラインでの表示
ぴったり☆でも200px以下なのでデバッガーで警告はでます。
ということで警告が出ない具合でTimelineに合わせて 200px × 150px の長方形
ニュースフィードでの表示
正方形です。短辺合わせのリサイズでトリミングされてるのでしょう。確かめていません。
タイムラインでの表示
だいたいぴったりですね。
タイムラインに合わせるよりニュースフィードに合わせたほうがいいと思うので、デバッガーで警告が出ないように考慮した場合 200px × 200px 以上の正方形で良いのではないかなと思いました。
サムネイルがロゴの場合、Timelineでロゴの部分がトリミングされるのはどうなのか・・・
ロゴが切れちゃうのはいかがなものかと思うんです。
なので、200px × 200px 以上の正方形の中に配置するLOGO位置に気をつけよう！と思いました。例えば下の画像は、200px × 200px の正方形にLOGOを配置する位置のサンプルです。グレーの濃い部分（200px × 150px）の中にLOGOを置いてみるテストです。
▼▼▼▼ 結果はこんな感じでした。
ただし、ロゴの形によっては、印象が弱くなる（正方形や縦長のロゴなど、小さくなる）ので、必ずしもこれがベストではないです。参考程度に☆
おまけのお話：「いいね」と「シェア」では Timeline での表示が異なっていた。。。
上がシェアしたときで、下がいいねしたときです。
リンクをシェアした場合は正方形なんですね。
ということで実験終わり！
半年くらい前に、OGPで指定したサムネイル画像の大きさは Facebook Timeline でどうなるの？という記事を書きましたが、この頃の仕様はもう昔のお話のようなので信じないでくださいね。
