先日、アメブロのヘッダー部分をカスタムしたお話ししました。

 

 


 

 

 

 

で次は、アメブロ用に作ったヘッダー画像を、FacebookやTwitter、ホームページも同じものに、と変更作業中工事中

 

 

 

FacebookページとTwitterは、変更完了グッド! しました。

 

 

 

同じ画像を使うといっても、アメブロ、Facebook、Twitter、それぞれ表示される画像サイズが違うので、すこし編集が必要になります。

 

 

 

さらにFacebookの場合は、PC表示とスマホ表示では画像の縦横比が違います

 

 

 

 

 

Facebookカバー画像のPC用サイズとスマホ用サイズについて

 

Facebookのカバー画像サイズは、

  • PC用・・・「828×315ピクセル」
  • スマホ用・・・「640×360ピクセル」

です。

 

 

 

― Facebookヘルプセンター ―

Facebookページのプロフィール写真やカバー写真のサイズはどのくらいですか。より

 

 

 

PC用はスマホ用より横長な画像サイズなのです。

 

 

 

 

 

パソコン表示 

828×315ピクセルの画像

 

 

スマホ表示

左右が切れてしまいます。

 

 

 

 

 

どっちも不自然じゃない画像を用意するには、

 

  • PC用の縦横比で作成して、スマホで左右が切れてもいいようにデザインする。
  • スマホ用の縦横比で作成して、PCで上下が切れてもいいようにデザインする。

 

のいずれかになりますよね。

 

 

 

私は後者の方にしました。

 

 

 

 

 

 

 

 

ひらめき電球 ポイント ひらめき電球

 

スマホ用の「640×360ピクセル」で作成すると、PCに表示させる際、画像が拡大されて粗い画像になってしまいます。

なので、「640×360ピクセル」ではなく「851×555ピクセル」で作成します。

 

 

 

 

すると、

 

 

 

PC表示では上下が切れています。

 

 

 

 

 

スマホではすべて表示されています。

 

 

 

 

 

同じデザインになって、キラキラすっきり キラキラ

 

 

 

 

 

Happy Cloverでは、各サイズに合わせたヘッダー画像の作成も承ります。

また、「自分で作成したいのにわからないところがある」という方のお手伝いもいたします。

お気軽にご相談くださいね音譜

 

 

 

 

 

「Happy Clover」ってはてなマーク

 

 

「Happy Clover」の

「パソコン操作個別レッスン」

 

 

つながってくださる方、募集中 ビックリマーク
よろしくお願いしますぺこり音譜