網(wǎng)站優(yōu)化技術(shù)文章

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

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

譯者：互聯(lián)網(wǎng)交互設計師Miss Often       多年前，麻省理工學(xué)院的研究人員已經(jīng)證實(shí)字體影響我們的感受：差的字體使人無(wú)意識的反感，好的字體使我們感到高興。如果字體能夠影響我們的情緒，那同樣會(huì )影響用戶(hù)體驗。 幾周前，我決定探究字體對用戶(hù)體驗的影響究竟有多大。通過(guò)一系列的對比測試，僅僅在改變字體的情況下，我的網(wǎng)站流量提高了38%。在開(kāi)始詳細講述我的測試前，先解釋下為什么字體對用戶(hù)閱讀有如此大的影響。 字體影響讀者的情緒 字體通過(guò)兩種方式影響我們的情緒。 認知偏見(jiàn) 首先，我們會(huì )自然而然的賦予某些字體及字體形式一定的內涵。好比我們對身邊事物的看法經(jīng)常受到認知偏差和生長(cháng)文化的影響。例如，在美國，無(wú)襯線(xiàn)字體經(jīng)常被用在政府書(shū)文上，而在英國，無(wú)襯線(xiàn)字體常被用在小報上。 用戶(hù)感受到的信息經(jīng)常會(huì )因為文章字體的變化而變化。 下面是我公司博客的兩張截圖，同一篇講述如何用Wordpress建站的文章，但是用了兩種相差較大的字體?？梢宰⒁獾?，由于使用字體的不同，相同的內容傳遞著(zhù)不同的信息。 字體：The site`s normal （國外網(wǎng)站默認字體）   字體：Comic Sans   第二張Comic Sans 字體看上去遠沒(méi)有張可信、專(zhuān)業(yè)。這不是字母的線(xiàn)條、間距或字母的其他特性造成的，而是Comic Sans字體聯(lián)想到孩子氣。 可讀性 事實(shí)上，一些字體本身比其他字體**可讀性。如果閱讀一段文字時(shí)，我們的眼睛和大腦負荷越重，那我們對字體的感覺(jué)就更糟糕。 襯線(xiàn)字體 早用在印刷上，因為襯線(xiàn)有利于眼睛更快速的區分字母。電腦剛問(wèn)世時(shí)，分辨率還很低，襯線(xiàn)字體又必須用矢量創(chuàng )建，而矢量在早期的低分辨率屏幕上無(wú)法很好的顯示。這使得早期的設計師默認使用位圖創(chuàng )建的無(wú)襯線(xiàn)字體。 在過(guò)去的幾十年間，屏幕分辨率不斷的發(fā)展?，F在近距離也很難看見(jiàn)屏幕上的像素點(diǎn)，像Georgia這樣的襯線(xiàn)字體也越來(lái)越流行。 字體測試 測試開(kāi)始前，我 想知道：哪種字體 適合我的網(wǎng)站？我在一篇文章上進(jìn)行了3種字體的對比測試：Georgia、Arial、 Verdana.我們通過(guò)文章的點(diǎn)擊次數結合頁(yè)面的跳失率和頁(yè)面停留時(shí)間等行為來(lái)評估每種字體的表現。 以下是測試字體的文章片段，你可以預測下這3中字體的測試結果。 字體：Georgia   字體：Arial   字體：Verdana   我預測Georgia字體 適合我的網(wǎng)站，因為他可讀性很強。Verdana 不適應我的網(wǎng)站。 和我預測的一樣，Georgia確實(shí) 適合我的網(wǎng)站，但是Verdana字體不是 差的那個(gè)。使用Verdana字體時(shí)文章的點(diǎn)擊量比使用Arial字體時(shí)多29.1%。   同時(shí)，使用Georgia字體時(shí)，平均頁(yè)面停留時(shí)間更長(cháng)，這表明用戶(hù)閱讀文章的內容更多。這點(diǎn)已經(jīng)通過(guò)熱點(diǎn)圖得到證實(shí)。 字號測試 在證實(shí)了Georgia 適合我們的網(wǎng)頁(yè)后，我們同樣想知道，幾號的字體 適合用戶(hù)閱讀。我覺(jué)得字號越大，也具有可讀性。（好吧，我又預測錯了） 首先我測試了14px、15px、 16px這組字號。在網(wǎng)站上使用上述相同的方法測試，結果顯示，14px的字體 適合閱讀。   PS：字號每加大一個(gè)像素，行距也相應加高了一個(gè)像素。 這個(gè)結果讓我很吃驚，我之前閱讀過(guò)的相關(guān)研究告訴我，用戶(hù)閱讀文章時(shí)，**的字體能夠吸引用戶(hù)的注意力。并且很多可讀性很高的網(wǎng)站都使用了20px以上的字號。 為了二次確認我的測試結果，我測試了另一組字號：10px、14px、18px、21px。結果再次證明，14px的字體 適合閱讀。 這次試驗讓我知道，不論分組測試哪種試驗，結果都會(huì )告訴你：對某些人奏效的事情未必對其他人奏效。對我們的博客使用的字體，或是發(fā)表的文章來(lái)說(shuō)，14px的字體可能是個(gè)很好的選擇。 字體優(yōu)化的魅力 根據測試優(yōu)化字體后，我們網(wǎng)站的用戶(hù)體驗有多大的提升？ 自從我們整個(gè)網(wǎng)站使用14px的Georgia字體后，我們網(wǎng)站的平均跳失率（Bounce Rate）從88.0%下降到80.9%，7.1%的優(yōu)化。每個(gè)頁(yè)面的平均訪(fǎng)問(wèn)量從1.21上升到1.43，18.18%的優(yōu)化；頁(yè)面的平均停留時(shí)間提高了10分鐘。   所有的這些都由分組測試（也叫A/B測試）得出的，并不是我個(gè)人觀(guān)點(diǎn)。使用類(lèi)似VWO或Optimizely這類(lèi)分組測試工具，能夠檢測出哪種字體 適合你的讀者，哪種方案更合適。 譯文地址：http://missoften.com/?p=479 原文地址：http://sixrevisions.com/user-experience-ux/fonts-ux/