LP の FV が KIREI にできなくて
この記事はLP初心者の私が作成しながら大事なことを学んで、立派なデザイナーになる過程で記しているものです。
現在、初めてのLPを作成中です。
LPのデザインをジョウシーに提出したところ、「FV(ファーストビュー)がイケテナイ」とご指摘をいただきました。
思うようにできなくて文字通り頭を抱えています。
ジョウシーからのヒントをもとにLPのFV(ファーストビュー)について学んだことをここに書いていきたいと思います。
現在のLPのFVを言葉に表すと、
"シンプルなのにダサい。” ”未完成感が滲み出ている”そんな作品。
デザインの方ばかりについ目が入ってしまい、一番大事な礎になる部分が疎かになっていたと感じています。
なので改めて基礎も意識しながら考えを深めたいと思います!
FV(ファーストビュー)ってなんぞや?
FV=フェイスブックやーん!って思った人も多いかもしれない。30歳overは特にそうなのでは!?
ファーストビューとは、
ユーザーがwebサイトに訪れたときにスクロールせずに表示される部分ことを指すそうです。
最初にパッと画面に映る部分のことです。そりゃ大事だよね。
ユーザー側の体験はショッチューしているから、それをみて瞬時に自分に必要か、興味あるか、離脱するか決めますよね。
興味が湧かないものならパッと目に入った一文を見て離脱します。
自分のことで考えてみると重要さが理解しやすいな。
ファーストビューのサイズを知っておくことも大事
そんな重要なスペースには当たり前のように幅に限りがあります。
PC : 横幅 1000 px ~ 1200 px 高さ 550 px ~ 600 pxまで
タブレット : 横幅 768 px 高さ 1080 px まで
スマートフォン : 横幅 365 px 高さ 650 px まで
上のサイズで作成したら大きな問題は起こりにくいみたいよ。
(PCにはソリッドレイアウトとリキッドレイアウトがあるらしくソリッドレイアウトなら上記のサイズらしい。)
ソリッドはPC画面のサイズに関わらず幅が一定。
リキッドは画面のサイズに合わせて幅が変わるレイアウトのことらしい。
FB(ファーストビュー)はなんで大事?
今更な感じのタイトルにしちゃいましたが、
FB次第で読み進めてもらえるかが決まるからです!(と言いながら、今作成しているLPのファーストビューはやはりいまひとつと実感…。)
一般的に言われる離脱率が
LPで70%、コーポレートサイトで40〜60%が
ものの3秒で離脱する世界です。
(作り手としてはもっと見てほしいのにイイイってなるけど、3秒で興味を持たせるのも作り手の仕事。なんだか魔法使いみたい。)
WEBサイトに集客できてもファーストビューで3秒で魅力を伝えられなければ散り散りに…。
集まらなければ、集まるように改善が必要することが大事!案ずるな、私。
ファーストビュー作りで意識したいこと
商品の内容がわかる画像を入れる
ユーザー目線のキャッチコピーを入れる
デザインをシンプルに
CTAボタンを入れる
動画を使う
数字による権威づけ
表示速度の変更
1.商品の内容がわかる画像を入れる
パッと見て商品やサービスが何かわかるように、画像を入れる。
私のLPは思えば、商品にスポットがあたっていない。
画像背景の一つになってしまい、一瞬では雰囲気しか伝わってないように思う。
改善:商品が目につきやすい画像、位置に変更してみよう。
2.ユーザー目線のキャッチコピーを入れる
商品の説明よりもターゲットが自分ごとに思えるキャッチコピーを入れる。
ターゲットを絞る際に立てたペルソナに合わせて、考えてみるといいかも。
わからない場合はAIに考えてもらうのも手かも!
フォントも見やすいものを意識しよう!
3.デザインをシンプルに
ファーストビューの離脱を考えると、伝えたい情報をギュギュッと詰め込みたくなるけど、一番伝えたいこと1つに絞るべし。
単独の画像や動画、WEBサイトを紹介する短い見出し、ページをより詳細に説明する分のみで構成するくらいがいい。
複数商品があればスライドショーを入れるといい。
デザインはシンプルで情報少なく、心を掴む。
画像もキャッチコピーも少数精鋭って感じ。
4.CTAボタンを入れる
アクションを起こしてもらうためのボタン。
お問い合わせや申し込み、購入など。
CTAボタンはサイズを大きくして、目立つ色を使うといい。
5.動画を入れ込む
動画は画像やてきすとよ5000倍も情報量を入れられると言われているらしく、興味を持ってもらいやすいみたい。
動画を入れられそうならそれもいいかもね!
6.数字による権威づけ
〇〇ランキングや顧客満足度などを数字で表してわかりやすくする。
信頼できるところで商品買いたいよね。
7.表示速度を変更する
読み込みが早いサイトがいい。
遅いと待ちきれなくて離脱してしまう。
容量の軽いサイトを作るように心がけよう!!
まとめ
こんなところですね!
参考サイトを見ながら自分なりに読み深めてみたので、
今からは、
・商品やサービスのわかりやすい画像を使っているか
・ユーザー目線のキャッチコピーが入っているか
・デザインがシンプルかどうか、少数精鋭か
・CTAは目立っているか
以上の4つを意識して、LPのFBの改善をしてみます!
億が一ここへ辿り着いた方の参考になれば幸いです。