2008年04月28日
ECサイトの画面設計–男と女、買い物の行動パターンはどう違う?
奥井 夏子
インフォメーションアーキテクト
便利さ、手軽さから、オンラインショッピングは今や私たちの生活の中に深く浸透しています。そして「売れるオンラインショップ」を目指して、各Eコマース(EC)サイトが凌ぎを削っています。ECサイトの構築にあたって、まずはそのショップのターゲットを設定し、それぞれの攻略方法を考えることが大切です。攻略方法を考えるには、ターゲットユーザーのサイト内行動を知る必要があります。
ここで1つの疑問が浮かびます。はたして、男性と女性で、ECサイト内の行動に違いはあるものなのでしょうか。
「楽天市場でギフトを買ってください」
今回のアイトラッキング分析では、「ECサイトにおいて男女の行動に違いはあるのか」を検証すべく、以下のテストを行いました。対象サイトは、日本最大のECサイト、楽天市場としました。
対象サイト:楽天市場
被験者:オンラインショッピング経験のある20代~30代男女、各3名
タスク:バレンタインデーもしくはホワイトデーのギフトを楽天市場にて購入する
予算:どの被験者にも始める前に予算を設定してもらった。6人とも3000円程度を目安としていた。なお、バレンタインデーのギフトはチョコレートと相場が決まっているのに対し、ホワイトデーのギフトにはこれといって決まりがない。そこで今回のテストでは、男女の条件を揃えるため、男性の被験者にはテスト前に前もって買うギフトを決定してもらい(例:花など)、その商品を探しにいってもらうこととした。
女性被験者は「特集バナー」をクリック
楽天トップにおいて、女性被験者AおよびCは「特集バナー(リンク)」をクリックしました。この女性はその後、「Luxeなショコラ」「デザインチョコ」「ネット限定チョコ」の3つのカテゴリを何度も行き来しました。
女性被験者Bは、トップから、「食品/スイーツ」カテゴリをクリックしました。その後この女性は、左ナビゲーションにある検索窓に「ジャンポールエヴァン」(ジャン=ポール・エヴァン:高級チョコレート店の名前)と入力し、絞り込みを試みました。

特集リンクをクリックする女性被験者A。(クリックすると別ウィンドウで拡大)。
青い丸と線は視線の動きを、赤い×印はクリックした場所を示す。
青い丸に書かれた数字は視点の移動順を示し、視線の滞留時間が長いほど青い丸は大きくなる。
動画1:女性被験者Aがサイトを見た様子。特集バナーをクリックして商品を探した(クリックすると再生します)
女性は商品のイメージやコンセプトを重視
下記図は、女性被験者Aの商品ページでの視線です。画像を注視し、その商品のイメージをしっかり確認していることが分かります。女性被験者3人とも「商品の選ぶ際に商品と同様にパッケージも重要視している」とコメントしていました。これは女性被験者ならではの特徴です。女性被験者Aは、最終的に「アニヴェルセル」(高級チョコレート店)の商品を選択しました。「ギフトなので上質なチョコレートを贈りたかった。アニヴェルセルのチョコレートは高級だと知っていた」というのが選んだ理由でした。
女性被験者の視線・行動をまとめると、
1. 商品だけでなくパッケージも含めて画像を見ている
2. 「Luxeなショコラ」「デザインチョコ」など、(スペックを紹介してはいないが)抽象的でも商品のイメージを連想させる文言に惹かれる
という傾向がうかがえます。女性は、ECサイトを訪れた際、すでにある程度具体的なイメージやこだわり(「特定のチョコレート店」「上質なもの」など)を持って、商品を閲覧しているものと思われます。そのため「イメージ」を伝えられる画像が必須です。ここで言うイメージとは、単なる商品画像という意味ではありません。女性は、商品のコンセプト(センスのよさ、高級感など)も含めて商品を閲覧するため、コンセプトをアピールし、イメージを掻き立てるような文言(例:Luxe、贅沢の意味)が重要となってくるのです。
男性は「まずは検索」
男性被験者は、楽天トップページで一様にある行動を取りました。それは、「検索」です。動画2は、男性被験者Cの視線を追跡したものです。この被験者は、スイーツをプレゼントしようとし、検索窓に「洋菓子」と入力しました。女性被験者が、カテゴリ内の「スイーツ」をまず選んだこととは対照的です。
動画2:男性被験者Cがサイトを見た様子。検索窓に単語を入れて商品を探した(クリックすると再生します)
今回のテストにおいて、特集バナーやリンクをクリックした男性被験者は1人もいませんでした。これも、女性被験者の行動との違いの1つです。事後インタビューにおいて、「バナーはあえて押さない」というコメントも男性被験者からは聞かれました。
では、男性が特に視線を向けていたコンテンツは何でしょうか?答えは、「ランキング」です。また「売れた個数」に注目する被験者もいました。事後インタビューでは、「ランキングにあるものは避けるかもしれない」というコメントも聞かれましたが、参考にする、しないはともかく、男性にとってデータ情報は目を引かれる要素のようです。
男性には事実を伝える商品提案を
「ジャンポールエヴァン」など、女性被験者が具体的なキーワードを入力するのに対し、男性被験者達の使った検索キーワードは、「ホワイトデー」「チーズケーキ」などおおまかなものです。そのためたくさんの検索結果がヒットしますが、それを絞り込むのに使っていたのは、「金額によるフィルター」でした。また、「セット/詰め合わせ」というカテゴリで絞り込む被験者もいました。
男性被験者Cは、最終的に、3種類のプリンの入った詰め合わせセットを選びました。選んだ理由は、「3種類の味が楽しめるから」という合理的なもの。イメージ重視でギフトを選んだ女性被験者とは、選択におけるポイントも異なっていました。
以上、男性被験者の視線、行動をまとめると、
1. 男性は検索窓を利用する
2. ランキング・売り上げなど、データ情報を注視する
3. 「セット/詰め合わせ」「ギフトセット」など内容を示す文言に惹かれる
ということが言えます。男性はECサイトにおいて、検索をファーストアクションとする傾向があります。また、商品を閲覧する際に、ランキングなどのデータを活用しています。また、イメージを掻き立てる文言よりも、「セット/詰め合わせ」「ギフトセット」のような、内容を示す文言に注目しながら商品を絞っていくようです。また「金額によるフィルター」など実用的な機能も重要です。
ECサイトで女性に必要な要素、男性に必要な要素
今回のテスト結果を図にまとめました。

女性も男性も、商品画像は注視しています。ただその他重要視する要素は、男女において異なるようです。商品画像において、女性はパッケージ等も注目しており、商品コンセプトやセンスなどをも画像から読み取ろうとしていることが分かりました。一方男性にとっての商品画像は、データの一部であり、男性が特に好むコンテンツは、ランキングや売り上げ個数などデータに関する情報でした。
行動においても男女による違いがあります。女性は、探す商品のイメージをある程度自分の中に持ちながら、抽象的なコンセプトを基準に商品を選択します。一方男性は、まずは大まかに検索をかけ、その後、金額や形態などのフィルターを使って合理的に商品を絞りこんでいきます。
これらの男女の行動特性を踏まえ、ECサイトの画面設計を行うと有効だと言えるでしょう。
本コラムは、奥井がCNET Japanにて連載している「視線が明かすウェブ制作の常識・非常識」にて2008年3月28日掲載された原稿です。
PICK UP
-
タグ: Cloud Shell構築, GA4, GA分析自動化, Gemini CLI, Google アナリティクスMCP, LLM連携, コラム, データ対話型分析, モデルコンテキストプロトコル, 自然言語分析
2025年7月発表!自然言語でGA4を分析できる「Google アナリティクスMCPサーバー」を構築する方法 -
タグ: AIエージェント, GA360, Gemini in Looker, Google Cloud Next, Next Tokyo, Vertex AI Search, イベントレポート, コラム, データ分析高度化, データ利活用, 検索体験向上, 生成AI活用
【Next Tokyoレポート】主役は生成AI!GA360×生成AIの最新活用法を紹介 -
タグ: ASEAN展開, Direct Engine, インドネシア, オフショア開発, グローバル協業, コラム, ジャカルタ, スラバヤ, ビジネス熱気, ファンデザイン室, 出張レポート, 文化共存
【出張レポート】インドネシアで見た、熱気と未来への可能性|株式会社イー・エージェンシー公式note -
タグ: AI実証実験, AI高速処理, ECサイトパーソナライズ, Groq API, HTML自動生成, UX最適化, Web制作, コラム, リアルタイムAIパーソナライズ, 技術進化
【ウェブ制作】AIを使ってウェブサイトをリアルタイムにパーソナライズしてみたい!|株式会社イー・エージェンシー公式note -
タグ: GA4トレーニング, GA4初心者, Udemy講座, gmpプレミアムサロン, アクセス解析学習, コラム, スマホ学習, データ活用, 探索レポート, 解析スキルアップ
プロに学ぶ、夏のGA4スキルアップ。アクセス解析の基本講座が1,500円【8/31まで】 -
タグ: AIと人の協業, AI活用事例, Google Gemini, gemini, カスタム議事録, コラム, プロンプト設計, 会議効率化, 文字起こし, 業務効率化, 議事録効率化
【もう議事録は書かない】Geminiを使って、文字起こしからカスタム議事録を作成|株式会社イー・エージェンシー公式note