弊社ではfacebookのカバー写真の制作を頼まれる事もしばしばあるのですが、作ったものをアップすると、なぜか画像が荒れて劣化してしまっています。

なんでーーーー!せっかく綺麗に作ってるのに~。

これではいけない!

ということでfacebookのカバー写真を綺麗に表示するにはどうしたらいいのか調べてみました!
どうも画像をアップすると汚くなってしまうのは、Facebookの仕様のせいのようです。

Facebookのヘルプセンターには、カバー写真の仕様についてこう書かれています。

写真機能が自動的に写真を適切なサイズと画質に調整します。さらに高度な技術を使って写真を編集したい場合は、以下のヒントを参考にしてください。

アップロードする前にサイズを調整します。Facebookは以下のサイズに対応しています。
通常の写真 720、960、2048ピクセル
カバー写真 851x 315ピクセル

2048ピクセルの写真を使用する場合、アップロード時に[高画質]オプションを選択してください。

カバー写真のアップロード時に写真が圧縮されないようにするには、ファイルサイズを100KB以下にしてください。
画像をJPEGファイルで保存し、sRGBカラープロファイルを設定します。


100KB以下以上だと圧縮されてモアレが目立つんですね~。
なので851x 315ピクセルの画像を少し画質を落とした状態でアップするほうが綺麗に表示されることがわかりました。


実際にアップして検証してみた。

普通に100%でアップした場合と80%に画質を落としたものでアップして検証してみました。

普通に100%で保存したものは100KBを超えているので画像にモアレが生じています。



もやもやしちゃってますね。
せっかく作った画像がこんな状態になったらなんだかがっかりですね~。

まとめ

たぶんjpgで80%~70%に画質を落とすくらいが綺麗に表示されると思います。
一度やってみてください。

Facebookのカバー写真などの詳しいサイズ表はこちら

この記事を書いた人

横山 裕子WEBデザイナー

1977年 岐阜県岐阜市生まれ チラシ、パンフレット等のDTP業務を経験後、WEBデザイナーに転向。 現在までに累計400以上のWEBサイト制作を手がけた伝説のWEBデザイナー。スピード、センスともに一流である。