資料請求・来場予約・電話、CVボタンはどこに何個置くべきか【住宅会社のホームページ実装ノウハウ】

住宅会社のオフィスを俯瞰した構図で、3台のPCと2台のスマホに同じサイトが並び、資料請求・来場予約・電話の3つのCVボタンが光る

御縁 GROWTH ロゴ

「CVボタンを増やしたのに、問い合わせが増えません」——新潟の住宅会社・工務店から、この相談は思っている以上に多いです。

原因のほとんどは「置く場所」ではなく「置き方」の設計を飛ばしたまま数だけ足してしまったことにあります。CVボタンは、ヒーロー・記事内・スマホ画面下部固定など、置くべき場所は決まっていますが、そこに何を・何個・どの順番で置くかまでを設計しないと、増やせば増やすほど押されなくなる領域に入ります。

住宅会社のオフィスを俯瞰した構図で、3台のPCと2台のスマホに同じサイトが並び、資料請求・来場予約・電話の3つのCVボタンが光る

前提:住宅会社の3つのCVは「同格」ではない

まず整理しておく必要があるのが、資料請求・来場予約・電話の3つは検討フェーズが違うということです。同じ大きさで横並びに並べると、検討者はどれを押していいか判断できずに、結局どれも押さずに離脱します。

住宅産業研究所も、ここ1〜2年で「資料請求ではなく来場予約」というお客様が急増していると指摘しており、リニューアルで来場予約フォームを新設したところ、反響の過半数が来場予約になったケースが報告されています(住宅産業研究所)。

3つのCV(資料請求・来場予約・電話)を光る円形ノードで表現し、中央の来場予約だけが金色で最も強く光る抽象データアート

住宅会社の一般的な優先順位は次のようになります。

  • メインCV:来場予約(最も成約に近い・受注率が高い)
  • サブCV:資料請求(検討初期の情報収集フェーズ)
  • 補助CV:電話(今すぐ質問したい層向け・営業時間の掲載必須)

同じ大きさで3つ並べるのではなく、来場予約を主役として色や大きさで強調し、残り2つは"控えめに常時ある"状態にするのが基本形です。

ボタンを置くべき"標準の6箇所"

置き場所は次の6箇所です。全部に置く必要はありません。自社の状況に応じて、下の判断軸で数を絞ります。

1. ヒーロー(トップページ最上部):訪問直後の第一印象 2. 各サービス/商品ページの本文中:具体的な情報を読んだ直後の熱量が高い位置 3. 記事・施工事例ページの記事末:読了直後の"次の一歩"の位置 4. スマホ画面下部の固定バー:常時タップ可能な状態 5. PCの追従サイドバーまたはヘッダー固定:スクロール中も視界に残す 6. フッター:情報を一通り見た後の最終的な出口

このうち1・3・4・6は"必ず置く"、2・5は"検討"、というのが住宅会社サイトの標準的な組み方です。

ヒーロー(トップ最上部)に置くべきCTAは"1つ"

CTA配置に関する2026年のデータでは、上部(Above the fold)に置いたCTAは下部に置いた場合より89%多くクリックされることが、17,500件のランディングページを対象としたヒートマップ分析で示されています(Foundry CRO)。

一方で、CXLの事例では複雑なオファーの場合、下部に移動させて逆に304%改善したというケースもあります。住宅は典型的な「複雑・高額・検討期間が長い」商材なので、この両方の知見をそのまま鵜呑みにはできません。

住宅会社の場合、ヒーローに置くのは「来場予約」1つに絞るのが実務的な着地点です。理由は次の3つです。

  • 訪問直後に一番強い一次CVを見せることで、指名検索や紹介経由のホット層を取りこぼさない
  • 資料請求・電話などを横並びで並べると視線が分散し、押されなくなる
  • スマホでは横並びが物理的に難しく、縦に積むと3つ目以降は視認されない

資料請求や電話は、ページを少し下にスクロールした位置(訴求・施工実績・価格帯の直後)に追加していくのが自然な流れです。

スマホ画面下部の固定バーは「置くのが標準」だが……

スマホからのアクセスが7割を超えるサイトが増えた今、画面下部の固定バーはほぼ標準装備になっています。指を伸ばしやすい親指の可動域にボタンを置く、というモバイルUIの原則にも合致します。

スマホ画面下部に固定された3分割CVバー(資料請求・来場予約・電話)のマクロ接写。中央の来場予約が金色で強調

住宅会社の場合、画面下部固定バーは「来場予約」「資料請求」「電話」の3分割にして、色は次のように分けるのが定型です。

  • 来場予約(中央):金色〜アクセントカラーで最も目立たせる
  • 資料請求(左):ブランドカラーで控えめに
  • 電話(右):電話アイコン+発信番号でtelリンク

WCAGコントラスト比の目安である4.5:1以上を下回ると、視認性が落ちてタップ率も下がるという指摘もあります(SiTest)。実装後、iPhoneとAndroidの両方で実際に指を伸ばして押しやすさを確認しましょう。

追従ボタン(フローティング)は"万能ではない"

一方、本文の横や上に貼り付く追従ボタンは、置けば置くほど良いわけではありません。

ある事例では、スマホサイトの追従ボタンを外したらコンバージョンが約20%改善したという報告もあります(アキさんの日記)。追従ボタンが本文を覆い隠していると、検討者が「押したくて押した」のではなく「邪魔で×を押したついでに離脱した」という動きが増えてしまうためです。

画面を覆う追従バナーで離脱を招くパターンと、下部だけにスリムな3分割固定バーを置くパターンを左右に並べたビフォーアフター

住宅会社のサイトで避けたいのは、次の3パターンです。

  • ページを開いた瞬間に画面の3〜4割を覆う追従バナー
  • ×を押しても数秒後にまた表示されるしつこい追従
  • 記事本文と重なって写真や図が隠れる位置に固定される追従

追従を入れるなら、スマホは画面下部固定の1本に集約して、本文中には貼らない。PCは右サイドバーに小さめのCTAカードを追従させる、くらいの控えめさで十分です。

3つのCV別・置き方の考え方

来場予約

  • ヒーローに1つ、各モデルハウスページの上下に各1つ、スマホ下部固定バーの中央の3箇所を必ず押さえる
  • 「今週末の空き枠」など、日程の空きを見せると押される確率が上がる
  • 予約フォームは「日付選択」を最初のステップに置くと、フォーム離脱率が明らかに下がる

資料請求

  • 各商品/プラン紹介ページの記事末、スマホ下部固定バーの左、サイドバーの3箇所が基本
  • 資料の"中身"を見せる(表紙画像+目次)だけで請求率が変わる
  • 「郵送のみ」よりも「PDFですぐ受け取れる」を選べるようにするとスマホ層の離脱を防げる

電話

  • スマホ下部固定バーの右(発信アイコン+番号)、フッター、会社概要ページが基本
  • 営業時間と休業日を必ずボタン近くに書く(時間外にかけて出なかったときの心証を守るため)
  • PC版ではクリックしても発信できないので、PC版は電話ボタンを大きくしすぎない(スマホ層と使い分ける)

フォームの離脱を放置すると、ボタンをいくら置いても意味がない

CVボタンをどれだけ最適配置しても、フォームが重ければ全部そこで落ちます。

業界の調査では、問い合わせフォームの離脱率は一般に65〜75%程度と言われています(BOOSTTECH MEDIA)。10人がフォームに到達しても、送信まで至るのは2〜3人という水準です。

問い合わせフォームの離脱率と完了率を改善したときのCV数変化の構造イメージ(指数値)

フォーム完了率が20%から40%に上がるだけで、送信数は2倍になります。ボタンを増やす前に、以下の3点をまず確認してください。

  • 入力項目が10項目を超えていないか(必須は5〜7項目までが目安)
  • スマホで入力するときにキーボード種別が正しく切り替わるか(電話番号欄なら数字キーボード、メール欄ならメールキーボード)
  • 「送信」ボタンが灰色のままになっていて押せると気付かない状態になっていないか

よくある3つの失敗パターン

失敗①:3つのCVを同じ大きさ・同じ色で横並びにする

視線が分散し、「どれが本命か分からない」状態になります。来場予約を主役として色と大きさを分ける、が正解です。

失敗②:追従ボタンを本文の上下左右に何本も入れる

本文が読めなくなり、離脱率が上がります。追従は原則1本、スマホは画面下部固定バーに集約します。

失敗③:ボタンを増やす前に、フォームを直さない

CVボタンをクリックさせるところまでは改善できても、フォームで7割離脱すると意味がありません。ボタン配置とフォーム改善は必ずセットで取り組みます。

まとめ:置く場所より、置き方の設計を先に決める

| 項目 | 実装の目安 | |---|---| | 主役CV | 来場予約(金色・大きめ・中央) | | サブCV | 資料請求(ブランドカラー・控えめ) | | 補助CV | 電話(スマホのみ・営業時間併記) | | ヒーロー | 主役CV 1つに絞る | | スマホ下部固定 | 3分割バー(左=資料請求/中央=来場予約/右=電話) | | 追従ボタン | 原則1本まで・本文を覆わない | | フォーム | 必須項目5〜7個・キーボード種別最適化 |

CVボタンは「増やす」より「絞る」ほうが押される、という感覚がスタート地点です。まずは主役をひとつ決めて、そこに視線が集まる配置に直す。それから残りの2つを控えめに常時見える位置に置く。この順番だけでも、直近の反響は変わります。

自社サイトのボタン配置とフォームがどのくらい離脱を起こしているかは、「アクセスはあるのに問い合わせがない」をデータで切り分けるで紹介しているGA4の切り分け方で数字にできます。改善の全体的な順序は住宅会社のホームページ集客 完全ガイドで整理しています。

自社のCV導線が「どこで詰まっているのか」を数字で見てから直したいという場合は、下記からご相談ください。GA4データと現状のサイト構造を突き合わせて、次に手を入れるべき1箇所から一緒に順番を決めます。

Masaharu Ishimoto

この記事を書いた人

Masaharu Ishimoto(御縁 GROWTH)

上級ウェブ解析士 / 御縁 GROWTH 代表

新潟の住宅会社・工務店を中心に、GA4計測の設計からAI検索(GEO)対策、サイト制作、公式LINE構築までを支援しています。

🎬 プライベート
X
TikTok
Instagram
💼 お仕事
Instagram
Facebook
▶ YouTube
チャンネル(準備中)

☀️ 無料でホームページを診断しませんか?

反響が増えない原因を、上級ウェブ解析士が無料で診断します。

無料相談・診断はこちら

お電話 090-1888-7622(平日9:00〜18:00)/ 公式LINEで相談