Facebookカバー画像をスマホに対応させる!! | Enjoy Surfer Keisuke の徒然日記

Enjoy Surfer Keisuke の徒然日記

Facebookでサーフィンネタを書きすぎて仕事に差し支える勢いなので、別途でブログを開設します。
ブログはプライベート全開なので、サーフィンのこと、デザインのこと、仕事のこと、、、いろいろ書いていければと思っています。





FACEBOOKページを作る際に上部にトップ画像を設定することになるんだけど、仕様がコロコロ変わってしまい、現在の仕様がどうなってるのか確認してみたので、皆さんにお知らせ。
ネットでググっても古い情報ばかりだったからさ。。。

サイズ的には幅を今まで通りに851ピクセルで設定。
そして高さを638ピクセルに。

パソコンの画面だけを想定して最適化すると、今まで高さ315ピクセルでつくるのが当たり前だったんだけど、今それをやると、スマホで表示した際に左右の画像が消えてしまい、画像の中央部分だけが見える事になるのです。

この消えてしまう範囲に文字なんて入れてしまうと、なんじゃこりゃ?って感じになってしまいます。。。

そこで、4:3の画像を作ってやる訳ですね^^

幅を851ピクセルで考えたとして、4:3の画像をつくるとすると高さは638ピクセルになります。
これで画像の端が切れる事なく表示される画像をつくることができるのです。

それでもって、スマホの場合、上から480ピクセルくらいが表示されます。
ついでに言えば、下の方が黒いグラデーションがかかった状態で。。。

PCで見える部分に関しては、設定する際にドラッグすることで調整ができるので、高ささえ315ピクセル以内に出したいものを表現すればOK!

まあ、今回アップした画像のように、スマホでもプロフ画像やページ名が表示されるから、文字などのPRやキャッチを入れるのであれば、上の方に入れておいた方が良いでしょう。

これらの情報をまとめたのがアップした画像となります。

概ね自分のための備忘録のようなものだけど、まあ皆さん知っててもいい情報だと思ったので、全体公開にしておきます^^

綺麗なFacebookページを作りましょうね~~^^