デザインワークショップSuplog

2015.02.07

SNSサイトのカバー・プロフィール画像のサイズまとめ

先日YouTubeのチャンネルアートの制作依頼があり、サイズや作成時の注意点などを調べていると結構細かく記載があったので、この機会に代表的な SNSサービスのカバー画像サイズ等をまとめてみました。サイズだけでなく、ファイル形式やデータサイズなども作成する際には参考にして頂けると思いま す。

 

Facebook(フェイスブック)

SNSといえば代表的なイメージのフェイスブックです。利用されている方も多くビジネスでも活用できるのでカバー画像はとても重要ですね。キレイなカバー画像があるとページの印象もぐっと良くなりますね。

 

 

表示サイズはカバー画像が幅851pxで高さが315pxになっています。このサイズより小さい場合は表示サイズまで拡大されて表示されるようです。

またアップロードする画像は最低幅399pxで高さが315px以上である必要があります。キレイに表示させる為にも出来るだけ推奨サイズでのアップロードをおすすめします。

プロフィール画像の表示サイズは幅160pxと高さ160pxの正方形で表示されますが、最低幅180pxと高さ180pxでアップロードする必要があります。また拡大表示の際は幅404pxと高さ404pxで表示されるのでこちらが最大サイズになります。

データ形式や容量については、カバー画像がjpgファイルで100KB未満のものを、またプロフィール画像にはpngファイルが適しているようです。

 

twitter(ツイッター)

おなじみの短文投稿サイトです。友達や親しい人と気軽にやり取りが出来る事に特化したSNSサービスです。企業でも報告や連絡用に導入しているところも多いのではないでしょうか。

 

 

カバー画像は表示サイズが幅1500pxと高さ400pxになっていますが、推奨サイズは幅1500pxと高さ500pxとなっており、カバー画像については100px分が見切れるので注意が必要です。

またプロフィール画像について推奨サイズは幅400pxの高さ400pxになっています。

データ形式と容量ですが、jpg / png / gif(アニメーションgifを除く)となっており、サイズ制限は2MBまでとなっています。

 

Google+(グーグルプラス)

SNSの知名度ではフェイスブックには及ばないものの、独自の機能も魅力的なグーグルプラスです。公開範囲の設定が簡単な点ではプライバシーを守りやすいというメリットもあります。

 

20150206_img_03

 

カバー画像は表示サイズが幅950pxと高さ540pxになっています。アップロード時の推奨サイズは幅1080pxで高さ608pxで表示サイズよりも多きサイズになっています。

プロフィール画像は幅120pxと高さ120pxの円形で表示され、推奨サイズは特に指定は無いですが正方形である事が望ましいようです。

画像のファイル形式はjpg / png /gifとなっています。

 

YouTube(ユーチューブ)

おなじみの動画投稿サイトのYouTubeでは各チャンネルごとにチャンネルアートと呼ばれるカバー画像を設定する事が出来ます。デバイスによって表示サイズが変わるようになっているため、作成時にはレイアウトやデザインに注意する必要があります。

 

 

チャンネルアートですが、表示サイズは下記のとおりデバイスによって異なりますが、推奨サイズは幅2560pxで高さ1440pxとなっています。

データ形式はjpg / png /gif(アニメーションgifを除く) / bmpが対応しています。

各デバイスごとの表示サイズは次の通りです。

 

  • パソコン(最大サイズ) / 幅2560px × 高さ423px ※濃いグレーのエリア(安全領域+柔軟領域)
  • パソコン(最小サイズ) / 幅1546px × 高さ423px ※グレーのエリア(安全領域)
  • タブレット / 幅1855px × 高さ423px ※少し横長に表示されます
  • モバイル /  グレーのエリア(安全領域)が各ディスプレイに合わせて縮小表示されます
  • テレビ / 幅2560px × 高さ1440px(アスペクト比16:9)が表示されます ※黒色のエリア(画像全体)

 

プロフィール画像は、表示サイズが幅98px × 高さ98pxとなり、アップロード時は幅800px × 高さ800pxが推奨されています。

 

以上、代表的な4サイトを例にご紹介いたしました。カバー画像ひとつでページの印象が大きく左右されます。皆様もぜひ自分だけのカバー画像を設定してオリジナリティ溢れるページにしてみてはいかがでしょうか。

  • このエントリーをはてなブックマークに追加
>>記事一覧に戻る