WEB制作

KNOWLEDGE

商品ページのデザインで購入率は変わるのか|見せる順序と、離脱を生む要素

  • #WEB制作

SHARE

商品ページの改善というと、写真を大きくする、ボタンを目立たせる、といった見た目の調整が思い浮かびます。しかし購入率を左右するのは買う前に確認したい情報が揃っているかと、その順序です。

実際、購入をやめる理由の多くは「気に入らなかった」ではなく「判断できなかった」です。サイズが分からない、届く日が分からない、返品できるか分からない。この状態で購入するのは負担が大きいため、離脱します。

この記事では、確認される項目を順番に整理し、写真の役割、離脱を生む典型的な状態、そして改善の優先順位を扱います。

この記事でわかること

・購入前に確認される情報と、その順序

・写真が果たす役割と必要な枚数

・離脱を生む典型的な状態

・商材によって変わる重点

・改善の優先順位

・効果の測り方

確認される情報の順序

購入する人は、次の順で判断します。この順序で配置すると、迷いが減ります。

  1. 何であるか:写真と商品名
  2. いくらか:価格。税と送料の扱いも含む
  3. 自分に合うか:サイズ、容量、対応機種、素材
  4. いつ届くか:発送の目安
  5. 失敗したらどうなるか:返品・交換の条件
  6. 他の人はどうか:レビュー、利用者の声
  7. 買う:カートに入れる

3番目から5番目が不足しているページが多くあります。特に5番目は、購入の心理的な負担を大きく下げます。返品できると分かれば、迷っている段階でも進めるためです。

2番目については、価格の近くに送料の条件を書いてください。カート画面で初めて送料が出ると、そこで考え直されます。段階別の離脱対策はカート離脱を防ぐデザインの工夫|どの段階で、何を理由に離れているかで扱っています。

離脱の理由は「気に入らない」より「判断できない」。

返品の条件を書くだけで、迷っている段階の人が進める。

写真の役割と枚数

写真 役割 優先度
全体が分かる1枚 何であるかを伝える 必須
サイズが分かる1枚 手に持つ、既知のものと並べる 必須
素材・質感の接写 実物との差を減らす 高い
使用中の様子 使う場面が想像できる 高い
同梱物の一覧 何が届くか分かる
イメージ写真 雰囲気づくり 低い

2行目が最も不足しています。寸法を数字で書いてあっても、大きさは想像できません。手に持った写真、既知のものと並べた写真が1枚あるだけで、サイズに関する問い合わせと返品が減ります。

6行目は枚数を占めるわりに判断材料になりません。加工が強い写真も、実物との差が返品につながるため避けてください。

離脱を生む典型的な状態

  • 価格の近くに送料の条件がない:カートで想定外の金額になる
  • サイズが数字だけ:大きさが想像できない
  • 在庫の状況が分からない:買えるかどうかが不明
  • 返品の条件がどこにも書かれていない:探しに行って戻ってこない
  • 説明文が長く、要点が埋もれる:判断材料を探せない
  • スマートフォンでボタンが遠い:スクロールが必要になる

4行目はページ内に書かず、別ページのリンクだけにしている場合に起きます。移動した先で戻ってこないため、要点だけでも商品ページ内に書いてください。

5行目については、説明文の長さそのものは問題ではありません。要点が先にあり、詳細が後ろにあるという順序になっていれば、長くても離脱しません。

商材によって変わる重点

商材の特徴 重点を置く項目 理由
衣類・靴 サイズ、素材、着用イメージ 合わなかったときの負担が大きい
食品 内容量、原材料、賞味期限、保存方法 口に入れるため確認が細かい
家具・大型 寸法、搬入経路、組立の要否 設置できるかが最大の懸念
家電・機器 対応機種、仕様、保証 使えるかどうかが前提
ギフト用途 ラッピング、のし、配送日の指定 用途が決まっている
定期購入 解約条件、次回の変更方法 縛りへの不安が最大の障壁

最終行は特に重要です。定期購入では、解約条件が分からないことが最大の離脱要因になります。条件を明示するほうが、隠すより結果的に申し込みが増えます。

3行目も見落とされます。搬入できるかどうかが分からない状態では、購入の判断ができません。

改善の優先順位

  1. 不足している判断材料を足す:サイズ、送料、返品、在庫
  2. 順序を並べ替える:要点を先に、詳細を後ろに
  3. 写真を足す:サイズが分かる1枚、使用中の1枚
  4. スマートフォンで確認する:ボタンの位置、文字の大きさ
  5. 文言を整える:入力例、注意書き、次に何が起きるか
  6. 装飾を調整する:最後

1番目と2番目は費用がほとんどかからず、効果が大きい作業です。書き足すだけ、並べ替えるだけで済みます。装飾の調整は最後で構いません。

5番目については、短い文言が迷いを減らします。考え方はマイクロコピーとは?CVRを動かす短い文章の書き方を参照してください。

最も費用対効果が高いのは、不足している情報を書き足すこと。

装飾の調整は最後でよい。

効果の測り方

指標 何が分かるか 見る単位
商品ページからカートへの遷移率 ページで判断できたか 商品ごと
ページの滞在時間 情報を探しているかどうか 他の商品と比較する
どこまで読まれているか 重要な情報が読まれる位置にあるか スクロールの到達率
問い合わせの内容 何が書かれていないか 月次で分類する
返品・交換の理由 実物との差が出ている箇所 月次で分類する

4行目と5行目が最も具体的な改善につながります。問い合わせが来た内容は、ページに書かれていない情報そのものです。同じ質問が3回来たら、ページに書いてください。

5行目も同様で、「サイズが違った」が多いならサイズの見せ方、「思っていた色と違う」なら写真の色味に原因があります。EC全体の改善の順序はECサイトのデザインで購入率を上げる方法|段階別の改善手順で扱っています。

よくある失敗

写真を大きくすることから始める

判断材料が不足していれば、写真を大きくしても購入されません。情報を足すのが先です。

サイズを数字だけで書く

大きさが想像できません。手に持った写真か、既知のものと並べた写真を1枚入れてください。

返品条件を別ページにだけ置く

移動した先で戻ってこないことがあります。要点は商品ページ内に書いてください。

説明文を短くしすぎる

長さより順序の問題です。要点を先に置けば、詳細が長くても離脱しません。

問い合わせの内容を記録しない

ページに何が書かれていないかを知る最良の材料です。分類して月次で見てください。

よくある質問

レビューは必須ですか

あると判断材料になりますが、件数が少ないうちは無理に表示しなくて構いません。1〜2件だけの表示は、かえって実績の少なさを示します。集め方は「お客様の声」の効果的な掲載方法|信頼につながる集め方と見せ方を参照してください。

価格は税込と税抜のどちらを大きく出しますか

最終的に支払う金額が分かることが重要です。表示に関する制度上の要件もあるため、自社の商材に適用される規定を確認してください。カート画面で金額が変わる状態は避けてください。

動画は必要ですか

使い方や動作が伝わりにくい商材では効果があります。ただし写真で足りる商材では優先度が下がります。まずサイズと使用中の写真を揃えてから検討してください。

スマートフォンとパソコンで構成を変えるべきですか

順序は同じで構いません。変えるべきは、ボタンの位置と1画面に入る情報量です。スマートフォンでは要点までのスクロール量が離脱に影響します。

関連商品の表示は効果がありますか

購入後の画面や、迷っている段階では効果があります。ただし判断材料の途中に挟むと、比較が増えて決められなくなります。置く位置に注意してください。

まとめ

商品ページで購入率を左右するのは装飾ではなく、買う前に確認したい情報が揃っているかと、その順序です。購入をやめる理由の多くは「気に入らなかった」ではなく「判断できなかった」ためです。サイズが分からない、届く日が分からない、返品できるか分からない。この状態では購入の負担が大きくなります。

確認される順序は、何であるか、いくらか、自分に合うか、いつ届くか、失敗したらどうなるか、他の人はどうか、です。特に不足しやすいのが3番目から5番目で、なかでも返品の条件は購入の心理的な負担を大きく下げます。返品できると分かれば、迷っている段階でも進めるためです。

写真で最も不足しているのは、サイズが分かる1枚です。寸法を数字で書いても大きさは想像できません。手に持った写真、既知のものと並べた写真が1枚あるだけで、サイズに関する問い合わせと返品が減ります。そして改善で最も費用対効果が高いのは、不足している情報を書き足すことと、順序を並べ替えることです。装飾の調整は最後で構いません。

当社ではホームページ制作において、購入導線の設計と改善をご相談いただけます。自社の商品ページを点検したい場合は、資料をダウンロードのうえご活用ください。

SHARE