標題很長,但這篇又是來混篇數

之前有介紹一個熱力圖的 Chrome 套件,但那個是顯示網頁載入圖片的負載程度

好用 Chrome 套件介紹 - Perfmap 用熱力圖的方式顯示網站區塊的載入速度

這次要來用熱力圖來找出一個頁面中,哪個區塊或功能最受使用者歡迎 

熱力圖、熱點分析是用來告訴你一個頁面中哪個區塊比較熱門 (依點擊,有些工具會根據滑鼠軌跡)

但這個區塊不代表一定是位在大部分使用者的視覺動向軌跡之中,視覺動向就要靠眼球追蹤來分析

就要隨機找使用者到電腦前開網頁,並配戴裝置來實際測試,一般人比較沒本錢做這種東西

但我們還是可以用熱點分析來看區塊的重要性,並把功能安排在使用者比較會看到的地方

舉例來說:

熱門的功能也有可能是網站的附加資訊,但對使用者當下來說很重要,因此使用者花了時間找到並點擊了

例如下圖的網站 foot,一般人在捲動並瀏覽頁面時大多不會注意到底下的網站資訊

直到使用者真的有需要才會在你的網頁上尋找,但在尋找的當下可能就心生肚爛,因為很難找

從上面熱力圖就可以看出,雖然是使用者不太會瀏覽到的區域,但是有些功能很常被點擊 (黃、紅區塊)

因為這些資訊對使用者來說重要程度較高,如果把這些熱門點擊的功能,搬到經眼球追蹤分析後的路徑上

或是搬到較容易被看到的地方,就可以讓使用者在你的網站上快速找到他想要的資料,提升網站的 UX 

 

因為本人窮鬼,所以會盡量找一些免費的工具來用,而且又不想在網頁中再埋一些有的沒的代碼了

網路上有很多免費的 heat map 分析工具,但前提都是要再埋入一段 js 追蹤碼

所以後來還是選用 Google 免費的 GA 頁面分析套件,因為 GA 追蹤碼是網頁中一定會埋的

 

Page Analytics (by Google)

套件位置:

https://chrome.google.com/webstore/detail/page-analytics-by-google/fnbdnhhicmebfgdgglcdacdapkcihcoh?hl=en/?utm_source=DiscoverPage&utm_medium=Card&utm_content=page_analytics

這個 Google 推出的 In-Page Analytics 套件,除了可以讓你看到該頁面在 GA 的一些數據

點下面的按鈕可以切到熱力圖顯示

然後你就可以明顯看出頁面上的哪個區塊最常被點擊了

如果頁面元素過多,你可以選擇符合 % 多少的才顯示

滑鼠移過去也會顯示真正的點擊數

 

這篇就......這麼簡單 @@  sorry 把你騙進來

 

其他網站或工具:

http://feng-gui.com/

可以 demo 看一下,但是實際使用要錢

 

https://crazyegg.com/   這個是比較多人用的,有免費 30 天試用

http://www.luckyorange.com/   可以免費試用

https://heatmap.me/   免費的

 

創作者介紹
創作者 小雕 的頭像
小雕

小雕雕的家

小雕 發表在 痞客邦 留言(0) 人氣()