*

楽天スマホページでヒートマップを導入して改善


ヒートマップとは、ユーザーがどのように行動したか、可視化してくれるツールです。
以下のように、どこをクリックしたか、どのあたりをじっくり見ているか、一目瞭然です。楽天スマホページ ヒートマップ図
分かりやすいページ作りは重要ですが、特にスマートフォンではUI/UXの重要性が高いようです。
この記事では、楽天スマホページにヒートマップを導入して改善する手順について記載します。

スマホページを楽天Goldで作成する

ヒートマップツールは、楽天RMSで作成したページには導入できないので、楽天Goldでスマホ用のページを作成します。
スマホ特有のHTMLの組み方などは、楽天Goldでスマホページを作成するを御覧ください。

ヒートマップを導入する

ヒートマップツールは各種ありますが、25,000PVまでは無料で使えて操作も分かりやすいptengineがおすすめです。

なおKloutスコア(ソーシャルでの影響力を数値化したもの)が50以上の場合は、インフルエンサー特別限定プランという、ページ数に制限がなくPV数も200万PVまで無料で使えるプランが使えます。申し込む前に、Kloutで測定してみましょう。
なお弊社代表の場合は10月15日時点でKloutスコア53だったので、頻繁にソーシャルで活動していたらクリアすることが多いようです。

ヒートマップタグを設置する

ptengineでアカウント登録ができたら初期設定をして、プロファイル欄に解析したいサイトのドメインを入れます。
設定ができたら解析コードをクリックして、表示されたHTMLを作成したスマホページに入力したら完了です。
heat2

ヒートマップでの改善(1)

実際にヒートマップの結果を見てみましょう。
以下の事例だと、ファーストビューで大きな割合を占めるスライドバナーはそれほど赤くなっておらず、逆にスクロールを降りたところにある「メンズスニーカー」などの商品カテゴリバナーはよくクリックされています。
また、ファーストビューから1スクロールした人は僅か31%と、殆どの人が離脱していることがわかります。
楽天スマホページヒートマップ例 2
そこで、スライダーを取り払って商品カテゴリバナーを上に持ってきてみました。
また、クリックの多いカテゴリを優先して上に置くようにしてみました。
ファーストビューからのスクロール数は34%とあまり変わってないですが、検索ボタンや商品カテゴリのクリック数が大きく増えています。
この結果、トップページからの離脱率はマイナス20%と大きく減少しました。
楽天スマホページヒートマップ例 2

ヒートマップでの改善(2)

先ほどヒートマップで改善したスマホページの事例です。
看板の右側にある、「コンビニ後払い対応」という部分が、少しですがクリックされているのがわかります。
この部分は看板と一体になっているのですが、「コンビニ後払い」に興味がある人が一定数いることが伺えます。
そこで、この部分は別画像にして、ボタンとしてわかるように設定してみることにしました。
楽天Goldでスマホページのヒートマップ
こちらは設定を始めたばかりですが、後払い利用率が向上して転換率が向上すると思われます。

まとめ

ヒートマップツールは、仮説・検証がスピーディーにできるツールです。
導入に手間はかからないので、一度設定してみるのをおすすめします。

関連記事

楽天RMSの納期を一括設定するには【2月29日まで】

楽天の週間サポートニュースなどでも告知されていますが、2015年1月13日から商品ごとの納期情報の設

記事を読む

楽天、YahooなどのCSVをExcelで安全に開くには?

楽天やYahooショッピングなど、ネットショップの業務をやっていると「CSVデータ」がないと出来ない

記事を読む

楽々商品登録 関連商品イメージ

楽々商品登録君のカスタマイズ事例(1)

弊社で販売している多モール商品登録ソフト、楽々商品登録君のカスタマイズ事例です。 キッチンジャンル

記事を読む

no image

楽天ショップのショップ内サーチのカスタマイズ

楽天ショップで設置できる店舗内検索について 店舗内検索のフォームは実は裏側でいろいろなパラメータを

記事を読む

no image

楽天RMSでも出来るGoogle,YahooのSEO対策【1】

楽天ショップの場合、楽天サーチなど楽天サービスからの集客を意識しがちですが、rakuten.co.j

記事を読む

スマホ時代に合わせた楽天Goldページの最適化

楽天PCページのスマホ対策が大事だという事例。 スマートフォン対策を色々やった店舗様のGoogle

記事を読む

no image

楽天Goldのhttps:修正手順(SSL対応)

楽天Goldを使っている場合のSSL修正の手順 YahooショッピングのSSL対応に続いて、楽天市

記事を読む

楽天Goldで作成したページのFacebook最適化(OGP設定)

楽天GoldページのFacebookへの対応の仕方-OGP 楽天Goldで作成したページも、Fac

記事を読む

楽天Goldで作ったページをモバイルフレンドリー対応にするには?

Googleが、2015年4月21日からスマートフォン対応していないサイトは検索での順位を落とすと発

記事を読む

楽天の買い物かごボタンをカスタマイズ

この記事の「買い物かごをカスタマイズする方法」は、2015年に楽天RMSのHTMLソースが変わったた

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

RPP(楽天 検索連動型広告)で商品を除外する方法

楽天RPP(キーワード広告)でパフォーマンスレポートの見方はこちらのR

RPP最初の画面
RPPパフォーマンスレポートの新規、既存などの意味は?

楽天RPP(キーワード広告)を運用していく上で大事なのは、成果を見て改

no image
RPP(楽天キーワード広告)の平均ROASは?

楽天では、RPP(楽天プロモーションプラットフォーム)という検索画面に

no image
楽天ペイ(RMS)で効率的に受注管理するには?

楽天ペイは今までの受注管理、R-Backofficeと異なりステータス

Yahooショッピング SEO(7)3月14日から低評価でペナルティ

Yahooショッピングで2017年10月に発表された、評価が悪いショッ

→もっと見る

PAGE TOP ↑