スマホのLP（ランディングページ）デザインのコツとは？

LPとは

ランディングページとは、各種広告など経由してユーザーが最初にアクセスするページのことです。ユーザーがサイトやホームページに着地する（land）イメージからこの名前がつけられました。ビジネスシーンでは省略してLP（Landing Page）と呼ばれることが多いです。

例えば、ある企業サイトのトップページにユーザーが最初にアクセスした場合はそのトップページがランディングページになり、会社案内ページにダイレクトにアクセスした場合は「会社案内」ページがランディングページになります。

しかし、これは広義の意味でのランディングページです。

一般的には「ランディングページ」や「LP」とは狭義の意味でのランディングページであり、一つの商品やサービスを売るための、一枚の長いWebページのことを指します。

つまり、LPとは「売り上げを出すための広告施策用に制作する１ページで完結する縦長のページ」という意味になります。

スマホ用のLPデザインは必要か？

LPはスマートフォンが現在のように広く普及する前から存在したWebマーケティング手法でした。

スマートフォンが広まるまではパソコンで表示された場合のデザインを中心に設計していれば良かったのですが、今やインターネットの利用者の閲覧デバイスはスマートフォンがパソコンを超えました。

総務省が発表した2017年の通信使用動向調査によれば、個人がインターネットを利用する機器はスマートフォンが54.2%、パソコンが48.7%という記録となり、スマートフォンからの利用率が初めてパソコンを上回ったという結果が出ています。
参考：「ネット利用、スマホがPCを逆転　総務省調査」

このように、増え続けるスマホユーザに向けて最適化されたLPは、Web広告の効果最適化には必要不可欠となっています。スマホが主流になりつつある中で、それに即したWeb施策が重要になってきたのです。特にBtoCのビジネスにおいてスマホ用LPを最適化することで、コンバージョンに大きく関わってくると言えます。

また、現在の若い世代では個人用のパソコンを持たず、スマートフォンで全て完結できてしまうようなアプリも登場しています。

このような理由からも、ビジネスにおけるスマートフォンの重要性はますます強くなることが予想されます。

スマホのLPデザインのポイント

ここからはスマホ用のLPデザインのポイントを8つ紹介していきたいと思います。

ポイント1: レスポンシブデザインではなく、スマホ用の個別のデザインを作る

この記事を読んでいる方の中には、レスポンシブデザインを作ることでスマホでの閲覧時にも対応させようと考えているかもしれません。

レスポンシブデザインは、画面のサイズに合わせてサイズや配置を自動的に調整できるので、1つのHTMLや共通画像を更新するだけですべてのデバイスへ修正内容が反映されます。その点において言えば、運用管理上のメリットは大きいでしょう。

しかし、レスポンシブデザインはデバイスに応じて、変化することを前提したシンプルなレイアウト設計や限定されたテキストボリュームが必要なため、デザイン上の制約が生じてしまうというマイナス面もあります。

特に、ランディングページは1ページで構成されるコンテンツなので、デザインの自由度が下がると訴求力の低下にもつながり、コンバージョン率も低下してしまう危険があります。

ポイント2: ファーストビューを大切に

ユーザーがアクセスした時、スクロールせずに1画面内に見える領域がファーストビューです。

ファーストビューは、どのような情報が掲載しているのかをユーザーに印象付ける部分であり、ユーザーが「自分の求める情報があるページなのか」を一瞬で判断する部分でもあります。ここでユーザーが自分の求めている内容が載っていないと判断してしまうと、離脱率が上昇し、コンバージョン率が低下してしまうのです。

そのための施策の一つとして挙げられるのが「ヘッダー」の役割です。

ヘッダーとは、上のようなスマホ用ページの上部に設置している部分であり、主にユーザーにどんな事業のページなのかを一瞬で認識させたり、レスポンスボタン（電話・メールなど）を設置して、コンバージョンに繋げるなどの効果が期待できます。

ポイント3: 表示速度を速める

ページが表示されるまでの速度により、ユーザーの意識は大きく変わってきます。

パソコンと違って特にスマホでは、通信環境や閲覧する状態に応じて、表示までの待ち時間に敏感になる傾向が強いのです。Amazonの調査データによれば、ページの表示速度が0.1秒遅くなると、売り上げが1%低下したと報告されています。

表示速度を改善するためには、画像の容量やプログラムのソースコードが原因になることが多いので、そのあたりにも気を配ることが重要になります。

ポイント4: ボタンのコピーやデザインを工夫

スマホだけに言えることではありませんが、最終的にコンバージョンが発生するボタンのコピーやデザインを工夫し、「押したくなる」ようなボタンに仕上げることも一つの手です。例えば、コピーには名詞ではなく動詞を使い、立体的なデザインにすることで押しやすいボタンにすることで効果が期待できます。

また、スマホはボタンを指でタップするため、押しやすい幅、大きさにすることも大変重要となります。

ポイント5: ユーザーの視線を誘導する

ページ途中に矢印・三角マークの要素を配置することで、ユーザーの視線や次に見るべき方向を誘導することができます。ユーザーに読んでほしいコンテンツの順番を設定するのに役立つことができ、コンバージョン率の向上にも繋がります。

ポイント6: スマホとパソコンの利用者層を分析

先ほどスマホ利用率はパソコンを超えたと書きましたが、これは総体的に見た場合です。年齢や性別ごとに見てみると、世代が上に行くにつれてパソコンの利用率は増え、男性と比べると女性の方がスマホの利用時間が長いことがわかっています。

このことから、ランディングページに掲載するコンテンツの内容によってそれに合わせた情報の加工・発信が必要になります。

ポイント7: 電話のコンバージョンを最大限に利用する

パソコン用LPとの大きな違いの一つとして、スマホ用LPには「電話コンバージョン」があることが挙げられます。

スマホはパソコンと比べると、圧倒的に電話がかけやすいデバイスです。よって、電話でのコンバージョンがしやすい構成にすると効果も高まります。

特に、

• 発信先の電話番号
• 受付時間
• 「無料」や「今すぐ！」というキーワード

などを付け加えることで、ユーザーの行動を促進することができるでしょう。

ポイント8: 入力フォームの記入事項はなるべく少なくする

パソコンに比べてスマートフォンは文字の入力がしづらいです。そのため、氏名や住所などの必要事項を打ち込む「入力フォーム」はシンプルでなくてはいけません。

フラストレーションを感じてしまうと、ユーザーはコンバージョン達成を目の前にして離脱してしまう可能性が高くなります。

おわりに

いかがでしょうか？

LPはネット上での売り上げを向上させるために最も重要な要素であり、サイト全体を改善するよりも安価に素早く作成することができます。しかしその一方で、必要なコンテンツを取捨選択し、ユーザーに響くようなデザイン設計にしなくてはいけないため、ただ闇雲に作っても思ったような効果を得ることができないでしょう。ランディングページの設計の際には、今回の記事で紹介したコツをぜひ参考にしてみてください。