ランディングページとは、そのサイト内でユーザーが一番最初に訪れるページのこと。
広告やSEOでの集客を考える際、ユーザーが一番最初に見るページ(ランディングページ)は、そのサイトの印象を決めるものです。
そこでページのサイズなどが小さすぎたり大きすぎたりしては、「離脱率」や「ページ滞在時間」が下がり、見る人が減るだけでなくSEOにも悪影響を与えてしまいます。
そこで今回の記事では、ランディングページ製作の際に注意したい最適なサイズについて整理しました。ランディングページだけでなく通常のホームページ(WEBサイト)制作の際にも同じことが言えますので、ぜひ参考にしていただければと思います。
1.サイズはモニターサイズに合わせる
まず最初に「どのサイズで作り始めればいいのだろう?」と悩みますよね?
しかも近年では、PCよりスマホを利用している人が増えてきていますので、レスポンシブ対応で行きたいところですよね。
そんなあなたにそれぞれご説明していきます。
2.PCの最適なサイズ
PCのモニターサイズも上記のように様々です。
最近徐々に一般のユーザのPCのモニターも大きくなりつつあるかと思いますが、主要なモニターサイズである「1024×768」、「1280×800」に収めるのがいいでしょう。
2-1.有名サイトを参考にしてみよう!
参考サイト:http://ultra.zone/website_width#ctgy=all
上記を見てみると分かりますが、横幅950px~1000pxが多いようですね。
このようなサイトが実際に採用しているサイズを参考にすると、ユーザビリティ的にも良いサイズと言えると思います。
2-2.実際に使っているモニターのサイズを調査
WEBサイトを見て頂けるユーザに取って使いやすいサイズとは?っと考えたときに思い浮かぶのは、本当に実際に使っているユーザの画面サイズはどの程度か?が分れば話は簡単です。
でもそれをどのようにして調査するのか、、、
これも簡単。
Googleアナリティクス(グーグルアナリティクス)などの無料のツールで、その実際のサイズを把握することが可能です。
Googleアナリティクスの場合「ユーザー > ユーザー環境 > ブラウザとOS」から確認可能です。
こちらの場合「1366 × 768」が最も主流でした。
最も大きなサイズでは「2560 x 1440」なんてものもありました。
この辺りの数値も考えた上で、横幅を決めると良いですね。
実際に見ている人が多いブラウザーサイズの全体の5%以上あるものは、確実に考慮した方が良いでしょう。
2-3.大事なのはファーストビュー!
ページはスクロールが多くなれば、多くなるほど読まれる可能性は下がるので、ファーストビューでいかに興味を引く事が出来るかがカギとなってきます。
上記のモニターサイズを考慮し、ファーストビューは縦幅500px~550pxにする事を推奨します。
3.スマホの最適なサイズ
スマホのディスプレイサイズは機種によって違ってきます。
横幅は縦で320px~640px、横向きで480px~960pxが主流です。
スマホでは基本横幅は320pxでデザインしましょう。
スマホでのファーストビューのサイズは、縦幅は460pxにする事を推奨します。
ちょっと待った!スマホ用の画像は高解像度データを用意
スマホは、小さい画面に高密度にピクセルが並んでいます。従来のディスプレイでの1ドットのスペースの中に、大きさが縦横半分のサイズのドットが2×2の4つ入りました。それを1pxとして扱うことにより、フォントや画像の輪郭をより鮮明に描写することが可能になりました。
今まで通りの解像度で作成すると、画像の輪郭がぼやけてしまうのです。
なのでスマホの画像を作成する場合は、2倍のサイズで作成します。
解像度も機種によって様々なので、320pxを基準に考えると画像の横幅640pxで作成するのが良いでしょう。
まとめ
ランディングページ(landing page)とは、ユーザーが最初に訪問するWebページになります。
制作する際は、ファーストビューを意識し、しっかり商品のアピールをしてユーザーの心をつかんでいきましょう!
LP制作についての関連記事
平日 10:00~18:00
(セールス目的のお電話はご遠慮ください。)