お問い合わせ

tel:0570-046-503

営業時間 10:00~17:00(定休日:土日祝日)

Facebookのプロフィール写真を綺麗に表示できるサイズ

   2015/08/07

facebookプロフィール写真イメージ

Facebookのプロフィール写真は、個人アカウントであればその人のイメージを一番よく伝える画像です。企業や店舗で運営しているFacebookページのプロフィール写真であれば、そのお店やブランドを象徴するロゴマーク等の画像を設定していらっしゃると思います。

そんなFacebookのプロフィール写真について、どの程度の大きさの画像を用意すればきれいに表示されるのか調べてみました。また、各デバイスで表示される大きさや、画像の表示位置が気に入らなかった際の修正方法についてもご紹介したいと思います。

なお、カバー写真については、Facebookのカバー写真を美しく快適に表示するコツでご紹介しておりますので、そちらをご覧ください。

1.プロフィール写真の最低サイズ

Facebook公式ヘルプページによると、Facebookページのプロフィール写真は、最低180x180ピクセル必要で表示の際は正方形になるようトリミングされるとあります。

Facebookページのプロフィール写真最低サイズ:180×180px

縦横180pxといえば、こちらの画像のサイズになりますが、本当にそうなのか確かめてみました。
なお、使用画像の黒枠はサイズを分かりやすくするため表示しており、元の画像に線は入っておりません。

横幅が180px未満

使用画像

最低サイズ確認:縦180px×横100px

縦幅180px 横幅100px

表示結果

縦180px×横100pxはエラー

横幅は180px以上ないとエラーとなることが分かりました。

縦幅が180px未満で中央寄せ

使用画像

最低サイズ確認:縦100px×横180px 中央寄せ

縦幅100px 横幅180px

表示結果

縦100px×横180px 中央寄せの結果

横幅が180px以上あれば、縦幅が180px未満でも縦幅をベースに中央寄せされることが分かりました。
ただし、横幅が100pxの画像を使用しているため、少々ぼけた印象になっています。

縦幅が180px未満で右寄せ

次に気になるのは、画像が偏っていた場合の表示についてです。

使用画像

最低サイズ確認:縦100px×横180px 右寄せ

縦幅100px 横幅180px

表示結果

縦100px×横180px 右寄せの結果

中央寄せの例から予想できましたが、右半分が切れてしまいました。

横幅より縦幅が大きい場合

では、横幅より縦幅が大きい場合はどうなるのか?
分かりやすいようにロゴを右下に寄せた画像で確認してみました。

使用画像

最低サイズ確認:縦200px×横180px

縦幅200px 横幅180px

表示結果

縦200px×横180px の結果

下が少し隠れる形で表示されました。

2.プロフィール写真の表示位置の調整

実際に設定してみると、サイズがあわず表示が偏ってしまった。
そのような場合、サイズがぴったり合うように作り直すという方法もありますが、場合によってはそのまま画像を利用できることもあります。

使用画像

位置調整確認画像

縦幅200px 横幅180px

位置調整手順

  • プロフィール写真をクリックします
プロフィール写真をクリック
  • 「プロフィール写真を変更」をクリックします
プロフィール写真を変更をクリック
  • 表示メニューの中にある「サムネイルを編集」をクリックします
サムネイルを編集をクリック
  • 編集画面が表示されるので、赤枠内をドラッグして位置を調整します
ドラッグをして位置調整
  • 調整が終わったら画面右下の「保存する」をクリックします
保存するをクリック
  • もし画像のように位置がずれていた場合は再度プロフィール写真をクリックします
位置がずれていた場合は再度プロフィール写真をクリック
  • 表示メニューの中にある「写真アルバムから選択」をクリックします
写真アルバムから選択をクリック
  • ドラッグで位置を調整し、画面右下の「保存」をクリックします
位置を調整後、保存をクリック
  • 設定した位置で表示されていることを確認します
修正結果を確認

3.プロフィール写真のデバイス毎の表示サイズ

リアルマックスのロゴを使用して、各デバイス毎の表示サイズを再現しました。

コンピュータ
コンピュータで表示されるプロフィール写真:160×160px
160x160ピクセル
スマートフォン
スマートフォンで表示されるプロフィール写真:140×140px
140x140ピクセル
フィーチャーフォン
フィーチャーフォンで表示されるプロフィール写真:50×50px
50x50ピクセル

フィーチャーフォンになると、一気にサイズが小さくなります。
そのためフィーチャーフォンユーザーに顔を認識してもらいたい場合は、顔が大きく写っている写真を用意しましょう。

まとめ

Facebookのプロフィール写真をきれいに表示させるためには、以下の項目に気をつけましょう。

  • サイズは最低180×180px
  • 横幅より縦幅が大きい画像を使用する場合は、表示させたい部分が一部分に片寄っている画像を選ぶ

また、サイズや位置を変えて表示結果を確認した結果、画像は縦には移動できますが横には移動できないことも分かりました。

横幅より縦幅が大きい画像を使用する際は、横に移動できない点に注意して用意をしましょう。

The following two tabs change content below.
上田 桂子
上田 桂子
2級ウェブデザイン技能士
主にECサイトやWEBサイトの制作を担当しております。
  • ブログランキング・にほんブログ村へ
  • FC2ブログランキングへ
  • 人気ブログランキングへ
  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る