2014年07月18日（Fri）
Twitter（ツイッター）のプロフィール画面のヘッダー画像、プロフィール画像の最適なサイズ
Twitterのプロフィール画面では、ヘッダー画像とプロフィール画像が登録でき共に推奨サイズがあります。
ただ、推奨サイズで画像を作成してもピッタリいかない事もあるようなので、色々と試してみました。
各画像種類の推奨サイズやファイル形式など
推奨サイズを使用していても環境などによって、ヘッダー画像の上下の60ピクセルが切り取られる場合があるようですし、ステータスバーも考慮するともっと低めの高さでデザインした方が良さそうです。 サイズ以外にも「jpg」形式をアップロードすると画質が極端に落ちてしまうため、「png」形式でアップロードした方が良いそうです。
| 画像種類 | 表示サイズ(px) | 推奨サイズ(px) | 推奨ファイル |
|---|---|---|---|
| ヘッダー画像 | 幅：1024 ～ 2560 高さ： 360 ～500 | 1500 x 500 | PNG |
| プロフィール画像 | 200 x 200 | 400 x 400 | PNG |
参考Webサイト： Twitterヘルプセンター | プロフィール画像をアップロードできません
実際にテストしてみる
テストで使用した画像は、ヘッダー画像(1500×500ピクセル)とプロフィール画像(400×400ピクセル)の共に推奨サイズの画像を「ヘッダーの位置とサイズを変更」をせずに、そのままアップロードして試してみました。
▼ テスト画像のアップロード後のTwitterのプロフィール画面
▼ 使用したテスト用のヘッダー画像
▼ 使用したテスト用のプロフィール画像
プロフィール画像は、綺麗に縮小されているようですが、ヘッダー画像は自分の環境では上下が少し切れて表示される結果となりました。
スマートフォン版の場合
スマートフォン版ではプロフィール画像の位置が中央にあるので、それも考慮してデザインすると面倒ですね…
テストした結果、スマホ版は縦でも横でも表示されるヘッダー画像サイズは、幅1000ピクセル × 高さ500ピクセルのようで、プロフィール画像は問題なく縮小されて表示されました。
まとめ
ヘッダー画像は、推奨サイズの1500×500ピクセルをPNGファイルで作成し、縦横を中央に寄せ「1000×350ピクセル」でデザインをまとめるのが無難ですね。 プロフィール画像は、400×400ピクセルで同じくPNG形式で作成して特に問題はなさそうです。 余裕があれば、スマホ画面で中央に表示されるプロフィール画像の事も考えられればと思います。
気付いた事…
画像のテストで、1440×500 のサイズの画像があったのですが面倒だったので、そのままアップロードしてみましたが、少しぼやける現象が起きました。 推奨サイズの1500×500 のPNG形式のサイズで再度アップロードしたら直りました。 やはり、推奨サイズに従った方が良さそうです。
コメント（0件）
Twitter（ツイッター）のプロフィール画面のヘッダー画像、プロフィール画像の最適なサイズに対するご意見、ご感想、情報提供など皆様からのコメントをお待ちしております。 お気軽にコメントしてください。
コメントフォーム