目次
ファーストビューのデザインやポイントについてはいくつかの考え方がありますが、今回はスマホサイトのファーストビューのポイントについて解説します。
昨今では、パソコンよりもスマホでwebサイトを訪れるユーザーの方が多いので、しっかりとスマホサイトを作り込みましょう。
ファーストビューとは?

ファーストビューとは、webサイトに訪れたユーザーが一番最初に目にする部分です。
ユーザーの多くはファーストビューの情報を参考にしてサイトを見るか否かを判断するので、非常に重要な部分といえます。
ユーザーがファーストビューの情報をもとにwebサイトを見るかどうかを決めるのはおよそ3秒と言われているので、3秒でユーザーの心を掴むファーストビューを考えなければいけません。
スマホサイトのファーストビューで抑えておくべきポイント

スマホサイトのファーストビューで抑えておくべきポイントとして、以下の4つがあります。
- 画像サイズ
- 適切なフォント
- 表示速度が遅くならないコンテンツ量
- スマホサイトに合わせたボタン
人は文章を読むよりも画像を見る情報が優先されやすいため、ファーストビューで重要なのは主にデザイン面です。
以下でそれぞれのポイントについて、具体的に解説します。
画像サイズ
スマホサイトのファーストビューで抑えておきたいのが、画像サイズです。
画像サイズというのは、ユーザー心理に大きく影響を及ぼします。
統計情報を紹介している「Statcounter Global stats」によると、モバイル端末のシェアで最も多い画面サイズは375×667pxです。
絶対に375×667pxにしなければならないわけではありませんが、近い画像サイズが好ましいといえるでしょう。
適切なフォント
スマホサイトのファーストビューでは、文字サイズやフォントも重視してください。
パソコンと比べてスマホの画面は小さいので、文字サイズが適切でないと文字の読みにくいサイトになってしまいます。
また、特殊なフォントはパソコンのみでしか適用されないケースがあるので、独特なフォントを使用する場合はスマホでしっかり表示されるかを確認しておきましょう。
コンテンツ量
ファーストビューとして表示されるコンテンツは、多すぎないようにしましょう。
あまりにも詰め込み過ぎると3秒の間で判断できず、単に「わかりにくいサイト」と感じられて離脱される原因になります。
また、コンテンツ量が多すぎるとページ表示速度が遅くなる可能性もあるので、できるだけ端的かつシンプルに魅力を伝えるようにしましょう。
スマホサイトに合わせたボタン
スマホサイトのボタンは、適切な大きさで表示させるようにしましょう。
ボタンが小さすぎてもクリックしにくいですし、大きすぎると誤ってクリックしてしまう可能性があります。
その結果、ユーザーのストレスとなり、離脱されてしまいます。
スマホサイトのファーストビューで注意すべきポイント
スマホサイトのファーストビューでとくに注意すべきポイントとして、以下の2つがあります。
- 内容を詰め込みすぎない
- CTAを急がない
なぜ注意すべきなのか、それぞれのリスクについて解説します。
内容を詰め込み過ぎない
ファーストビューはシンプルで魅力的なイラストや画像、キャッチコピー程度が好ましいです。
ファーストビューから文字が長々と並んでいるwebサイトは、ユーザーのストレスになります。
ユーザーが具体的な情報を知りたいと感じるのは、心を掴まれてからです。
心を掴む前に長い文章や多くの画像を見せても、ユーザーにはネガティブな気持ちしか生まれません。
CTAを急がない
CTAの設置位置は、ファーストビューに置かないようにしましょう。
CTRを高めるためにファーストビューに設置してしまうケースもありますが、情報を得ていないユーザに対してCTAを設置しても効果は期待できません。
反対に、ネガティブな感情を生む原因にもなります。
スマホユーザーに適したファーストビューを検討しましょう
スマホサイトのファーストビューは、スマホユーザーの心理を考えてデザインしていきましょう。
ユーザー目線で考えていけば、ファーストビューをどのように改善すべきかが見えてきます。
今回の記事を参考にスマホサイトのファーストビューを見直して、ユーザーを惹き付けるデザインにしましょう。
もしユーザ-を惹き付けるデザインでお悩みであれば、ぜひ弊社にご相談ください。