facebookやtwitterを運営する際、こだわった画像を作ろうと思っても、適切なサイズを知るのに一苦労・・なんてことありますよね。
今回はメジャーなSNSやサイトで設定するヘッダーやアイコンの推奨サイズをまとめてみました。
ぜひお役に立ててくださいね。
【各種SNSのサイズ表】facebook・twitter・アメブロ・YouTubeなどのヘッダー&アイコンの推奨サイズ
サイズ一覧
各種SNSのサイズ一覧です。
下の表に記載されている「PC」=パソコン、「SP」=スマートフォンのことです。
サイト名 | 項目 | サイズ | 備考 |
カバー画像(ヘッダー) | 横820px ×縦360px | PC=横820px×縦312px
SP=横640pxx縦360px |
|
アイコン | 横170px縦170px | PCでは170x170px、
SPでは128x128px |
|
カバー画像(ヘッダー) | 横1500px×縦500px | ||
アイコン | 400×400 | ||
YouTube | チャンネルアート(ヘッダー) | 横2560px × 縦1440px | ◆TV:横2560px × 縦1440px (表示サイズの最大値) ◆Desktop:横2560px × 縦423px ◆Tablet:横1855px × 縦423px ◆Desktop:横1546px × 縦423px (表示サイズの最小値。ロゴやテキスト、見切れると困るものはこの範囲内に入れる。) |
YouTube | エンドカード | 横1280×縦720px(もしくはその比率 横1920px×縦1080pxなど) | |
YouTube | サムネイル | 横1280×縦720px(もしくはその比率 横1920px×縦1080pxなど) | |
アメブロ | ヘッダー新サイズ | 横1120px×縦300~400px | |
アメブロ | ヘッダー旧サイズ | 横980px ×縦300~400px | |
ココナラ | プロフィールヘッダーサイズ | 横2560px ×縦840px | |
ココナラ | サービス(出品)ページのサムネイル | 【制作系】 横1220px×縦1240px【その他】 6:5(横:縦) |
「似顔絵・イラスト・漫画」、「デザイン」、「動画・写真・画像」、「Webサイト制作・Webデザイン」カテゴリのみサービス画像を最大1220px×1240px
|
Facebookのカバー画像(ヘッダー)&アイコン
Facebookのカバー画像(ヘッダー)
フェイスブックのカバー画像は、
パソコンのカバー画像(ヘッダー)表示サイズが横820px×縦312px。
スマホのカバー画像(ヘッダー)表示サイズが横640pxx縦360pxとなっています。
画像自体は、820px×360pxで作成しましょう。
またアイコンの表示位置が、
パソコンでは左下、スマホでは中央。
パソコンとスマホで見切れ範囲や、アイコン被りが起こる場所がだいぶ変わってくるので、作る際にはコツがいります。
以下記事で詳しく説明しているのでぜひ参考にしてみてください。

Facebookのアイコン
Facebookのアイコンは、
PCでは170x170px、スマホでは128x128pxで表示されます。
これより大きいサイズであれば、設定時に調整できるので事前にこのサイズにする必要はありません。
Twitterのヘッダー&アイコン
Twitterのヘッダー
Twitterのヘッダーは1500px×500pxです。
2019年の5月ごろまでは、パソコンでの表示時に上下に見切れる部分がありましたが、現在では見切れは発生しません。
アイコンがヘッダーの左下に半分程度重なるように表示され、パソコンとスマホでアイコンの位置が微妙にズレるのでその位置には文字や人・キャラの顔を入れないように注意しましょう。

Twitterのアイコン
Twitterのアイコンは、400px×400pxです。
たまに、アイコンが荒れている(画像が汚い)人がいますが、そういった人はこのサイズより小さいサイズを設定している人です。
画像が荒れていると、「拾い画感」が出てちょっと胡散臭さが漂ってしまうので、アイコンの画像は400px以上のものを設定するようにしましょう。
アメブロのヘッダーサイズ
アメブロのヘッダーサイズ(ブログヘッダー)
アメブロのヘッダーサイズは、横1120px×縦300~400pxです。
実は縦幅に特に決まりはありません。
なので、縦500pxなどでも大丈夫ですが、記事が視界に入りにくいのでお勧めできません。
ただし、気を付けるべき点があります。
それが以下のとおり。
詳しくは、下記の記事で詳しく説明していますので、参考にしてみてください。

アメブロのヘッダーサイズ(プロフィールヘッダー)
アメブロでは、ブログのヘッダーとは別に、プロフィールのヘッダーがあります。
プロフィールのヘッダーは、1120px×256pxです。
ブログのヘッダーはアイコンと被りませんが、プロフィールのヘッダーは、ヘッダーに被る形で左下にアイコンが表示されますので、注意しましょう。
また、プロフィールヘッダーは、スマホでも表示されます。
ヘッダー画像を用意する方法
ヘッダー画像などを無料でつりたい人は、下記記事を参考にしてください。
簡単に自分用の画像が作成できます。


「自分で作れきれない。」
「しっかりしたものがほしい」
そういう方は、ココナラなどで、気軽にクリエイターに依頼することができますので、利用すると良いでしょう。
「【各種SNSのサイズ表】facebook・twitter・アメブロ・YouTubeなどのヘッダー&アイコンの推奨サイズ」まとめ
今回は各種SNSのサイズを紹介しました。
各SNSで、推奨サイズやアイコンとの被り方などが異なるため、同じ画像を使うことはオススメできません。
同じ画像を使う場合は、風景やモノなど、上下左右、どこかが見えなくても成り立つような画像にしましょう。
文字やキャラクターなどを入れる場合は、それぞれに調整しなおして適したサイズを使う用にしましょう。