2017網站熱點圖的實現形式和功能特點

熱點圖是通過使用不同的標誌將圖或頁面上的區域按照受關注程度的不同加以標註並呈現的一種分析手段,熱點圖將用戶的每一次鼠標點擊、滾動、視野停留都轉作了數據化的色彩繪製出來,您不但可以一目瞭然用戶偏好,更方便和設計師溝通,優化網頁設計

2017網站熱點圖的實現形式和功能特點

熱點圖是一款好用的用戶行爲分析工具,通過用戶在頁面上的瀏覽軌跡,點擊熱區來找到網站內對用戶有價值的信息,並且優化網站死角來更加豐富和滿足用戶體驗。

  一、熱點圖的兩種實現形式

目前熱點圖有兩種主要的實現形式:

點擊熱點圖(clickmap):基於鼠標的點擊行爲採集、分析、呈現,crazy egg點擊熱點圖的佼佼者。

注意力熱點圖(Attation heatmap):不需要採集分析鼠標行爲數據,而是使用綜合多種神經學相關的算法來對人的視覺注意力進行模擬而生成以吸引注意力程度不同的熱點圖,

1、點擊熱點圖

點擊熱點圖的生成過程我們可以簡單劃分成三個部分:

(1)、鼠標點擊數據採集與上傳

第一部分的實現需要在企業網站的產品展示頁面埋設相應javascript代碼,代碼核心思想是利用鼠標點擊時會觸發onMouseDown事件,然後在事件中添加腳本捕捉鼠標點擊的具體位置座標、相應鏈接以及屏幕分辨率等相關數據,然後通過httpRequest對象將數據發送到訪客鼠標點擊數據採集服務器保存,數據採集服務器會將數據以某種固定格式保存,方便數據分析服務器提取和分析這些數據。

(2)、數據的分析建模生成點擊熱點圖

第二部分是主要部分,當網站決策者需要查看某頁面的熱點圖時,觸發系統向鼠標點擊數據分析服務器發出生成熱點圖請求,分析服務器通過在獲得相應的訪客鼠標點擊數據後進行彙總分析,形成該請求頁面的點擊數據集,在數據集基礎上進行圖形建模,最終形成產品關注度熱點圖,主要的步驟解釋如下:

a、解析鼠標點擊數據記錄:我們在採集鼠標點擊數據時會按照一種固定的預先定義好的格式進行記錄,那麼解析的過程遵守同樣的規則進行解析,最終還原各數據項,爲建模做準備。

b、還原鼠標點擊位置:首先生成空白熱點圖,然後在獲得的點擊數據基礎上進行點擊位置等數據還原

c、點擊數據集建模:使用預先設計好的單位點擊效果圖來標識每個點擊行爲,直到完成整個點擊數據集的建模

d、生成熱點圖:將已經完成的點擊數據建模圖進行格式轉換,轉換後的圖形將根據點擊的密集程度分成不同的顏色區域,點擊越密集的地方顏色將越鮮豔,相反點擊稀疏的地方顏色相應的要淡一些,最後轉換後的圖片需要進行透明化的處理,這個主要爲爲了後續展現過程服務,我們最終是希望將這個生成的熱點圖直接置於產品展示位置之上,透明的效果可以非常清楚的看到背後對應的產品信息

(3)、熱點圖的呈現

第三部分主要解決如何將服務器端生成的點擊熱點圖展示給網站決策者,這個過程是比較簡單的,可以結合新建層以及圖片透明化處理等手段來完成,這一步好了我們就可以得到大致效果圖,如下:

當然上圖是使用顏色的深淺來表示受關注的強弱,也可以使用點的密集程度以及百分比來進行標註,這方面crazy egg做的非常不錯,大家可以去感受下。

2、注意力熱點圖

注意力熱點圖是通過模擬人類看見物體前幾秒的視覺效果,同時使用一種預測一個真人最可能查看物體的方式的算法生成熱點圖,這個算法綜合了幾種神經科學研究理論,包括特徵整合理論、顯著性研究、視覺注意理論,眼動追蹤, 人類感知和認知。

使用注意力熱點圖,設計師、廣告主、創作者可以通過分析圖像吸引注意力的強弱來對這幅圖像的效果進行預先測試,當然也可以用於跟蹤注意力轉移路線,視覺熱點圖一般由以下因素組成:

(1)、熱區:最感興趣的區域。

(2)、熱點排序:下一個感興趣的點以及何時興趣轉移到其上(毫秒級)。

(3)、視覺串聯:眼睛在熱點間運動情況。

(4)、被忽略的區域。

視覺關注度熱點圖不僅可以對圖片進行熱點和關注度分析,還可以對視頻進行分析,這個是點擊熱點圖無法做到的,但對於分析的準確性點擊熱點圖的準確性要高於視覺關注度熱點。

  二、熱點圖的功能特點

從線下到線上,從單一到多樣,從展示到交互,從緩慢起步到爆炸發展。整個人類文明所獲得的全部數據中,有90%是在過去三年內所產生,這就是我們正在並且將持續依賴的線上世界,而面對我們視線不能觸達的遙遠彼端,我們需要一個助手來幫助自己收集、清洗和整理數據。

將用戶的一次次鼠標點擊還原,變成曲線、報告、可視化熱圖等等多種多樣便於我們理解的信息,讓我們看到用戶如何在網站中互動,在數據中找到問題、獲取機會,最大化優化用戶體驗、萃取推廣價值,像傳統服務那樣能夠面對面地把握用戶的'心思並作出正確的引導,不,我們甚至可以藉助更聰明的數據做得更好。

在這個新的數據時代,使用與之相匹配的工作方法,讓每一次訪問、每一次頁面瀏覽、每一次鼠標點擊產生非凡的價值,進行熱圖展示,真實反映用戶視野。

1、可視化的用戶行爲

您討厭一邊拿着受訪列表一邊往頁面元素上對照是不是?我們也討厭這樣。所以我們通過熱圖工具令用戶的每一次鼠標點擊、滾動、視野停留都轉作了數據化的色彩繪製出來。現在您不但可以一目瞭然看到用戶喜歡什麼?更可以方便地和設計部門的同事交流。

熱點圖可以直觀清楚地看到頁面上每一個區域的訪客興趣焦點,無須報告數據分析,圖形化展現,無需任何頁面分析經驗。

2、完美支持細分和對比

只是將所有的點擊堆放在一起還遠遠不夠,細分永遠能夠告訴我們更多,新訪客和回訪客的行爲意向是不同的,爲什麼有些用戶能夠完成註冊而有些不能?細分可以給我們更多啓發。

3、有條有理的點擊分佈圖

只看熱點和色彩還不夠,需要點擊量的數值?不妨試試點擊分佈圖,它能夠整整齊齊地爲您顯示一個元素上的點擊量數值。無論是鏈接、按鈕還是圖片、板塊,連同出站鏈接、搜索框這樣傳統監測無法直接統計的元素也可以包含在內,甚至連平時隱藏鼠標懸浮纔會展開的元素也能捕捉到!

4、標記推廣營銷

準備投放廣告?在社交網絡上發佈了消息並且附上了通往網站的鏈接?準備進行郵件營銷?推薦您全部使用網址構建器給廣告等鏈接指向的着陸頁面貼上標記。經過了特殊的標記,這些和自然流量不同的入站來源能夠被特別區分出來,瞭解用戶的質量和訪問偏好,更進一步幫助您優化廣告的投放策略。

5、轉化漏斗

通過將您有意引導用戶依次訪問的頁面流程設置爲,可以通過漏斗中積累的數據查看有多少用戶按照您預期的引導不斷前行,有多少用戶中途放棄離開,找到漏斗中的泄露點迅速改善,挽留更多的用戶順利完成轉化(具體可查看馬海祥博客《怎麼用熱力圖分析網頁》的相關介紹)!

6、快速細分

拒絕繁瑣的細分操作成爲尋求數據意義的障礙,定位細分目標,只需要幾次點擊。直觀地尋找細分對象,一邊閱讀數據一邊快速鑽取發現機會和問題。快速細分不僅快速易用,還貫穿着整個報告體系,找到一個剖析點,可以帶着它穿行全部報告甚至熱圖,直到您獲取到最終的信息。

7、轉化率與轉化價值

通過轉化,讓重要的用戶事件變得可以度量,我們不僅可以記錄對網站有益的轉化,如註冊、購買、索取資料,還建議您對意味着網站損失的用戶行爲同樣予以衡量,如註銷賬戶、取消訂閱、取消訂單等等。更加公正全面地衡量渠道和內容表現,當您發現一個渠道爲您帶來了大量用戶訂單,但是用戶在完成某項行爲後又大量取消訂單,您便需要進一步考慮推廣策略了。