人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ながーーーーーい、1ページ物のランディングページを作っているのですが、
google analyticsでの効果測定で困っています。
ユーザーのページ遷移が無いので、
どの位置までユーザーが見たか、またどのくらいサイトに滞在したかを
計測できない状況です。


ページを分けずにどの位置まで見られたか、
またどのくらいページに滞在したかをを計測する方法は
あるでしょうか?

一応、現在のところヒートマップを導入しようとか思っています。

よろしくお願いします。

●質問者: shirokuma2339
●カテゴリ:インターネット ウェブ制作
✍キーワード:Google Analytics サイト ヒート マップ ユーザー
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● standard_one
●23ポイント

ヒートマップで十分ならば(ページの途中でクリックされる前提のページ構成ならば)ヒートマップでよいと思います。

そうでないならAmazonのような仕掛けが必要でしょう。

内部的にどうやっているのかを解析したわけではありませんが、外から見る限りJavaScriptと何らかのモジュール(シルバーライト?)を組み合わせて「ページのその部分」が描画対象になった瞬間に動作を開始するようにしてあるようです。

試しに http://www.amazon.co.jp/ を開いてみてください、ページ下部に「チェックした商品の履歴」という枠があると思いますが、ここはどれだけ待った後にスクロールしても必ずLoadingになります。

つまりこの部分はオンデマンドなのです。

今回の場合は表示された瞬間にサーバ側に「ここが表示されたよ」という通信を発行するようにすれば目的は達成できます。

とはいえ、それを実現するための敷居はもの凄く高いんじゃないかと思います。

誰かがそういう技術を確立して、そのサンプルコードをコピペすれば誰でも同じことができるようになる日までヒートマップで我慢するのが現実的な落としどころなんじゃないかなぁと思います。

◎質問者からの返答

ありがとうございます。

Amazonの情報、とても参考になりました。

まずはヒートマップを導入し、時間を掛けながらより良い仕組みを探って行きたいと思います。


2 ● オーイェー
●23ポイント

そのランディングページがページの途中でクリックされるページなら

http://ryow.net/blog/2009/06/08-204327.php

のように、trackEventを使えば、GoogleAnalyticsで取得することができます。


途中でクリックされないなら、アイトラッキングが必要になると思います。

http://labs.cybozu.co.jp/blog/akky/archives/2008/02/feng-gui-eas...

とかは擬似的ですがフリーで使えます。


あと、サイトにどれくらい滞在したかについては、Analyticsに滞在時間という項目があるので

そちらで見れます。

◎質問者からの返答

クリックはされない作りにしているので、trackEventの導入は難しそうです。

また、ページ遷移が無いのでgoogle analyticsの滞在時間の計測も難しいです。


3 ● chinya
●22ポイント

standard_one さん同様、現実的にヒートマップの採用が現実的ですが、

オンロードのもう少し簡単な方法として、ランディングページに透過GIFを用意し、その透過GIFを追いかければいいです。

ですが、GoogleAnalyticsでは限界がありますので、有料のログ解析ソフトが必要ですね。

◎質問者からの返答

透過gifのヒント、ありがとうございます。

実際に導入しているサイトの情報がいただければとても嬉しいです。


4 ● standard_one
●22ポイント

透明GIFでピンときました。

処理の大筋はこんな感じになるはずです(実際に動かしてはないので要デバッグ)

括弧は全角にしてあるので、半角に直して試してみてください。

本文の改行ごとにonmouseoverの画像を仕込む。

※よくある「マウスが重なると画像が変わる」仕掛けの応用

本文1行目<BR>

<span onmouseover="document.pic001.src='on001.gif';" onmouseout="document.pic001.src='off001.gif';"><img name="pic001" alt="viewcheck" width="100%" height="1" src="off001.gif"></span><BR>

以下、本文とspanの繰り返しが続く

例のように文章1行、画像1行をひたすら繰り返す。

各行ごとに変更するのは以下の部分。

pic001:画像を表示してる部分の名前(画像の名前ではない)と思ってください。

off001.gif:透明GIF(じゃなくても背景と同じ色の画像なら何でも良い)、サイズは適当でいいです(1*1の画像で十分だと思います)。

on001.gif:マウスが重なるとこちらが表示される、off001.gifと同じく適当な画像でよい。

マウスがoff***.gifに重なるとon***.gifのリクエストが飛ぶので、Webサーバのログを解析してon***.gifのリクエスト回数を調べる。

※画像のリクエストもログにとるようにしてある必要があります。

大抵のPC用ブラウザで動作するはず。

根気さえあれば技術的な敷居はそれほど高くない。

マウスが重ならないとイベントが発生しないので、精度の保証はできない。

1行ごとに2枚の画像を用意しなくてはならないので面倒。

Webサーバのログ解析は自力で頑張ることになるかも?

例えば2行目は以下のようになります

本文2行目<BR>

<span onmouseover="document.pic002.src='on002.gif';" onmouseout="document.pic002.src='off002.gif';"><img name="pic002" alt="viewcheck" width="100%" height="1" src="off002.gif"></span><BR>

※1行ごとに画像を仕込めば精度が上がりますが、面倒なら10行に1回くらいの割合でもいいかもしれません。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ