「商品詳細ページまで来ているのにカートに入らない」——商品詳細ページの離脱は、**情報が足りないのではなく「必要な情報に到達していない」**ことが原因であることが多いです。
本記事では、商品詳細ページのCVR改善を15施策に整理し、公開事例の数値とあわせて着手順を示します。
記事のポイント
- 離脱の原因は情報不足ではなく到達不足
- 購買決定要因（KBF）への到達率が**約30%**だった事例
- アコーディオンUIでCVR17.3%向上した公開事例
- 15施策を情報の順番・到達・信頼・カート投入の4群に整理
- 熟読データから情報の並び順を決める手順
目次
- 商品詳細ページで離脱する3つの原因
- ①情報の順番を直す（4施策）
- ②購買決定要因への到達を上げる（4施策）
- ③信頼を担保する（4施策）
- ④カート投入のハードルを下げる（3施策）
- 着手する順番の決め方
- Dejamで商品詳細ページを検証する
- よくある質問
- まとめ
商品詳細ページで離脱する3つの原因
1つ目。購買決定要因（KBF）に到達していない。 サイズ・素材・配送日・返品条件といった「決め手になる情報」が下にあり、スクロールされていません。
2つ目。情報があるのに読まれていない。 説明文がすべて展開された状態で長く並ぶと、流し読みされて必要な情報が飛ばされます。
3つ目。不安が解消されていない。 返品・配送・サイズ感といった「買った後の不安」が残っています。
この3つはいずれも「情報を足す」では解決しません。 順番・見せ方・到達の問題です。
EC全体の改善は「ECサイトのCVR改善ガイド」を参照してください。
①情報の順番を直す（4施策）
| # | 施策 | 仮説 |
|---|---|---|
| 1 | 説明文をアコーディオンで折りたたむ（見出しだけ並べる） | ページが短くなり、決め手の情報まで到達できる |
| 2 | 見出しを30字以内にして概要が分かるようにする | 開くべき項目を判断できる |
| 3 | 配送予定日・返品条件をカートボタンの近くに上げる | 買う直前の不安を解消できる |
| 4 | レビューを商品説明より上に移す | 第三者の評価を先に見せられる |
公開事例では、すべての説明が開いた状態から「要点のみ見出しで提示し、本文はアコーディオンで非表示」に変更した結果、実装から2週間で次の結果が出ています。
| 指標 | 結果 |
|---|---|
| コンバージョン率 | +17.3% |
| KBF（購買決定要因）到達率 | +42% |
| カラーバリエーションの注視度 | +35% |
| レビューセクションのクリック率 | +28% |
変更前のKBF到達率は約30%でした（出典: 商品詳細ページ改善の新常識：アコーディオンUIでCVRを底上げした改善事例紹介 - Ptengine）。
この事例が示すのは「情報を減らしていない」ことです。 同じ情報量のまま、折りたたんで到達距離を短くしただけで到達率が42%上がっています。
②購買決定要因への到達を上げる（4施策）
商材ごとにKBFは違います。 何が決め手かを先に決めてください。
| 商材 | 主なKBF |
|---|---|
| アパレル | サイズ感・素材・着用イメージ・返品可否 |
| 食品 | 原材料・賞味期限・配送温度帯 |
| 家電 | 仕様・対応機種・保証期間 |
| 化粧品 | 成分・肌質との相性・容量あたり単価 |
| BtoB商材 | 納期・数量割引・請求書払いの可否 |
| # | 施策 | 仮説 |
|---|---|---|
| 5 | KBFをファーストビュー内に要約して置く | スクロールなしで判断できる |
| 6 | サイズ表・仕様表を画像ではなくテキストの表にする | 拡大せずに読める・検索にも載る |
| 7 | 変種（色・サイズ）の選択を一覧で見える形にする | 在庫切れの組み合わせが事前に分かる |
| 8 | よくある質問を商品ページ内に置く | 別ページへの離脱がなくなる |
サイズ表を画像で置いているECは多いですが、モバイルでは拡大が必要になり読まれません。 テキストの表にするだけで到達が変わります。
③信頼を担保する（4施策）
| # | 施策 | 仮説 |
|---|---|---|
| 9 | レビューの件数と平均点を実測値で表示する | 満点より実測のほうが信頼される |
| 10 | ネガティブなレビューも表示する | 取り繕っていないと判断される |
| 11 | 使用シーンの写真をユーザー投稿にする | 作り物感が消える |
| 12 | 在庫数・配送可否を実データと同期して出す | 表示と実態のずれが信頼を壊す |
レビューはポジティブとネガティブが混在しているほうが信頼度が68%高いと報告されています（250万件の分析、Reevoo）。ただしネガティブが2〜3件あると63%が購入を断念するという調査もあります（Lightspeed Research）。扱い方は「お客様の声（テスティモニアル）の集め方と置き方」にまとめています。
在庫表示は実データとの同期が前提です。 在庫が十分あるのに「残り1点」と表示するのは規制対象です。「希少性の原則とは？」を参照してください。
④カート投入のハードルを下げる（3施策）
| # | 施策 | 仮説 |
|---|---|---|
| 13 | モバイルでカートボタンを常時表示する | スクロール位置に関係なく押せる |
| 14 | サイズ選択をカートボタンと同じ画面内に置く | 選択のために戻らなくて済む |
| 15 | カート投入後にページ遷移させない（その場で通知） | 回遊が途切れない |
公開事例では、「カートに追加する」ボタンとサイズ選択をモバイルで常時表示した結果、注文完了数が4.1%増加しました（信頼度91%、36,000ユーザー以上・2週間、De Nieuwe Zaak / Miss Etam。出典: 【ABテスト事例】常に表示される「カートに追加する」ボタンは効果的？ - DLPO）。
ただし信頼度91%は一般的な基準の95%に達していません。 追試が必要な水準です。判定の考え方は「AAテストでABテストの有意性を見極める」を参照してください。
モバイル固有の論点は「モバイルLP最適化の方法」も参照してください。
着手する順番の決め方
15施策を上から順にやってはいけません。 次の順で絞ります。
ステップ1。熟読ヒートマップでKBFの到達率を測る。 決め手になる情報が何％のユーザーに読まれているかを出します。前述の事例では約30%でした。
ステップ2。到達率が低ければ①（情報の順番）から着手する。 折りたたみ・並べ替えで到達距離を縮めます。
ステップ3。到達しているのにCVしないなら③（信頼）に移る。 読まれているのに買われていないのは、情報があっても不安が残っている状態です。
ステップ4。カートボタン周辺のクリックが少なければ④に移る。
| 観測 | 着手する群 |
|---|---|
| KBFまで到達していない | ①情報の順番 |
| 到達しているがCVしない | ③信頼 |
| 到達してカートボタンも見ているが押されない | ④カート投入 |
| そもそも商品ページに来ていない | 商品一覧ページ側の問題 → 商品一覧ページのCVR改善 |
「そもそも商品詳細ページに来ていない」場合は、このページを直しても無駄です。 流入元を先に確認してください。
Dejamで商品詳細ページを検証する
ヒートマップ
熟読ヒートマップでKBFの到達率が測れます。 4秒以上読まれた箇所が分かるため、「スクロールはされているが読まれていない」状態も区別できます。離脱ヒートマップでは、どのセクションで離脱しているかが5%刻みで分かります。
ABテスト
アコーディオン化・セクションの並べ替え・カートボタンの常時表示をノーコードで検証できます。商品ページは点数が多いため、テンプレート単位で検証して全商品に反映する設計にしてください。
自動解析
どのコンテンツがCVRに貢献しているかをAIが解析します。「レビューは読まれているが貢献していない」のような状態を特定できます。
よくある質問
Q. 商品詳細ページは情報が多いほうがいいですか？
A. 情報量より到達距離が問題です。 公開事例では、情報量を変えずにアコーディオンで折りたたんだだけでKBF到達率が42%、CVRが17.3%向上しています。減らすのではなく、見出しだけ並べて開けるようにしてください。
Q. レビューはどこに置くべきですか？
A. 商品説明より上に置くパターンを検証してください。 前述の事例では、アコーディオン化によりレビューセクションのクリック率が28%増加しています。第三者の評価は判断の前に見せるほうが効きます。
Q. サイズ表は画像でもいいですか？
A. テキストの表にしてください。 画像だとモバイルで拡大が必要になり読まれません。テキストなら検索にも載ります。
Q. カートボタンは常時表示にすべきですか？
A. 検証する価値があります。 公開事例では注文完了数が4.1%増加していますが、信頼度91%で一般的な基準の95%に達していません。自社で追試してください。
Q. 何から着手すべきですか？
A. まず熟読ヒートマップで購買決定要因への到達率を測ってください。 到達していないなら情報の順番、到達しているのにCVしないなら信頼の担保が原因です。観測なしに施策を選ぶと空振りします。
まとめ
商品詳細ページのCVR改善について、要点を整理します。
- 離脱の原因は情報不足ではなく到達不足であることが多い
- 公開事例では購買決定要因への到達率が**約30%**だった
- 情報量を変えずにアコーディオン化するだけで到達率42%・CVR17.3%向上
- 見出しは30字以内で、開くべき項目が判断できるようにする
- 配送予定日・返品条件はカートボタンの近くに上げる
- サイズ表は画像ではなくテキストの表にする
- レビューは実測値で出す。 満点に偽装しない
- 在庫表示は実データと同期する。 乖離は規制対象
- モバイルのカートボタン常時表示は信頼度91%で追試が必要
- 着手順は熟読ヒートマップの到達率から決める
- 商品ページに来ていないなら、一覧ページ側の問題
CVR改善ならDejam！到達率から着手すべき施策を決める
Dejamは、LP制作・ヒートマップ分析・ABテスト・AI自動解析をオールインワンで提供するCVR改善特化ツールです。「商品ページで落ちているが原因が分からない」という段階から、到達率を測って施策を決めるまでを総合支援します。
Dejamが選ばれる理由
- ワンプロダクトで完結: LP制作・ヒートマップ分析・ABテストをすべて単一ツールで実施
- 月額3万円〜利用可能: オプティマイズプラン月額3万円〜 / CMSプラン月額5万円〜 / オールインワン月額12万円〜
- ユーザー課金なし: 何名で使っても追加費用は発生しない
- ISMS認証取得: ISO/IEC 27001:2022 & JIS Q 27001:2023認証取得済み
- 毎週アップデート: 市場トレンドとユーザーリクエストに応じて機能を毎週拡充
- 権威ある実績: 代表がダイレクトアジェンダで2連覇。LPO顕彰制度「LPO AWARD」主催者
Dejamの主要機能
- LP/記事LP制作: ノーコード・コードの切り替えに対応。AIで生成したコードを直接取り込み可能
- ヒートマップ: 5種類（クリック/クリックイベント/熟読/滞在/離脱）。データ保存期間無制限
- ABテスト: デザイン変更テスト・リダイレクトテスト・ポップアップテストの3種類。AIが自然言語でテストコードを自動生成
- 自動解析: どのコンテンツがCVRに貢献しているかAIが自動解析。ゴールデンルート機能でページ遷移の最適パスも特定
- プロジェクト管理: 改善施策の進捗をチームで共有できる
熟読ヒートマップは「スクロールされた」ではなく「4秒以上読まれた」を測ります。 到達率の実態はこの差に出ます。
