LPO/LP作成 2026/06/19

【2026年版】縦型LP（スマホLP）とは？CVRが高い理由と制作・改善のポイントを解説

「スマホからのアクセスは多いのに、CVRが思うように伸びない」——そんな悩みを抱えるマーケターの方は少なくありません。その多くの場合、PCベースで設計されたLPをスマホで表示させているか、スマホ向けに最適化された設計ができていないことが原因です。

本記事では、**縦型LP（スマホLP）**に特化した設計・制作・改善のポイントを徹底解説します。CVRを高めるデザイン原則から、スワイプ型LPとの組み合わせ方、ヒートマップを使った分析手法まで、実践的な内容をお届けします。

この記事でわかること

縦型LP（スマホLP）とは何か
PCサイトをそのまま表示するとCVRが下がる理由
縦型LPで押さえるべきデザインの5原則
スワイプ型LPとの効果的な組み合わせ方
ヒートマップを使った問題発見の方法

縦型LP（スマホLP）とは
PCサイトをそのまま表示するとCVRが下がる理由
縦型LPで押さえるべきデザインの5原則
縦型LP × スワイプ型LPの組み合わせ
ヒートマップで縦型LPの問題を発見する方法
よくある質問（FAQ）
まとめ
CVR改善ならDejam！

縦型LP（スマホLP）とは

縦型LPとは、スマートフォンで縦向きに閲覧することを前提に設計されたランディングページのことです。別名「スマホLP」「モバイルLP」とも呼ばれます。

スマートフォンの普及により、Webサイトへのアクセスの大部分がスマホからになった現在、LPのスマホ最適化は必須の施策です。総務省の調査によると、国内のインターネット利用はスマホが主要デバイスとなっており、EC・SNS広告・リスティング広告などからの流入の大半がスマホ経由です。

縦型LPの主な特徴は以下のとおりです。

縦スクロールで完結: ユーザーは上から下にスクロールするだけでコンテンツを閲覧できる
スマホ画面幅（320〜430px）に最適化: テキスト・画像・ボタンがスマホ画面に収まるサイズで設計
タッチ操作を考慮したUI: ボタンサイズ・タップ領域がスマホ操作に合わせて設計されている
縦向き固定（ポートレートモード）: スマホを縦に持った状態での閲覧を前提とする

PCサイトをそのまま表示するとCVRが下がる理由

PC向けに設計されたLPをスマホでそのまま表示すると、以下のような問題が発生してCVRが著しく低下します。

問題1：文字が小さすぎて読めない

PC向けのフォントサイズ（14〜16px）はスマホ画面では非常に小さく表示されます。ユーザーはピンチアウトしながら読もうとしますが、そのストレスが離脱につながります。スマホでは最低16px、見出しは20〜24px以上が推奨されます。

問題2：ボタンが小さくてタップしにくい

PCではマウスカーソルで精密なクリックができますが、スマホは指でタップするため、小さなボタンや隣接するリンクは操作ミスを引き起こします。Googleのガイドラインではタップターゲットは48px × 48px以上を推奨しています。

問題3：画像や表が横はみ出ししてしまう

PC向けに横幅固定（1000px等）で設計された画像や表は、スマホ画面（375px等）に収まらず横スクロールが発生します。ユーザーにとって不快な体験となり、離脱率が上がります。

問題4：ページの読み込みが遅い

PC向けの高解像度画像をスマホ回線でダウンロードすると、表示速度が著しく低下します。Googleの調査では、読み込みが3秒を超えると53%のモバイルユーザーが離脱するとされています。

問題5：情報密度が高すぎて読む気になれない

PCの大画面では見やすかった情報量も、スマホ画面では圧迫感を与えます。縦型LPでは、スマホ画面のスペースに合わせて情報を整理・分割することが必要です。

縦型LPで押さえるべきデザインの5原則

原則1：フォントサイズは本文16px以上を確保する

スマホ画面での読みやすさを確保するため、本文テキストは16px以上を設定します。重要な見出しは20〜28pxで強調し、視線が自然に誘導されるタイポグラフィ設計にします。行間は1.6〜1.8em程度が読みやすいとされています。

原則2：CTAボタンは画面下部に固定配置する

スマホユーザーが最も操作しやすい「親指エリア」（画面下部中央〜両側）にCTAボタンを配置します。スクロールに関わらず常に表示される固定CTAバーを設置することで、ユーザーがどこにいてもCV行動を取れるようにします。

ボタンの横幅は画面幅の80〜90%（スマホで約300px以上）を確保し、タップしやすいサイズにします。背景色は本文と明確に区別できる目立つ色（オレンジ・緑など）を使います。

原則3：スクロール設計でF字パターンを意識する

ユーザーのスキャン行動は「F字型」の視線移動が多いとされています。重要なメッセージ・メリット訴求は左端や上部に配置し、視線の流れに沿った情報設計を行います。スクロールするにつれて段階的に購入意欲が高まるよう、情報の順序を設計します。

原則4：画像は WebP形式・遅延読み込みで最適化する

スマホ向けには画像をWebP形式（JPGより30〜40%軽量）に変換し、初期ビューポート外の画像は遅延読み込み（Lazy Load）を設定します。これにより初期表示速度を改善し、First Contentful Paint（FCP）を短縮できます。

原則5：フォーム項目は最小限に絞る

スマホでのフォーム入力はPCより格段に面倒です。CVのためのフォームは入力項目を3〜5項目以内に絞り、電話番号・氏名・メールアドレスなど必須事項のみに限定します。入力補助（オートコンプリート対応・数字入力は数値キーボードを呼び出す）も重要です。

縦型LP × スワイプ型LPの組み合わせ

縦型LPとスワイプ型LPは、使い分けることで相乗効果を生み出します。

用途	推奨LP形式
SEO流入・詳細説明が必要な商材	縦型LP（通常の縦スクロール型）
SNS広告からの衝動買い誘導	スワイプ型LP
BtoB問い合わせ獲得	縦型LP（情報量重視）
単品通販・アプリDL	スワイプ型LP（シンプル訴求）

例えば、通常の縦型LPをサービスの詳細説明ページとして整備しながら、SNS広告専用のスワイプ型LPを別途制作するという使い方が効果的です。SNSの広告クリエイティブからスワイプ型LPに誘導し、興味を持ったユーザーが詳細を知りたい場合に縦型LPへ遷移させる設計も有効です。

Dejamのスワイプ型LP制作機能では、縦型LP・スワイプ型LPの両方を同一ツールで制作・管理できます。ABテストで両形式の効果を比較しながら最適な運用が可能です。

ヒートマップで縦型LPの問題を発見する方法

縦型LPの改善には、ヒートマップ分析が非常に有効です。ヒートマップを使うと、ユーザーがどこでスクロールを止めて離脱しているか、どのボタンをタップしているかを視覚的に把握できます。

Dejamのヒートマップ機能では、以下の分析が可能です。

スクロールヒートマップで離脱ポイントを特定

縦型LPの上部から下部にかけて、各エリアへのスクロール到達率を色で可視化します。赤に近いほど多くのユーザーが到達しており、青になるにつれて閲覧者が減っています。多くのユーザーがページの中間で離脱している場合、そのエリアのコンテンツを改善する必要があります。

クリックヒートマップでCTA効果を測定

ユーザーがどの要素をタップしているかを可視化します。CTAボタン以外の場所（テキストリンク・画像）への誤タップが多い場合は、ボタンのデザインやサイズを改善するサインです。

改善サイクルの回し方

ヒートマップで離脱ポイントを特定
改善仮説を立てる（例：「ヒーロー画像の下でユーザーが止まっているのは、次のコンテンツへの関心が低いため」）
ABテストで修正バージョンを配信
CVRが改善したバージョンを採用
次の改善ポイントを探す

このサイクルを継続的に回すことで、縦型LPのCVRは着実に向上します。

よくある質問（FAQ）

Q1. スマホLP（縦型LP）とレスポンシブデザインは違いますか？

レスポンシブデザインはPC・タブレット・スマホのすべてのデバイスに対応するデザイン手法で、画面サイズに応じてレイアウトが自動調整されます。一方、スマホLP（縦型LP）はスマホ専用で最適化したページを別途制作することを指す場合が多く、より徹底したスマホ最適化が可能です。どちらが優れているというより、スマホ流入比率と制作リソースに応じて選択します。

Q2. 縦型LPとランディングページの違いは何ですか？

「ランディングページ（LP）」は広告や検索からユーザーが最初に着地するページ全般を指し、縦型LP・スワイプ型LPはその形式の種類です。縦型LPは「上から下へのスクロール型でスマホに最適化されたLP」という意味で使われます。

Q3. スマホLPの制作をコーディングなしで行う方法はありますか？

Dejamのようなノーコードツールを使えば、HTMLやCSSの知識なしでスマホ向けのLPを制作できます。テンプレートを選んでテキストと画像を差し替えるだけで、スマホ最適化されたLPを短時間で作成でき、配信後のヒートマップ分析・ABテストまで一気通貫で行えます。

まとめ

縦型LP（スマホLP）は、スマートフォンユーザーが増加した現代のマーケティングに欠かせない施策です。PCサイトをそのまま表示するとフォントサイズ・ボタンサイズ・読み込み速度の問題でCVRが大幅に低下します。

縦型LPで押さえるべきデザインの5原則は、フォントサイズ16px以上の確保、CTAの固定配置、スクロール設計、画像最適化、フォームの最小化です。またスワイプ型LPと組み合わせることで、SNS広告からの流入を効率よくCVにつなげることができます。

配信後はヒートマップ分析で離脱ポイントを特定し、ABテストで継続改善を行うサイクルがCVR向上の鍵です。

CVR改善ならDejam！

Dejamは、LP制作・ヒートマップ分析・ABテスト・AI自動解析をオールインワンで提供するCVR改善特化ツールです。

Dejamが選ばれる理由

国内唯一のワンプロダクト: LP制作・ヒートマップ分析・ABテストをすべて単一ツールで完結
月額3万円〜利用可能: オプティマイズプラン月額3万円〜 / CMSプラン月額5万円〜 / オールインワン月額12万円〜
スワイプ型LP制作対応: スマホファーストのスワイプ型LPをノーコードで作成・テスト・分析まで一気通貫
ISMS認証取得: ISO/IEC 27001:2022 & JIS Q 27001:2023認証取得済み
毎週アップデート: 市場トレンドとユーザーリクエストに応じて機能を毎週拡充

Dejamの詳しい機能を見る →　無料トライアルを申し込む →

タグ: LP制作モバイルLP CVR改善 LPO スマホLP 縦型LP スマホファースト

この記事の監修者

平井翔吏

株式会社LeanGo 代表取締役CEO / Dejamプロダクトオーナー

CVRを改善するノウハウを体系化するプロフェッショナル。

株式会社リクルートホールディングスに新卒入社、ゼクシィのUXデザインを担当。累計250件以上の施策を実施しCVR改善を140%達成。タグ検索の開発やゼクシィ花嫁割のリブランディングなどのプロジェクトオーナーとして事業を推進した。

株式会社LeanGoを設立。CVR改善ツールDejamのプロダクトオーナー。運用型LPOやセグメントCVRなど独自のメソッドを構築、PDCAハンドスピナーをはじめとするプロモーションも実施している。日本最高峰のダイレクトマーケティングカンファレンス「ダイレクトアジェンダ2025」「ダイレクトアジェンダ2026」のAgenda awardにて2連覇。