スマホ用のバナーのサイズ

Question

楽天のスマホサイトのバナーのサイズについて質問します。

RMSでは、

大バナー推奨；横616ピクセル×縦120ピクセル
小バナー推奨：横266ピクセル×縦110ピクセル

となっていますが、少し小さい気がします。
御社が考える最適なサイズがあれば教えていただきたいのですが。

Answer

ECマスターズの田中です。

＞少し小さい気がします。

まず、小さい気がする原因についてご案内します。

iPhoneやAndroidなどのスマートフォンブラウザは、
自身の解像度を把握しており、
どの程度拡大して表示すれば丁度良い見やすさになるかを判断して
「dpiスケーリング」という、
ページの拡大・縮小を行います。

dpiスケーリング機能については、下記URLをご参照ください。
http://www.mdn.co.jp/di/articles/2909/?page=6

その際、画像ファイルについては、
dpiスケーリングを行ってしまうと解像度が低くなり、
粗く見えてしまいますので、
デバイスそのままの解像度で表示させております。

利用者数の多い、iPhone4以降のモデル（横幅640ピクセル）で
楽天のスマートフォン用ページを見た時、
大バナー・小バナーの表示されるサイズが、

＞大バナー推奨；横616ピクセル×縦120ピクセル
＞小バナー推奨：横266ピクセル×縦110ピクセル

上記のサイズであるため、
楽天から推奨サイズとして案内されております。

最近では、各種Android機やiPhone6+など、
大型の画面、高い解像度を持つスマートフォンが増えたため、
そのような大きい機種で大バナー・小バナーを見ると
元画像のサイズが小さいため、
引き延ばされているように見えてしまいます。

http://qiita.com/nein37/items/0a622f7ebbbb92db93d5
上記URL、機種別の解像度まとめを確認すると、
大型機種は、横幅1080ピクセルを画面360ピクセルに
スケーリングする機種が一般的となっておりますので、
大型機種に対応する場合は

大バナー：横1032ピクセル×縦210ピクセル
小バナー：横510ピクセル×縦210ピクセル

で作成していただくと、元画像の品質で表示されます。

バナー用画像を大きくすると、その分画像容量も増え、
読み込み時間が長くなる可能性がありますので、
下記フリーソフトやWebサービスをご利用いただき、
可能な限り圧縮してご利用されることをオススメします。

Ralpha Image Resizer
http://www.forest.impress.co.jp/library/software/ralpha/

JPGの容量をオンラインで一発圧縮できるウェブサービス4選
http://japan.cnet.com/news/society/35066550/

Answer

詳しい説明ありがとうございました。