UIUX

KNOWLEDGE

CVRを改善するデザイン要素とは?押さえるべき7つのポイント

  • #UIUX
  • #WEB制作

SHARE

CVRを上げたいとき、ボタンの色を変える、キャッチコピーを変える、といった個別の改修から手を付けがちです。しかし、影響する母数が大きい箇所から順に直さないと、労力に対して数字が動きません

CVRは1つの数字ですが、実際には複数の段階の掛け算です。どの段階で落ちているかを特定してから改修すれば、少ない工数で成果が出ます。

この記事では、CVRを段階に分解する方法を示したうえで、影響の大きい順に7つの改善ポイントを解説し、あわせて効果の測り方と、改善しても数字が動かないときの見方までを説明します。

この記事でわかること

・CVRを段階に分解して、落ちている箇所を特定する方法

・影響の大きい順に並べた7つの改善ポイント

・費用をかけずに実施できる改修と、制作が必要な改修の切り分け

・改善効果の測り方と、判断に必要なデータ量

・数字が動かないときに疑うべき箇所

まずCVRを分解する

CVR=CV数 ÷ セッション数、ですが、この1つの数字を直接改善することはできません。次の段階に分けてください。

段階 見る指標 落ちている場合の原因
①ファーストビュー通過 スクロール率 誰向けか伝わらない。期待と違う。表示が遅い
②内容の読み進め スクロール到達率、滞在時間 情報の順序が判断の順序と合っていない
③CTAへの到達 CTAの表示回数、クリック率 CTAが見つからない。行動する理由がない
④フォーム入力開始 フォーム到達数 → 入力開始数 項目が多く見える。所要時間が想像できない
⑤送信完了 入力開始数 → 送信完了数 項目が多い、エラーで戻される、送信できない

この5段階のうち、どこで最も落ちているかを特定してから改修してください。①で50%落ちている状態で③を改善しても、効果は残り50%にしか及びません

CVRは5段階の掛け算です。まずどこで落ちているかを特定してください。

上流ほど影響する母数が大きく、改修の効果も大きくなります。

影響の大きい順:7つの改善ポイント

1. 表示速度

デザイン以前の問題です。読み込みが遅いと、内容を見る前に離脱します。特に広告流入では、待ち時間がそのまま広告費の損失になります。

  • ファーストビューの画像を軽量化する(過大な解像度で書き出さない)
  • ファーストビューの画像に遅延読み込みを適用しない(逆に遅れる)
  • 自動再生の重い動画を使わない
  • Webフォントのウェイトを絞る
  • 変更前後でモバイル環境の速度を計測する

2. ファーストビューの明確さ

「誰向けの、何のページか」が3秒で伝わるかどうか。ここが最も母数の大きい分岐点です。

特に広告流入では、広告文で示した内容がファーストビューにあるかが決定的です。期待した情報がなければ、ページの質にかかわらず戻ります。詳細はファーストビュー設計の重要性|離脱を防ぐ最初の3秒の作り方で解説しています。

3. 情報の順序

訪問者が判断する順序と、ページの構成が一致しているか。会社が伝えたい順序ではありません。

正しい順序 よくある誤り
条件(対応エリア・料金の目安) 会社の理念・沿革が上部を占める
提供内容の具体化 機能の羅列で便益が伝わらない
根拠(実績・お客様の声) 抽象的な賞賛コメントのみ
不安の解消(FAQ) 記載がない
行動(CTA) 下部にしかない

4. 料金・条件の開示

料金を出さないと問い合わせ数は増えますが、商談化率が落ちます。範囲での提示(例:35〜50万円)でも、判断材料としては十分に機能します

「料金は個別見積のため出せない」という場合も、価格帯の目安、見積の考え方、費用が変わる要因を書くことで、判断のハードルは下がります。

5. CTAの設計

  • 主CTAを1つに絞る:複数の異なる行動を同列に並べない
  • ファーストビュー内にも配置する:検討済みの人を取りこぼさない
  • 周囲に余白を取る:色を変えるより効果が大きい
  • そのページで使われていない色を使う:色名ではなく、周囲との差が重要
  • 次に何が起きるかを書く:「無料で相談する(30秒で入力完了)」

3番目と4番目についてはWebデザインにおける余白の効果Webサイトの配色の決め方で解説しています。

6. 信頼要素

要素 効く場面
実績数(施工件数、導入社数、営業年数) 初めて知る会社への不安を下げる
お客様の声(具体的な状況と結果) 抽象的な賞賛ではなく、検討時の不安が書かれているもの
スタッフの顔と名前 誰がやるのかが分かる。店舗・訪問系で特に効く
資格・許認可番号 専門性と正当性の裏付け
施工前後・導入前後の写真 変化が具体的に伝わる

7. フォームの入力負荷

最後の段階ですが、ここで落ちるのは最も意欲の高い人です。項目数、autocomplete属性の指定、エラー表示、送信テスト。詳細は入力フォームの離脱率を改善するデザインの工夫で解説しています。

費用をかけずにできる改修

上記7項目のうち、制作を伴わずに実施できるものがあります。まずここから着手してください。

改修 必要なもの 想定工数
見出しの文言を具体化する 原稿の書き換えのみ 数時間
料金の目安を追記する 社内での方針決定 半日
FAQを追加する 問い合わせ内容の棚卸し 1日
CTAの文言を変える コピーの検討 数時間
画像を軽量化する 書き出し設定の変更 半日
フォームの項目を削る 営業部門との合意 半日
実績数を記載する 社内データの確認 数時間

これらだけでCVRが動くことは珍しくありません。デザインの全面改修を検討する前に、この7つを実施してから判断してください

効果の測り方

判断に必要なデータ量

月間CV数 判断できること 推奨する進め方
5件未満 ほぼ判断できない 明らかな不足(速度、料金非開示、CTAなし)の解消に集中
5〜20件 大きな変化のみ判断できる 1回に1箇所だけ変更し、2か月単位で比較
20〜50件 傾向は判断できる 月次で比較。A/Bテストはまだ難しい
50件以上 A/Bテストが成立し始める 1要素ずつ検証

多くの中小企業は上2段に該当します。この規模ではA/Bテストではなく、明らかな不足の解消が最も効率的です

変更は1回に1箇所

複数箇所を同時に変えると、何が効いたか分かりません。急ぐ場合でも、影響の大きい順に1つずつ、期間を区切って実施してください。

最終判断は商談化数で

CVRが上がっても、商談化率が落ちていれば事業としてはマイナスです。料金を隠す、CTAのハードルを下げすぎる、といった改修はCV数を増やしますが、質を落とします。四半期ごとに商談化数・来店数まで確認してください

改善しても数字が動かないとき

疑うべき箇所 確認方法
計測が正しく動いていない テスト送信して、GA4に反映されるか確認する
流入の質が変わっていない 検索語句やターゲティングを確認。ページ側の問題ではない可能性
落ちている段階が別にある 5段階のどこで落ちているか、数値で再確認する
データ量が不足している 期間を延ばす。または明らかな不足の解消に切り替える
そもそもの需要が小さい 商圏の検索需要を確認する

1番目は最初に確認してください。計測が壊れている状態で「改善したが数字が動かない」と判断しているケースは実際にあります。確認手順はGA4のコンバージョンが計測されない時に確認すべき5つのポイントで解説しています。

よくある失敗

失敗1:ボタンの色から始める

影響する母数が小さく、変化も限定的です。速度とファーストビューが先です。

失敗2:複数箇所を同時に変える

何が効いたか分からず、次の判断ができません。

失敗3:CVRだけで評価する

CV数が増えても商談化しなければ意味がありません。四半期で後工程まで確認してください。

失敗4:少ないデータで判断する

月5件のCVで前月比を語っても、偶然の範囲です。期間を延ばすか、明らかな不足の解消に切り替えてください。

失敗5:デザイン全面改修から入る

費用と期間がかかるうえ、何が効いたか特定できません。まず費用のかからない7項目を実施してください。

よくある質問

Q. CVRの目標値はどのくらいですか?

業種と流入経路で大きく変わるため、他社の平均値は目標に使えません。基準にすべきは自社の過去データです。先月より上がったか、施策の前後で動いたかで判断してください。

Q. どこから手を付けるべきですか?

まず表示速度とファーストビューです。この2つは影響する母数が最も大きく、しかも費用をかけずに改善できる部分があります。その後、料金開示、CTA、信頼要素、フォームの順に進めてください。

Q. ヒートマップは導入すべきですか?

どこが見られていないかを特定するのに有効です。ただし、月間のセッション数が少ないと傾向が読めません。まずGA4のスクロール率で当たりを付け、必要に応じて導入してください。

Q. A/Bテストはいつから始められますか?

各パターンで20件以上のCVが得られる規模が目安です。月間CVが50件を下回る場合、統計的な判断は難しくなります。その段階では、明らかな不足の解消を優先してください。

Q. 改善のサイクルはどのくらいの頻度で回しますか?

1〜2か月に1箇所が現実的です。データが貯まる期間を確保しないと、変更の効果を判断できません。急ぐ場合も、複数箇所の同時変更は避けてください。

まとめ

CVRは1つの数字ですが、ファーストビュー通過・読み進め・CTA到達・入力開始・送信完了という5段階の掛け算です。どこで落ちているかを特定してから改修してください。上流ほど影響する母数が大きくなります。

改善ポイントは、影響の大きい順に、表示速度、ファーストビューの明確さ、情報の順序、料金・条件の開示、CTAの設計、信頼要素、フォームの入力負荷です。このうち多くは、制作を伴わずに実施できます。

効果測定では、変更は1回に1箇所、そして最終判断はCVRではなく商談化数で行ってください。月間CVが少ない規模では、A/Bテストより「明らかな不足の解消」のほうが効率的です。

「アクセスはあるのに問い合わせが増えない」「どこから直せばよいか判断できない」といった状態にある場合は、デザインの全面改修を検討する前に、5段階のどこで落ちているかを数値で確認してください。

当社ではホームページ制作から計測設計、公開後の改善までを一貫して支援しています。資料ではCVR改善の進め方をまとめていますので、自社の課題を整理したい方はぜひダウンロードしてご活用ください。

SHARE