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
-
タグ: つながりの力, イー・エージェンシー, コラム, リモートワーク, 人材育成, 企業文化, 信頼と自主性, 働き方, 広報戦略, 未来のリーダー育成, 次世代経営, 社長インタビュー, 組織づくり, 経営哲学, 経営者の視点
リモートワークどうする?経営合宿で何を話してる?【甲斐社長に聞く 第1回】|株式会社イー・エージェンシー公式note -
タグ: ECサイト分析, GA4, Googleアナリティクス, Looker Studio, gmpプレミアムサロン, イー・エージェンシー, コラム, ダッシュボード作成, デジタル販売推進, データ可視化, データ活用トレーニング, ニトリ, マーケティング分析, 探索レポート, 業務効率化
株式会社ニトリ様 GA4・Looker Studioワークショップ開催事例 – データ活用への関心の高さを実感! -
タグ: AIアップデート, AIデザイン支援, AI活用事例, Claude比較, Gemini 2.5 Pro, Google Gemini, HTML生成, イー・エージェンシー, グラレコHTML, コラム, フロントエンド生成, プロンプト設計, 手書き風デザイン, 生成ai, 視覚化
猫よりAI 第5回:「Gemini 2.5 Pro、すごくない?」──グラレコHTML出力をClaudeから移植してみた話|公式note -
タグ: エンジニア募集, オウンドメディア, コラム, ビジネス職, リモートワーク, レコメンドエンジン, 中途採用, 働きやすい環境, 採用強化, 社内文化, 翻訳ツール
【オープン社内報 2025年6月号】イー・エージェンシー プレミアムニュース -
タグ: エンジニア採用, キャリア採用, コミュニケーション, コラム, ブログ, リモートワーク, ワーケーション, 文化, 環境
2025年6月の募集職種一覧!ビジネス職を中心に採用強化中!|株式会社イー・エージェンシー公式note -
有限会社シサム工房様:さぶみっと!レコメンドご利用事例