「売れる根拠教えます！」自社ECコンバージョンアップ！デザインのプロが教えるサイト改善事例
- 2020.08.06
2024.03.08
売れている自社ECサイトのデザインやクリエイティブには「売れる根拠」があります。
サイト改善を成功させるために必要な「考え方」を理解し、自社にとって「必要な施策」を実行すれば、売り上げが劇的に改善することも少なくありません。
そこで株式会社フューチャーショップは7月6日、自社ECサイトの売上アップにつながるサイト改善をテーマとしたオンラインセミナー「コンバージョンを上げる改善のプロに学ぶ 売上アップの事例を公開！ ECサイト改善講座」を開催しました。
講師を務めてくださったのは、WEBサイトの制作や運用改善の専門家集団である株式会社ヘノブファクトリーの3人。
サイト改善によって売上アップにつながった自社ECサイトの実例を踏まえ、売れるデザインや売れるUIを具体的に解説してくださいました。
セミナー後半では、参加者さんが実際に運営しているECサイトの改善提案をその場で行うライブ診断も実施。
とても実践的で、すぐに実行できる施策が多数公開されたオンラインセミナーをレポートします！
目次
WEB制作・運用改善のヘノブファクトリーさんが登壇
講師を務めたのは株式会社ヘノブファクトリーの合志建彦さん、林田拓郎さん、舩田美希さんの3人。
それぞれサイト制作や解析、戦略立案、マーケティングなどを得意とし、多くのECサイトの業績改善をサポートしてきた各分野のプロフェッショナルです。
（ ▶ 写真左 )株式会社ヘノブファクトリー 制作部 ディレクター サイト育成担当 合志建彦（ゴウシ タケヒコ）氏
20年以上一貫して受託制作の立場でさまざまなサイトの企画提案・制作に従事。近年はUX的なアプローチを重視した調査・検証を行い、ユーザーとの接点を設計する段階から案件に携わる。日本ディレクション協会所属、クリエイター向けの講義登壇実績多数。人間中心設計スペシャリスト。
（ ▶ 写真中央 )
株式会社ヘノブファクトリー マークアップエンジニア 解析チームリーダー 林田拓郎 （ハヤシダ タクロウ）氏
自社で運営していたネットショップの初代店長として、月商30万円以下のサイトを2年で月商500万円まで引き上げた。鋭い洞察力でウェブサイトの弱点を見つけカイゼンできる能力を持つ。現在は大手食品メーカー、雑貨ブランド、貸し会議室など複数の企業のサイト育成を手がけ、ほぼ全てのクライアントの効果アップに貢献。
( ▶ 写真右 )
株式会社ヘノブファクトリー マーケティング部ディレクター サイト育成担当 ウェブ解析士 舩田美希 （フナダ ミキ）氏
放送事業会社にてWEB担当としてオウンドメディアの企画立案などを経験後、ヘノブファクトリー入社。WEBマーケティング全般を専門領域としながら、ECサイト・サービスサイトの改善提案・効果UPを幅広く支援した。その後、通販化粧品メーカーにて戦略・マーケティング責任者を経てヘノブファクトリーに復帰。ウェブ解析士。
株式会社ヘノブファクトリーとは？
2004年創業、2006年に法人化したウェブ制作・運営支援の会社。WEBサイトの戦略立案からサイト制作、運営、改善、WEBマーケティングまでトータルで行えるほか、サイトを継続して成長させる「サイト育成」を得意とする会社。
サイト制作・運営・コンサルティングの実績は800サイト以上。
年商1億円規模の自社ECサイトを運営した経験も踏まえ、有名メーカーのD2C-ECサイトなど多くのEC事業者の売上アップに貢献している。
サイト制作や運用、コンサルの実績は800サイト以上。
根拠のある施策で「効果」を積み重ねることが「大きな成果」につながる
セミナーの冒頭、合志さんは、サイト改善で成果を上げるために必要な考え方を説明するため、サイト改善の「効果」と「成果」の違いを説明しました。
同社が考えるサイト改善の「効果」とは、働きかけ（施策）によって現れる、望ましい結果のこと。
例えば、SEOによる検索結果順位の上昇など、施策の過程で表れる数値の変化を「効果」として定義しています。
一方で「成果」とは、「効果」を正しく積み上げることで成し遂げた結果や、到達して得た良い結果のこと。
正しい施策を高いクオリティで実行し、「効果」を積み上げることで売上アップや粗利益増加などの「成果」につながると強調しました。
「効果」はあくまで数値の変化。施策をやみくもに実行して「効果」を出しただけでは「成果」につながりません。
目的を明確にし、仮説を立てた上で、根拠のある施策を実行することで「大きな成果」につながります（合志さん）
大きな成果を出すには、根拠のある施策を打つことが必要だと説明
ECサイトのデザインを改善して広告効果を上げる方法
続いて、ECサイトのデザイン（クリエイティブや導線）を改善し、広告の費用対効果を高める方法を解説してくださいました。
例えば、広告の効果を測る代表的な指標である顧客獲得単価（CPA）は、広告経由のアクセス数（流入数）が一定であれば、ECサイトのコンバージョン率（CVR）が上がるほど改善します。
そのため、ECサイトのコンバージョン率を高めることが費用対効果を上げる重要なポイントです。
バナーを見直してCPAを改善した事例
コンバージョン率を上げる具体的な方法について、ECサイトの成功事例を解説しました。
事例として紹介したのは、月間訪問者数が約1万2000人の紅茶のネットショップ。
改善前は直帰率が約80%（直帰者約9600人）に達しており、サイト訪問者の離脱率が高いことが課題でした。
離脱率が高い原因として、バナーに次のような課題があったそうです。
- 商品よりも人物が目立っていた
- 価格の安さが魅力なのに、価格表記が小さく目立たなかった
- 流入キーワードである「ノンカフェイン紅茶」の文字が、サイト内で目立っていなかった
- バナーをクリック（タップ）できることが分かりにくかった
こうした課題を改善するため
- 商品を大きく写した写真に差し替えたほか、
- 値段や「ノンカフェイン紅茶」の文字を目立たせるデザインに変更。
- バナーの右下には「CHECK」と記載し、クリックできることを分かりやすくしました。
その結果、直帰率は約60%（直帰者が約7200人）に下がり、CPAの改善に成功したそうです。
-
- バナーを変えたことで直帰率が下がり、CPAの改善に成功したECサイトの事例
ECサイトのコンバージョン率を上げるには、ユーザーにとって使いやすく、商品の魅力が分かりやすく伝わるデザインにすることが重要です。
コンバージョンにつながる導線を太くすることで、顧客が逃げない（離脱しない）サイトを作れば広告効果が高まります（合志さん）
デザインを改善してサイト訪問者の離脱を減らせば、広告効果を高めることができることを解説
ECサイトの広告について、こちらの記事で詳しく解説していますので参考にしてください。
「購買心理の7段階」を活用して施策を正しく連動させる方法
ECサイトのデザインやコンテンツの構成を考えるフレームワークとして、サイト訪問者が商品を買うまでの心理状態に関する「購買心理の7段階」も紹介しました。
「購買心理の7段階」とは…
消費者が商品を買うまでに辿る「 注意 → 興味 → 連想 → 欲望 → 比較 → 確信 → 決断 」の心理変化を表したもの。
心理状態の変化に合わせて正しい施策を打つことで、購入を後押しできると考えるマーケティングのフレームワーク。
例えば、商品を欲しいと思っていない「注意」の段階の人に、キャンペーンの情報を出しても響きません。
まずは商品を欲しいと思ってもらい、「確信」の段階に移行した後にキャンペーンの情報を出すなど、サイト訪問者の心理状態に合わせて施策を打つことで成果が上がると考えられます。
-
- 購買心理に合わせてプロモーションやサイト構成を組み立てる
合志さんは、「注意」と「興味」は広告やブログなど、主にECサイトの外側の施策が影響するため、
サイト改善においては「連想」「欲望」「比較」の各段階でサイト訪問者の感情を動かすことが重要だと指摘。
「商品を買うと、どのようなメリットが得られるか」を具体的にイメージできるようなコンテンツを作ることが必要だと強調しました。
訪問者がどの段階で停滞しているのかを検証し、次の心理状態に進みやすくするようにコンテンツを改善していくことが重要です（合志さん）
消費者の心理状態に沿ったコンテンツの事例
「購買心理の7段階」の心理状態に沿ったコンテンツの事例として、「比較」段階のサイト訪問者からの問い合わせを増やすことに成功した、貸し会議室のサイトの取り組みを紹介しました。
その貸し会議室の強みは、会場に料理や飲み物をデリバリーする「ケータリング」が充実していること。
しかし、改善前のサイトはケータリングに関する情報量が少なく、サイト訪問者に貸し会議室の魅力が十分に伝わっていないことが課題でした。
そこで、ケータリングの紹介ページを作ってコンテンツを拡充。
注文できる料理や飲み物の写真を増やし、ケータリング会社ごとの詳細ページへのリンクを貼ることで、サイト訪問者が料理や飲み物について詳しく調べられるようにしました。
その結果、他社の貸し会議室よりもケータリングの種類が充実していることがサイト訪問者に伝わるようになり、貸し会議室を探している「比較」段階のユーザーからの問い合わせを増やすことに成功したそうです。
-
- 強みである「ケータリング」に関するコンテンツを拡充し、貸し会議室を探しているユーザーに対して自社の優位性を訴求した
別の事例では、「決断」の心理状態に沿ったコンテンツを紹介。
購入フローで顧客情報を入力する各ページで、ユーザーにクリックしてもらいたいボタンのデザインを統一し、直感的に操作しやすいデザインにすることで離脱率が下がったそうです。
-
- 買うことを決断した消費者が離脱しないように、購入フローの導線を分かりやすく伝えることが重要
自社ECサイトのデザイン改善実例と成果
セミナーでは、ヘノブファクトリーさんがサイト改善を支援したネットショップの実例も多数公開されました。
デザインや導線を改善したことで、購入件数が増えたり、直帰率が下がってコンバージョン率が大幅に改善したりしたECサイトの事例です。その一部を紹介します。
① ファーストビューのメニュー項目を変更し直帰率が低下
課題：1訪問あたりのPV数が少ない
- 改善前の問題点：メインのメニュー項目が「ご利用方法」「マイページ」など、サイト訪問者が最初に知りたい情報と乖離していた
- 改善策：「かつおぶし」「だし」など商品カテゴリをメニュー項目に掲載し、マウスオーバーで商品名が表示されるようにして商品を探しやすくした
- 結果：1人あたりのPV数と月間購入数が増加／新規ユーザーの直帰率が低下
サイト訪問者の多くは、まずは「商品を見たい」と思っています。
グローバルナビに商品ページへの導線を入れると、サイト訪問者にとって使いやすくなり、回遊性が上がります（林田さん）
② カテゴリごとにサムネイル（商品写真）を表示してCVRが改善
課題：スマホメニューで取扱商品が分かりにくい
- 改善前の問題点：スマホサイトのカテゴリ一覧がテキスト表記のみで、取扱商品がサイト訪問者に伝わりにくかった
- 改善策：カテゴリ名の横にサムネイル（商品写真）を追加し、視覚的に商品を探せるようにした
- 結果：成約数が増加／成約率が向上／1成約あたりの購入個数が増加
メニュー項目がテキストのみだと、商品について詳しく知らない人にとって選びにくくなります。
また、ブランド名などをローマ字で表記している場合も、新規ユーザーにとって読みにくいことがあるので、読み仮名を入れるなど工夫が必要です（林田さん）
③ カートボタンの色を変更して離脱率を下げた事例
課題：カートボタンが目立たずコンバージョン率が上がらない
- 改善前の問題点：カートボタンがコーポレートカラーでデザインされていたため、ページ内で目立たなかった
- 改善策：ボタンの色を青からオレンジに変え、どこをクリックすれば良いか分かりやすくした
- 結果：カート離脱率と、購入手続き以降の離脱率がどちらも低下
ボタンの色に絶対的な正解はありません。
まずはユーザー視点で仮説を立てて、クリエイティブのABテストなどを行いながら、データを検証して正解を導くことが重要です（船田さん）
ECサイトのデザインの考え方やポイントについて、こちらの記事で詳しく解説していますので参考にしてください。
参加者のサイトをライブ診断、改善策をその場でアドバイス
セミナーの後半は、聴講者の方が運営している自社ECサイトの課題をその場で分析し、改善案をアドバイスする「ライブ診断」を行いました。
事前にご応募いただいた聴講者の中から、鞄、スイーツ、食品、ジェルネイルなどを扱う5社のECサイトを診断しました。
聴講者の皆さんからは
「ECサイトへの流入数は多いが、コンバージョン率が低い」
「新規ユーザーの購入数が少ない」
といった悩みが寄せられ、ヘノブファクトリーさんの3人が改善策を具体的に助言しました。
サイト診断は無料にも関わらず、合志さん、林田さん、船田さんの3人は改善策を本気でアドバイス。
コンバージョン率を高めるためのグローバルナビの改善案や、新規顧客が商品を探しやすくなるカテゴリメニュー項目の見直しなど、すぐに実践できる施策がたくさんありました。
なにより、3人が真剣にディスカッションする内容そのものが、サイト改善のノウハウの塊であり、参加者さんが「なるほど」「さっそく、やってみます」などと意欲的におっしゃっていたのも印象的でした。
参加者の方が運営している自社ECサイトの改善策を、その場でアドバイスした
まとめ
今回のセミナーでは、サイト改善に必要な考え方や、サイト構成のフレームワークを学べたほか、すぐに実践できる施策も具体的に知ることができました。
参加者の皆さんは売上拡大につなげるヒントを掴むことができたのではないでしょうか。
売れているECサイトのデザインやコンテンツには、売上が上がる根拠があります。
それは決して美的センスや感覚だけで作られているのではなく、データ解析やユーザー心理の考察などを通じて論理的に作られているものだということをあらためて実感しました。
大きな費用をかけずにコンバージョン率を高められる施策もあります。
まずはできることから実践し、売上アップにつなげてください。
ECショップデザイン初心者の方にはこちらの記事もおすすめです。
デザインの基本をわかりやすく掲載。デザインチェックの際も役立ちます。
また、デザインがなかなか決まらない…という方はこちらの記事を参考に基本立ち返ってみるのも良いかもしれません。
◇◇◇
SaaS型ECサイト構築プラットフォーム 「futureshop」では、EC事業者さまの売上アップにつながるセミナーを随時開催しています。
テーマにあわせて各分野のプロフェッショナルの講師をお招きしていますので、興味のある方はぜひセミナーページをご覧ください。
◆株式会社ヘノブファクトリー様へはこちらから
