當(dāng)前位置:首頁(yè) >  站長(zhǎng) >  網(wǎng)站運(yùn)營(yíng) >  正文

網(wǎng)站字體優(yōu)化對(duì)用戶(hù)體驗(yàn)度的影響!

 2022-04-08 15:21  來(lái)源: 網(wǎng)絡(luò)綜合   我來(lái)投稿 撤稿糾錯(cuò)

  域名預(yù)訂/競(jìng)價(jià),好“米”不錯(cuò)過(guò)

站長(zhǎng)們?cè)絹?lái)越愿意在用戶(hù)體驗(yàn)上下工夫,但提升用戶(hù)體驗(yàn)可不是簡(jiǎn)單的事情,需要大量的調(diào)研、分析和實(shí)驗(yàn)。最近我們發(fā)現(xiàn)了一篇好文章,希望和廣大站長(zhǎng)分享。該文章是一位互聯(lián)網(wǎng)交互設(shè)計(jì)師翻譯的文章,原文作者在自己博客上分別測(cè)試了不同字體字號(hào)對(duì)用戶(hù)點(diǎn)擊行為造成的影響,有些結(jié)果與作者的預(yù)測(cè)是相符的,有些卻出乎意料。

雖然國(guó)內(nèi)外的互聯(lián)網(wǎng)環(huán)境不同,原文中的結(jié)論并非全部適用于國(guó)內(nèi)網(wǎng)站,但文章中的思路及實(shí)驗(yàn)方法,站長(zhǎng)們是可以借鑒一下的。

多年前,麻省理工學(xué)院的研究人員已經(jīng)證證實(shí)字體影響我們的感受:差的字體使人無(wú)意識(shí)的反感,好的字體使我們感到高興。

如果字體能夠影響我們的情緒,那同樣會(huì)影響用戶(hù)體驗(yàn)。

幾周前,我決定探究字體對(duì)用戶(hù)體驗(yàn)的影響究竟有多大。

通過(guò)一系列的對(duì)比測(cè)試,僅僅在改變字體的情況下,我的網(wǎng)站流量提高了38%。

在開(kāi)始詳細(xì)講述我的測(cè)試前,先解釋下為什么字體對(duì)用戶(hù)閱讀有如此大的影響。

字體影響讀者的情緒

字體通過(guò)兩種方式影響我們的情緒。

認(rèn)知偏見(jiàn)

首先,我們會(huì)自然而然的賦予某些字體及字體形式一定的內(nèi)涵。好比我們對(duì)身邊事物的看法經(jīng)常受到認(rèn)知偏差和生長(zhǎng)文化的影響。例如,在美國(guó),無(wú)襯線字體經(jīng)常被用在政府書(shū)文上,而在英國(guó),無(wú)襯線字體常被用在小報(bào)上。

用戶(hù)感受到的信息經(jīng)常會(huì)因?yàn)槲恼伦煮w的變化而變化。

下面是我公司博客的兩張截圖,同一篇講述如何用Wordpress建站的文章,但是用了兩種相差較大的字體。

可以注意到,由于使用字體的不同,相同的內(nèi)容傳遞著不同的信息。

The site`s normal fonts:

Comic Sans font:

第二張Comic Sans 字體看上去遠(yuǎn)沒(méi)有第一張可信、專(zhuān)業(yè)。這不是字母的線條、間距或字母的其他特性造成的,而是Comic Sans字體聯(lián)想到孩子氣。

可讀性

事實(shí)上,一些字體本身比其他字體更具可讀性。如果閱讀一段文字時(shí),我們的眼睛和大腦負(fù)荷越重,那我們對(duì)字體的感覺(jué)就更糟糕。

襯線字體最早用在印刷上,因?yàn)橐r線有利于眼睛更快速的區(qū)分字母。

電腦剛問(wèn)世時(shí),分辨率還很低,襯線字體又必須用矢量創(chuàng)建,而矢量在早期的低分辨率屏幕上無(wú)法很好的顯示。這使得早期的設(shè)計(jì)師默認(rèn)使用位圖創(chuàng)建的無(wú)襯線字體。

在過(guò)去的幾十年間,屏幕分辨率不斷的發(fā)展?,F(xiàn)在近距離也很難看見(jiàn)屏幕上的像素點(diǎn),像Georgia這樣的襯線字體也越來(lái)越流行。

字體測(cè)試

測(cè)試開(kāi)始前,我最想知道:哪種字體最適合我的網(wǎng)站?

我在我的一篇文章上進(jìn)行了3種字體的對(duì)比測(cè)試:Georgia、Arial、 Verdana。

我們通過(guò)文章的點(diǎn)擊次數(shù)結(jié)合頁(yè)面的跳失率和頁(yè)面停留時(shí)間等行為來(lái)評(píng)估每種字體的表現(xiàn)。

以下是測(cè)試字體的文章片段,你可以預(yù)測(cè)下這3中字體的測(cè)試結(jié)果。

Georgia

Arial

Verdana

我預(yù)測(cè)Georgia字體最適合我的網(wǎng)站,因?yàn)樗勺x性很強(qiáng)。Verdana最不適應(yīng)我的網(wǎng)站。

和我預(yù)測(cè)的一樣,Georgia確實(shí)最適合我的網(wǎng)站,但是Verdana字體不是最差的那個(gè)。使用Verdana字體時(shí)文章的點(diǎn)擊量比使用Arial字體時(shí)多29.1%。

同時(shí),使用Geogia字體時(shí),平均頁(yè)面停留時(shí)間更長(zhǎng), 這表明用戶(hù)閱讀文章的內(nèi)容更多。這點(diǎn)已經(jīng)通過(guò)熱點(diǎn)圖得到證實(shí)。

字號(hào)測(cè)試

在證實(shí)了Geogia最適合我們的網(wǎng)頁(yè)后,我們同樣想知道,幾號(hào)的字體最適合用戶(hù)閱讀。

我覺(jué)得字號(hào)越大,也具有可讀性。(好吧,我又預(yù)測(cè)錯(cuò)了)

首先我測(cè)試了14px、15px、 16px這組字號(hào)。

在網(wǎng)站上使用上述相同的方法測(cè)試,結(jié)果顯示,14px的字體最適合閱讀。

PS:字號(hào)每加大一個(gè) 像素,行距也相應(yīng)加高了一個(gè)像素。

這個(gè)結(jié)果讓我很吃驚,我之前閱讀過(guò)的相關(guān)研究告訴我,用戶(hù)閱讀文章時(shí),更大的字體能夠吸引用戶(hù)的注意力。并且很多可讀性很高的網(wǎng)站都使用了20px以上的字號(hào)。

為了二次確認(rèn)我的測(cè)試結(jié)果,我測(cè)試了另一組字號(hào):10px、14px、18px、21px。

結(jié)果再次證明,14px的字體最適合閱讀。

這次試驗(yàn)讓我知道,不論分組測(cè)試哪種試驗(yàn),結(jié)果都會(huì)告訴你:對(duì)某些人奏效的事情未必對(duì)其他人奏效。對(duì)我們的博客使用的字體,或是發(fā)表的文章來(lái)說(shuō),14px的字體可能是個(gè)很好的選擇。

字體優(yōu)化的魅力

根據(jù)測(cè)試優(yōu)化字體后,我們網(wǎng)站的用戶(hù)體驗(yàn)有多大的提升?

自從我們整個(gè)網(wǎng)站使用14px的Georgia字體后,我們網(wǎng)站的平均跳失率(Bounce Rate)從88.0%下降到80.9%,7.1%的優(yōu)化。

每個(gè)頁(yè)面的平均訪問(wèn)量從1.21上升到1.43,18.18%的優(yōu)化;頁(yè)面的平均停留時(shí)間提高了10分鐘。

所有的這些都由分組測(cè)試(也叫A/B測(cè)試)得出的,并不是我個(gè)人觀點(diǎn)。使用類(lèi)似VWO或Optimizely這類(lèi)分組測(cè)試工具,能夠檢測(cè)出哪種字體最適合你的讀者,哪種方案更合適。

申請(qǐng)創(chuàng)業(yè)報(bào)道,分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處,共同探討創(chuàng)業(yè)新機(jī)遇!

相關(guān)文章

熱門(mén)排行

信息推薦