【2017年版】Facebookページを使っていますか?ここで良く問題となることに、カバー写真のサイズはどれくらいが良いのでしょうか?ということがあります。Facebookが公式に発表している推奨サイズはこちらのページに記載されています。コンピュータでは幅820ピクセルx高さ312ピクセル、スマートフォンでは幅640ピクセルx高さ360ピクセルの大きさでページに表示されます。https://www.facebook.com/help/125379114252045なるほど、しっかり明記されていますね。このサイズを鵜呑みにしてしまうとPCは良くてもスマホでの写真が思うようにならないことがありました。PCではきちんと表示される画像が、スマホでは両サイドが大きく欠けてしまったり。最適なサイズはどれくらいなのでしょうか?どうやら大きく分けると2つのサイズに絞られるようです。それでは解説してみましょう。820×360(ピクセル)で作りますスマホで見た場合、ある程度欠ける部分を理解して画像を用意するのがポイント!FacebookのPCの推奨サイズに合わせてカバー写真を作ると、スマホで両端が大きく欠けてしまいます。これをある程度見越し、欠けても良い範囲を両サイドに設ける画像を作ります。絶対に欠けてはいけない部分は640×312(ピクセル)の範囲に収めるようにし、最終的に820×360(ピクセル)の画像を作るという感じです。ロゴや文字や人物など絶対に欠けてはいけない物は、この範囲に収めると良いでしょう。※検証した結果、iPhoneではこちらの方が後述するケースよりも高画質であったことも追記しておきます。820×461(ピクセル)で作りますスマホ表示を優先し、PCの画像よりあらかじめ縦に大きな余白を持ったサイズを用意するのがポイント!スマホでの表示を重視し、両サイドを幅一杯にスマホでも表示させたいという場合にはこちらのサイズで画像を作ると良いでしょう。PCでは大きな余白部分ができますが、画像を選ぶ際に上下にスライドして良い位置を選ぶことができます。スマホ表示ではPCでは欠けている部分も含め、画像全てが見えるということになります。ポイントは、PC表示できちんと表示される高さの312pxの範囲に、見せたいものを収めるということになります。ちなみに高さの461pxはどこから来ているのか?ということなのですが、これはスマホの縦横比を基準に算出しています。820:461ということになります。まとめ:スマホ表示をどれほど重視するかという点が決め手になりますいかがでしたか?どちらのサイズを選んでも幅は820pxで作ります。高さがそれぞれ違うんですね。Facebookの仕様上の問題で、いずれの方法を選んでもスマホ表示での画質が著しく劣化する場合があります。選ぶ画像によってもその印象は変わりますが、スマホの横持ちなどで見る場合は、かなり荒く見えてしまう場合がありました。iPhoneかAndroidか、どうも機種によってもこの辺は違うようです。今のところ、万能のサイズはないのかもしれません。カスタマイズとデザイン教科書Webデザイナー養成講座WEB制作者向けのジンドゥーカスタマイズ決定版!BEEの代表が共著で執筆しています。Amazon、または全国の書店でご購入いただけます。人気講師が教える本格ホームページの作り方ご好評をいただいております!BEEの代表が共著で執筆しています。Amazon、または全国の書店でご購入いただけます。