ランディングページ作成におけるベストサイズとは?
ランディングページを作る時、自分で作るにしても、依頼するにしても、
「どのサイズで 作り始めればいいんだろう?」って最初に悩みますね。
BtoBならまだまだパソコンで見られますし、BtoCならスマホで見られることが多いと
言 われています。
結果からお伝えしますと、2017年10月現在としては
パソコンは、横幅1000ピクセル 前後 (950px~1020px)
スマホは、横幅 750ピクセル以内 ( iPhone7に合わせる場合 )
がおすすめです。
ランディングページは、ファーストビューでお客さんの興味を引くことができなければ、
すぐに離脱してしまいます。
お客さんがスムーズに興味を引き、ストレスなく読みすすめられるよう
最適なサイズで製 作することが大切です。
ユーザーのディスプレイによって解像度は違う
紙の印刷物ですと、A4サイズとかB4サイズなど紙の大きさがわかれば、
縦と横のサイズも決まっています。
でも、これがWEBの場合ですと、
それぞれのディスプレイによって解像度(画素の表示の 程度)が違うので、
“ベストサイズはこれ” というものはないんです。
スマホの画像のサイズ
スマホの画像のサイズは、デバイスピクセル比(1ピクセルの画像データを
ディスプレイが 何ピクセルで表現するかを表す数値)が2倍となるので、
作成する画像も2倍にする必要が あります。
2倍以上の解像度がないと、表示画像がボケます。
なので、現状iPhone7は、375ピクセルの2倍で750ピクセルの横幅ですと、
約8割の方には問題なく表 示されるようです。
参考にしたい記事の紹介
WEBサイトの余白・ブロックサイズ・WEBサイトの横幅のサイズに対して
「最適な値は存在するのか?」を追求したものです。
株式会社サイバーエージェントのブログより
https://ameblo.jp/ca-1pixel/entry-11837685575.html
イメージの参考に
やはり、大企業さんのサイトは多くの人が、見慣れていますし、
研究されています。
以下をご覧いただくと、950〜1020ピクセルが多いようです。
どうぞサイズごと、業種ごとに見比べて、ご自分のイメージの参考にしてみてください。
ULTRAZONE
http://ultra.zone/website_width#ctgy=all
おすすめツール
簡単にピクセルを測れるツールをご紹介します。
キャプチャを取らずに測れます。ただし英語です。
Google Chrom用
http://blarg.co.uk/tools/page-ruler
まとめ
「ズバリ、正解は一つ!」というものではないようです。
最終的には、自分の好み、イメージやセンスでぴったりくるものを選びましょう。
● パソコンなら、1000ピクセル前後
これですと、小さめのノートパソコンでも収まるデザインにできます。
● スマホなら、750ピクセル以内 ( iPhone7に合わせる場合 )
がいいようですね。(2017年10月現在)
ただ、日々環境は変わり、表示方法も変わっていきますし、
新しい変化への対応だけでな く、古いものへの配慮も欠かせません。
ご参考までにどうぞ。
コメント..