昨天推薦了一款熱點(diǎn)圖神器,今天繼續(xù)拿一個(gè)日本招聘網(wǎng)站開刀,從實(shí)戰(zhàn)角度給同學(xué)們演示如何全方位優(yōu)化整個(gè)網(wǎng)站,改善思路同樣非常值得借鑒,滿滿當(dāng)當(dāng)?shù)母韶涄s緊來收。
本案例所需數(shù)據(jù)都通過國外免費(fèi)試用工具Ptengine采集。
工具地址:www.ptengine.com
分析網(wǎng)站:www.hoiku-shigoto.com/
(數(shù)據(jù)采集時(shí)間段:2014年6月16日~6月22日)

該網(wǎng)站設(shè)置了主頁按鈕。即使處在主頁頁面,主頁按鈕上也有很多點(diǎn)擊。

有可能是用戶不理解當(dāng)前所處的是什么頁面。讓用戶清晰容易知道當(dāng)前所在什么頁面的體現(xiàn)(表達(dá))是有非常有必要的。當(dāng)前用戶可能還沒有把當(dāng)前頁面理解為主頁。主頁是含有信息很多,如同起到敞開大門一樣引導(dǎo)用戶瀏覽整個(gè)網(wǎng)站。
需要提供更多特殊信息、使之在視覺上體現(xiàn)得更像主頁,并從各個(gè)方面著手來突出主頁,這樣才會得到改善。
第一個(gè)條幅的banner被點(diǎn)擊。

點(diǎn)擊熱點(diǎn)集中在banner的左側(cè)。但是左側(cè)沒有鏈接,只有文字展示。相反,右側(cè)有注冊按鈕但卻幾乎沒有點(diǎn)擊熱點(diǎn)。由于注冊按鈕是轉(zhuǎn)化的入口,所以作為網(wǎng)站來說,是必須進(jìn)行改善的部分。預(yù)測的原因詳見下面所述。
對banner左側(cè)的文字感興趣的用戶在頁面左側(cè)進(jìn)行了點(diǎn)擊。這些用戶沒有立即進(jìn)行職位檢索,他們對這個(gè)網(wǎng)站能做什么、是什么概念等等還抱有疑問。也就是說「適合自己的工作」是指的什么還不清晰。按照文字的介紹內(nèi)容,把用戶引導(dǎo)到相關(guān)的內(nèi)容頁是上佳修改選擇。另外,關(guān)于注冊按鈕做的更像按鈕的感覺,在視覺上讓用戶一眼就看出來點(diǎn)擊此處會跳轉(zhuǎn)到注冊頁面。
提取一周的點(diǎn)擊數(shù)據(jù)也發(fā)現(xiàn)是幾乎沒有點(diǎn)擊,右側(cè)欄幾乎未被閱覽。

如果是沒有足夠引起用戶關(guān)注的話,將主要欄目或右側(cè)欄本身移動到左側(cè)欄去,讓更多的人看到。之后如果還是沒有什么變化的話,那就是對內(nèi)容不感興趣 或者 創(chuàng)意/標(biāo)題有問題。這時(shí)可以使用A/B測試進(jìn)行對比觀察。即便這樣還是沒有什么反應(yīng)的話,那就是內(nèi)容的質(zhì)量問題,需要更換內(nèi)容了。

頁面底部的“常見提問“處產(chǎn)生了很多熱點(diǎn)。通過分析滾動到底部的用戶大部分都點(diǎn)擊了該項(xiàng)。
雖然被點(diǎn)擊了很多次,但是通往“常見問題”頁面的入口卻只有1處。滾動到達(dá)率為17%,這說明除此之外的用戶都離開此頁面了,或者說沒有滾動瀏覽到這里跳轉(zhuǎn)到其他的頁面去了。
可以在第一條幅的導(dǎo)航欄中展示“常見問題”,但考慮到用戶的接受程度,也可以在頁面某處顯眼位置做個(gè)“常見提問”的內(nèi)容入口。
另外,”常見提問“被用戶集中點(diǎn)擊說明有些用戶確實(shí)是抱有疑問、有些不安的。假如疑惑沒有得到解決導(dǎo)致用戶離開的話,是非常不好的。需要讓那讓用戶閱覽那些常見提問,來幫助他們解決心中的疑惑,從而不要讓他們離開網(wǎng)站繼續(xù)訪問。
例:

針對這個(gè)網(wǎng)站是響應(yīng)式網(wǎng)頁設(shè)計(jì)。使用Pt engine的話,即使是響應(yīng)式網(wǎng)頁設(shè)計(jì),也可以針對不同終端設(shè)備進(jìn)行熱圖分析。查看在PC和手機(jī)上的熱圖是否有差異。

首先有差異的就是第一條幅中的banner上的點(diǎn)擊。有些頁面區(qū)域在PC上被點(diǎn)擊但在移動終端上未被點(diǎn)擊。由于SP受屏幕大小限制,不能較大的展示出來,所以用戶就不是很想去點(diǎn)擊。另外,再看看注意力視圖,PC上基本沒被怎么閱覽(不夠紅),而SP上閱覽視線就比較集中、變紅了。

下面是關(guān)于職位內(nèi)容瀏覽。無論是PC還是移動終端,熱門職位都會有很多點(diǎn)擊,但是通過展示形態(tài)上的不同,被點(diǎn)擊的職位,在PC和SP上有很大的差異。PC上只有幼兒園教師被多次點(diǎn)擊,但是移動終端有7個(gè)不同的職位被點(diǎn)擊。
PC和SP上用戶的操作不一樣的原因,「PC網(wǎng)站的瀏覽用戶」和「SP網(wǎng)站瀏覽用戶」閱覽網(wǎng)站的方式或內(nèi)容上是有差異的,通過上述比較能看出來。由于這個(gè)網(wǎng)站是響應(yīng)式網(wǎng)頁設(shè)計(jì),不能對PC網(wǎng)站和SP網(wǎng)站上的內(nèi)容進(jìn)行各自修改。不同終端用戶所需求的內(nèi)容不一樣的情況下,那不采用響應(yīng)式網(wǎng)頁設(shè)計(jì),而是針對各個(gè)終端去設(shè)計(jì)網(wǎng)站的效果會更好。
情非得已
21個(gè)Sketch實(shí)用高頻小技巧2019-02-15
25款值得收藏的優(yōu)秀網(wǎng)站模板免費(fèi)下載2015-09-16
20套高質(zhì)量的免費(fèi)網(wǎng)頁模版PSD素材2013-09-02
20款國外時(shí)尚大氣的按鈕開關(guān)PSD素材下載2013-07-31
CSS實(shí)例教程:十步學(xué)會用CSS建站2011-10-05
網(wǎng)頁設(shè)計(jì)師:淺淡網(wǎng)頁BANNER設(shè)計(jì)2010-09-27
網(wǎng)頁細(xì)節(jié)教程:WEB設(shè)計(jì)精確點(diǎn)滴2010-09-13
網(wǎng)頁設(shè)計(jì)中的點(diǎn)滴細(xì)節(jié)把握2010-09-01
總結(jié)交互組件創(chuàng)新的四種方式2010-06-28
最全的國外電子商務(wù)CSS模板下載2010-06-18
詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧
相關(guān)文章6092019-03-31
UI設(shè)計(jì)師如何設(shè)計(jì)最常見的關(guān)閉按鈕
相關(guān)文章4042019-02-24
21個(gè)Sketch實(shí)用高頻小技巧
相關(guān)文章6572019-02-15
設(shè)計(jì)師解讀如何讓扁平的網(wǎng)頁更出彩
相關(guān)文章10302018-12-07
UI設(shè)計(jì)師需要學(xué)習(xí)的保存功能設(shè)計(jì)總結(jié)
相關(guān)文章3422018-12-07
7招表單設(shè)計(jì)設(shè)計(jì)師方法提升表單體驗(yàn)
相關(guān)文章5672018-12-07
UI設(shè)計(jì)師必學(xué)柵格設(shè)計(jì)原理和技巧
相關(guān)文章4992018-11-29
UI設(shè)計(jì)師必須要知道的平面設(shè)計(jì)基礎(chǔ)
相關(guān)文章4762018-11-29
