挑戰(zhàn)網(wǎng)站分析中的大眾智慧（2）——熱圖
來(lái)源:網(wǎng)站推廣 2012-09-06
【每期一句】所有人都沉浸在時(shí)間之中,并被流逝的歲月卷走。人終其一生不過(guò)是在與時(shí)間抗?fàn)�。我們很想抓住一次戀�?ài),一場(chǎng)友情,但是這些情感只能依附于人才能得以留存,而每個(gè)人自己,隨著時(shí)間的流逝 ,也在不斷地解體和沉沒(méi)——或是死去,或是溜出我們的生活之外,或是我們自己已然改變。——普魯斯特
【前言】上期我們?cè)敿?xì)討論了bounce rate中的一些大眾智慧,為大家說(shuō)明了“過(guò)猶不及”的道理,bounce rate過(guò)低并非好事,bounce rate過(guò)高也可能只是技術(shù)原因。這一期,我們看看朋友們特別喜歡的另外一個(gè)工具——熱圖�？纯礋釄D中的大眾智慧有什么“小誤區(qū)”。
【正文】
“一圖勝千言”,在網(wǎng)站分析中也完全如此。我們喜歡熱圖的原因,是這張圖非常明確地告訴我們用戶對(duì)一個(gè)頁(yè)面上的什么部分感興趣,而且非常直觀。我曾經(jīng)有客戶告訴我:我什么都不需要,你就給我熱圖就好了。我想,他一定是因?yàn)闊釄D易讀好懂,且滿含信息,所以才對(duì)它青睞有加。
于是,眾多的工具也有意無(wú)意強(qiáng)調(diào)了熱圖的重要性,大家熱衷創(chuàng)造比“別人”更好的熱圖功能,從而獲取更多的用戶好感。
此熱圖非彼熱圖
熱圖可能不像大家想象的那么簡(jiǎn)單。最早的熱圖思想來(lái)自于研究用戶瀏覽圖像行為的那些專家們,其實(shí)熱圖不僅僅只是給網(wǎng)站網(wǎng)頁(yè)分析用的,熱圖自一開(kāi)始,就是一種用于研究人的視覺(jué)認(rèn)知的嚴(yán)肅科學(xué)方法。
所以熱圖并非我們?cè)诰W(wǎng)站分析工具上看到的熱圖(點(diǎn)擊密度圖),而是指用戶的視覺(jué)注意力圖。下面這張著名的Google熱圖的紅藍(lán)漸變就是描繪用戶眼球注意力的。
據(jù)說(shuō)Google用這個(gè)圖來(lái)決定廣告位置的價(jià)格,左邊的價(jià)格高于右邊,顯然是因?yàn)樽筮叓@得的用戶注意力遠(yuǎn)遠(yuǎn)高于右邊。
所以,如果我們只是說(shuō)“熱圖”,我們應(yīng)該想到的是人眼鏡的注意力熱圖,而非點(diǎn)擊的熱圖。而在英語(yǔ)中,視覺(jué)熱圖常用eye tracking heat maps,點(diǎn)擊熱圖則用click heat maps表示,是不一樣的。
對(duì)于UE設(shè)計(jì)師,網(wǎng)站UI等負(fù)責(zé)頁(yè)面視覺(jué)和交互的朋友而言,人眼注意力的熱圖十分好用。一旦你知道你做出來(lái)的東西,人的眼睛是如何進(jìn)行觀察的,你就可以知道你的東西是不是真的“抓住了眼球”,還是僅僅只是讓人們“視而不見(jiàn)”。
下面這張圖是Facebook改版前后的用戶注意力熱圖。一言兩語(yǔ)似乎沒(méi)法表述這次改版到底是成功還是失敗,但在某一個(gè)方面,Facebook很成功的讓用戶的注意力產(chǎn)生了“左右對(duì)稱”,而擺脫了“Google頁(yè)面的瀏覽模式”。
人眼的注意力熱圖是怎樣獲得的呢?有兩種方法。
第一種方法是利用“眼動(dòng)儀”,據(jù)說(shuō)這是一種成本很高的方法。人們坐在一個(gè)屏幕面前,旁邊放上眼動(dòng)儀記錄人的眼球運(yùn)動(dòng)軌跡。這種方法很精確,但采集樣本比較有限,操作難度也比較大。
第二種方法不需要利用眼動(dòng)儀,看起來(lái)很神奇。它僅僅只需要帶有攝像頭的筆記本電腦即可。在做測(cè)試的時(shí)候,攝像頭啟動(dòng),拍錄下用戶眼球的運(yùn)動(dòng),然后結(jié)合被測(cè)內(nèi)容做出用戶的眼動(dòng)熱圖。這種方法有一個(gè)非常大的好處,并非僅在于其成本的低廉,而是由于不需要專門的設(shè)備,能夠獲得較大的樣本,甚至能夠不受地域的限制。關(guān)于這種方法,在國(guó)外有服務(wù)提供商,名字叫做eyetrackshop,大家可以看看它的視頻介紹。
談了不少注意力熱圖,該說(shuō)說(shuō)點(diǎn)擊熱圖了。關(guān)于點(diǎn)擊熱圖,事實(shí)上在專門的網(wǎng)站分析工具出現(xiàn)也已經(jīng)出現(xiàn)了,而并非是Google Analytics或Omniture的專利。依據(jù)每個(gè)點(diǎn)擊帶來(lái)的效果的不同,點(diǎn)擊圖其實(shí)又可以分為鼠標(biāo)點(diǎn)擊的熱圖,描述每個(gè)鏈接發(fā)生轉(zhuǎn)化數(shù)量的熱圖以及描述每個(gè)鏈接最終產(chǎn)生的銷售的熱圖。我們最為常用的是鼠標(biāo)點(diǎn)擊的熱圖。
下面我們看看點(diǎn)擊熱圖中有哪些常見(jiàn)的大眾智慧,其中又有哪些誤區(qū)。
點(diǎn)擊熱圖無(wú)法做到的
我們拿點(diǎn)擊熱圖衡量用戶的興趣,這很恰當(dāng),點(diǎn)擊多的表明用戶興趣大。但反過(guò)來(lái)則不一定成立,即點(diǎn)擊少的地方不一定用戶的興趣就少,或者說(shuō),人們的注意力被吸引的程度和鼠標(biāo)點(diǎn)擊的次數(shù)并不總是保持一致的。道理很簡(jiǎn)單,人們眼光注意到的地方未必是能夠被點(diǎn)擊的區(qū)域,或者雖然對(duì)用戶產(chǎn)生了吸引力讓人情不自禁地多看了兩眼,卻缺乏足夠的說(shuō)服力讓用戶點(diǎn)擊鏈接(請(qǐng)注意有吸引力的東西未必就有說(shuō)服力);反過(guò)來(lái),在另外一些地方,也許一開(kāi)始用戶根本就沒(méi)有給予更多的注意,但部分用戶多看兩眼后發(fā)現(xiàn)了它并且認(rèn)可這個(gè)區(qū)域的價(jià)值,因此這里也許能獲得了不少的點(diǎn)擊,但卻不是注意力的焦點(diǎn)。因此,點(diǎn)擊熱圖肯定不能完全用來(lái)描述頁(yè)面吸引人們注意力的情況,也不能完全滿足我們?cè)谠O(shè)計(jì)頁(yè)面時(shí)的一個(gè)重要需求,即讓頁(yè)面中最能抓住人們注意力的地方放入最為重要的內(nèi)容,從而保證用戶注意力和興趣的一致性。
下面這個(gè)例子說(shuō)明了這種情況。左圖是這個(gè)頁(yè)面的點(diǎn)擊熱圖,右圖是這個(gè)頁(yè)面的注意力熱圖,二者有一個(gè)很明顯的差異。
對(duì)UE(User Experience)或者UI(User Interface)而言,比較二者(注意力熱圖和點(diǎn)擊熱圖)的差異具有非常重要的價(jià)值。如果某個(gè)區(qū)域吸引了很多目光,那么干嘛我們不把最重要的內(nèi)容放在這里呢?反過(guò)來(lái),如果某個(gè)區(qū)域獲得了很多點(diǎn)擊,而且這個(gè)區(qū)域是非常重要的,那么我們就需要把它放置在人們目光最集中的地方�？墒�,如果我們沒(méi)有注意力熱圖,那么我們就只能揣測(cè)人們的目光會(huì)按照我們所希望的方式停留。
點(diǎn)擊熱圖另外一個(gè)無(wú)法實(shí)現(xiàn)的功能是人們注意力移動(dòng)的軌跡。有一些負(fù)責(zé)網(wǎng)站分析工具產(chǎn)品的朋友告訴我,我們可以把鼠標(biāo)移動(dòng)的軌跡當(dāng)作用戶注意力的軌跡。我不是特別贊同。以我自己的習(xí)慣而言,瀏覽網(wǎng)頁(yè)的時(shí)候,我的眼睛是先行移動(dòng)的,并且不斷快速掃視,直到發(fā)現(xiàn)某個(gè)我感興趣的內(nèi)容,我的鼠標(biāo)才會(huì)相應(yīng)移動(dòng)。這就如同我們?cè)隈{駛過(guò)程中的變線或轉(zhuǎn)向,我們并不會(huì)轉(zhuǎn)動(dòng)方向盤,除非我們首先觀察后視鏡并且確定旁邊沒(méi)有其他車輛或干擾。
注意力熱圖可以實(shí)現(xiàn)人們注意力軌跡的跟蹤,如下圖所示:
在這個(gè)圖中,注意力熱圖告訴我們,首先吸引人們眼光的是后腦勺,然后才是這個(gè)網(wǎng)站的logo。這與我們通常認(rèn)為的從左上到右下掃視的規(guī)律是不同的。
注意力軌跡又給了我們分析一個(gè)頁(yè)面的新線索——頁(yè)面布局和所用圖像的不同,會(huì)顯著影響用戶的注意力。若再與AB測(cè)試相結(jié)合,又能給我們很多有意思的故事。對(duì)UI同事會(huì)有很多幫助。
如果我們沒(méi)有注意力軌跡圖,那么鼠標(biāo)移動(dòng)的情況可以近似代替�？墒锹闊┰谟�,我見(jiàn)過(guò)的工具只能給我每一個(gè)用戶單獨(dú)的鼠標(biāo)移動(dòng)情況,但無(wú)法給我總體的移動(dòng)概況。我們?cè)谥蟮南盗形恼轮?會(huì)強(qiáng)調(diào)概況數(shù)據(jù)的意義,而單獨(dú)用戶數(shù)據(jù)的意義就要小太多了。
所以,如果有條件,能夠把注意力熱圖和點(diǎn)擊熱圖結(jié)合起來(lái),那就太棒了。你觀察世界的角度將立即發(fā)生變化。畢竟,awareness(意識(shí)到)才會(huì)有action(點(diǎn)擊),二者是單獨(dú)的兩個(gè)事物,應(yīng)該單獨(dú)衡量。
點(diǎn)擊熱圖的監(jiān)測(cè)技術(shù)問(wèn)題
前面我們了解了點(diǎn)擊熱圖并不能夠完全反映興趣(注意力),下面我們看看在一般工具(Google Analytics或者是Omniture的SiteCatalyst)中點(diǎn)擊圖可能存在的監(jiān)測(cè)技術(shù)問(wèn)題。
第一個(gè)問(wèn)題是面對(duì)一個(gè)頁(yè)面中具有同樣URL的多個(gè)links無(wú)能為力。
如果你足夠細(xì)心,你會(huì)發(fā)現(xiàn)曾經(jīng)在Google Analytics中有一些熱圖的點(diǎn)擊百分比例的標(biāo)注是實(shí)線格,有一些則是虛線格。虛線格的意思是,存在一個(gè)或者多個(gè)完全一樣URL的鏈接,標(biāo)注的這個(gè)link只是其中之一,并且標(biāo)注的百分比并非是這個(gè)link的點(diǎn)擊量,而是所有具有這個(gè)URL的links的總點(diǎn)擊量�，F(xiàn)在Google Analytics采用了更好的方法,即直接標(biāo)注出這個(gè)URL有多少個(gè)相同的鏈接(如右圖所示)。因?yàn)槎鄠�(gè)鏈接共享同一個(gè)URL的原因,解釋了為什么有一些朋友認(rèn)真的把Google Analytics頁(yè)面點(diǎn)擊熱圖的所有百分比加總起來(lái)不會(huì)得到100%,而是遠(yuǎn)高于100%的原因。
類似的問(wèn)題在Omniture技術(shù)支持的SiteCatalyst中也一樣。
事實(shí)上,上面這段話中“點(diǎn)擊量”三個(gè)字也是不準(zhǔn)確的。原因在于,Google Analytics或者SiteCatalyst,它們記錄的并非是這個(gè)link真實(shí)被點(diǎn)擊的數(shù)量,而是記錄了這個(gè)link被點(diǎn)擊之后打開(kāi)的相應(yīng)頁(yè)面的PV。例如某個(gè)link被點(diǎn)擊了100次,這個(gè)link對(duì)應(yīng)的頁(yè)面被打開(kāi)了85次(我們確信有一些點(diǎn)擊實(shí)際上沒(méi)有打開(kāi)頁(yè)面或者沒(méi)有被網(wǎng)站分析工具記錄到打開(kāi)頁(yè)面是完全可能的,也是正常的),那么工具實(shí)際上記錄了85,而非100。
由于這問(wèn)題的影響,我們產(chǎn)生了第二個(gè)問(wèn)題——如果我們不做額外的配置(virtual page監(jiān)測(cè)或者外鏈監(jiān)測(cè)),我們就不能知道一些不能打開(kāi)新頁(yè)面的鏈接,比如JavaScript彈窗,或是鏈接到別人網(wǎng)站的外鏈(outbound link)被點(diǎn)擊的數(shù)量。
所以,一般工具的點(diǎn)擊熱圖并不會(huì)告訴你真正的點(diǎn)擊量是多少。不過(guò),也有其他一些熱圖工具它們記錄鼠標(biāo)的動(dòng)作,而不是記錄鏈接被點(diǎn)擊后打開(kāi)新頁(yè)面的情況,所以,它們會(huì)比較準(zhǔn)確的記錄實(shí)際的網(wǎng)頁(yè)上的點(diǎn)擊量,甚至是鼠標(biāo)軌跡。但這么做似乎又犧牲了另外一些功能,例如在普通的Google Analytics熱圖中,可以記錄每個(gè)link點(diǎn)擊之后產(chǎn)生的轉(zhuǎn)化的數(shù)量,并且做出一張“轉(zhuǎn)化”熱圖,銷售金額的熱圖也不成問(wèn)題,但鼠標(biāo)動(dòng)作和軌跡監(jiān)測(cè)工具則難有這樣的能力,畢竟它們不知網(wǎng)站的轉(zhuǎn)化情況。
第三個(gè)問(wèn)題是面對(duì)頁(yè)面中的諸如“輪播焦點(diǎn)圖”之類的鏈接比較令人困擾。在這些地方,Google Analytics的熱圖工具給出了幾個(gè)并列的若隱若現(xiàn)的數(shù)據(jù),并不太容易辨別到底是那個(gè)輪播圖產(chǎn)生的點(diǎn)擊。而且,當(dāng)你鼠標(biāo)要放在標(biāo)簽上仔細(xì)查看的時(shí)候,這個(gè)標(biāo)簽又“調(diào)皮”地跑開(kāi)了�？傊�,不太好用,讓人費(fèi)解。
事實(shí)上,Google Analytics或者其他工具直接提供的點(diǎn)擊熱圖,我很少直接使用,除非運(yùn)營(yíng)同事特別心急,我更樂(lè)意自己根據(jù)一些方法自己做給他們,只是為了更準(zhǔn)確的說(shuō)明點(diǎn)擊情況。做法是?——看下一節(jié)。
自己做的點(diǎn)擊熱圖更可靠
為了做好一張準(zhǔn)確的點(diǎn)擊熱圖,我們需要請(qǐng)前端工程師同學(xué)幫我們做一些前期的事情,這些事情至關(guān)重要。
1. 幫助我們加上Google Analytics外鏈監(jiān)測(cè)和Virtual Page監(jiān)測(cè)。有同學(xué)說(shuō),我已經(jīng)利用event tracking,而不是virtual page監(jiān)測(cè)這些JavaScript或者Flash互動(dòng),那么event tracking監(jiān)測(cè)到的互動(dòng)能顯示在點(diǎn)擊熱圖上嗎?答案很遺憾,是不行的。這就是為什么有時(shí)候我還是不得已要回頭利用virtual page的原因。關(guān)于外鏈監(jiān)測(cè),可以參考官方的一篇文章:support.google.com/googleanalytics/bin/answer.py?hl=en&topic=11014&answer=55527
2. 幫助我們?yōu)榫哂邢嗤琔RL的不同鏈接做好記號(hào)。有兩種方法。第一種方法,就是在相同URL的后面,加上不同的參數(shù)。例如,有兩個(gè)鏈接都鏈接到:-and-jquery/。
好了,第二集就寫到這里。如果你覺(jué)得有什么不明白的,有什么意猶未盡的,覺(jué)得我有什么寫的不準(zhǔn)確的,請(qǐng)?jiān)谙旅媪粞愿嬖V我!非常感謝!
本文版權(quán)歸“網(wǎng)站分析在中國(guó)CWA”及其作者宋星
文章編輯: 365webcall免費(fèi)在線客服(www.365webcall.com)
我的評(píng)論
| 登錄賬號(hào)： | 密碼： | 快速注冊(cè) | 找回密碼 |  |
