改善網(wǎng)頁文字閱讀體驗(yàn)的一些技巧
如今,大多數(shù)網(wǎng)站為了能夠展示出更多的信息,都使用了小號的文字,使人閱讀起來很傷眼睛,那么,產(chǎn)生這個(gè)問題的原因是什么呢?可能有人會說是:這只是一個(gè)歷史遺留問題,因?yàn)檫^去的電腦屏幕真的是太小了,可我們稍作思考就會發(fā)現(xiàn),只要我們對文字稍作排版和設(shè)計(jì),就能達(dá)到非常好的閱讀體驗(yàn)。
1、長文本使用標(biāo)準(zhǔn)字號
把一個(gè)網(wǎng)站塞滿各種信息并不難,但是讓她簡單而易用卻不那么簡單。剛開始的時(shí)候,要用大字號來設(shè)計(jì)出一個(gè)好的布局會相對困難一些,但是這樣會幫助你設(shè)計(jì)出一個(gè)更簡單、更清爽的頁面。
起初,你會不適應(yīng)這些大字號,但是一天之后,你就不會再想在正文中看到任何小于100%顯示的文字內(nèi)容了。剛開始你會覺得這些文字看起來很大,但是一旦你體驗(yàn)過之后,你就會很快意識到,為什么所有瀏覽器的設(shè)計(jì)師都選擇這個(gè)大小來作為文字的默認(rèn)顯示大小。
你現(xiàn)在正在閱讀的文字的字號并不大,是你瀏覽器的默認(rèn)顯示大小,是瀏覽器本來應(yīng)該顯示的大小。
對此,小編建議:我不想點(diǎn)擊“放大”、“縮小”按鈕,也不想更改瀏覽器的設(shè)置,我想馬上就開始閱讀,我希望你能適應(yīng)我的設(shè)置,而不是反過來讓我更改設(shè)置來適應(yīng)你。
2、主動(dòng)留白
讓你的文字有足夠的空間進(jìn)行呼吸,使用留白不是設(shè)計(jì)師的既定問題,也與品位無關(guān)。
小編認(rèn)為:文字段落的寬度必須與其所使用的字號相適應(yīng),過大的行寬會使人不易閱讀,并且會產(chǎn)生負(fù)面的心理效應(yīng),過小的行寬會也中斷閱讀的流暢性,迫使讀者頻繁地?fù)Q行。
在文本周圍留出足夠的空間可以減少閱讀時(shí)的壓迫感,因?yàn)檫@樣讀者更容易將焦點(diǎn)集中在內(nèi)容本身。
另外,你無需填滿整個(gè)窗口,留白看上去更好并不是什么副作用,而是功能設(shè)計(jì)的必然結(jié)果。
行寬并不是設(shè)計(jì)或格式中唯一重要的,易讀性的問題具有同樣的重要性。
所以,請確保行寬不要過長,你可以在左右兩端留出一些空白,便于眼睛在閱讀時(shí)進(jìn)行換行。
我既不想要調(diào)整字號大小也不想調(diào)整窗口大小,當(dāng)我打開一個(gè)頁面的時(shí)候,我就只是想進(jìn)行閱讀,自適應(yīng)寬度的文字很好,但是橫跨整個(gè)屏幕一眼望不到邊的文字卻很糟糕。
一般情況每行10-15個(gè)單詞(此處準(zhǔn)則針對英文),對于流動(dòng)布局來說,當(dāng)100%字號大小時(shí),行寬為窗口大小的50%,在大多數(shù)分辨率下這是一個(gè)比較好的標(biāo)準(zhǔn)。
3、適度的行高
過小的行高設(shè)定會降低閱讀速度,因?yàn)檠劬瑫r(shí)注意上下兩行,而無法集中精神閱讀當(dāng)前那行的內(nèi)容,讀者把精力花在錯(cuò)誤的地方,并且更容易感到疲倦,對于行高過大的情況也是如此。
一般網(wǎng)站的HTML的默認(rèn)行高過小,如果你增加一些行高,文字會更具易讀性,對此,小編的建議是:140%標(biāo)準(zhǔn)行高是一個(gè)不錯(cuò)的標(biāo)準(zhǔn)。
4、鮮明的色彩對比
這一點(diǎn)我覺得沒必要多做贅述了,但是如果你覺得自己可以避免下列情況的話,那么你就不是一個(gè)網(wǎng)頁設(shè)計(jì)師,而只是一個(gè)有態(tài)度的設(shè)計(jì)師。
①、淺灰色的文字放在更淺的灰色的背景上。
②、銀色的文字放在白色的背景上。
③、灰色的文字放在黃色的背景上。
④、黃色的文字放在紅色的背景上。
⑤、綠色的文字放在紅色的背景上。
如果你認(rèn)為你還是一個(gè)網(wǎng)頁設(shè)計(jì)師,那么你必須意識到,沒有人會理解甚至看清楚你所表達(dá)的內(nèi)容,別在做這種沒有意義的事了。
注意:對于要在屏幕上顯示的設(shè)計(jì)來說,過于強(qiáng)烈的對比(純黑純白)也不合適,因?yàn)檫@樣看上去會使人感到文字在閃爍。
5、別把文字做成圖片
在進(jìn)行閱讀的時(shí)候,大部分訪客都希望能夠搜索、復(fù)制和保存文字,并使用光標(biāo)來進(jìn)行標(biāo)記。
雖然把文字做成圖片看起來很美觀,但是美觀并不是網(wǎng)頁所要的全部,網(wǎng)頁是用來進(jìn)行交流和信息傳達(dá)的,而信息需要具有良好的可讀性、可用性、可伸縮性,方便進(jìn)行引用和分享。
如果你只有把文字做成圖片才能把網(wǎng)頁設(shè)計(jì)好的話,那我覺得你需要從頭開始再學(xué)一遍網(wǎng)頁設(shè)計(jì)了。
6、改善文字閱讀體驗(yàn)的注意事項(xiàng)
想必大家也都遇到過這些糟糕的網(wǎng)站(或是應(yīng)用), 字體不清晰、字號過小、頁面混亂、廣告充斥。在這種時(shí)候,即使其擁有優(yōu)秀的內(nèi)容,我們往往也無法安心的進(jìn)行閱讀,結(jié)果是讀者要不迅速的看完離開,要不干脆放棄,這對內(nèi)容創(chuàng)造者和讀者來說,無疑都是巨大的損失,那么,我們該如何去改善文字的閱讀體驗(yàn)?zāi)兀?/span>
(1)、不要讓我去調(diào)節(jié)字體大小
我可不想每次訪問一個(gè)網(wǎng)站的時(shí)候都要去更改我的瀏覽器設(shè)置!
(2)、不要告訴我繁雜的頁面看上去更好
擁擠的頁面看上去一點(diǎn)也不好,反而會令人很不爽,向頁面中填塞各種內(nèi)容對于可用性來說沒有任何幫助,這種把各種信息都丟給我的做法,我只能理解成你太懶了。對策:可以先思考和預(yù)先篩選一下重要的信息進(jìn)行呈現(xiàn),而不是讓訪客去尋找。
(3)、不要告訴我滾動(dòng)很糟糕
雖然說滾動(dòng)并沒有錯(cuò),滾動(dòng)就像是看書的時(shí)候翻書一樣自然,可如果網(wǎng)站頁面太長,每次都需要使用鼠標(biāo)滾動(dòng)太長的話,訪客也會很不耐煩的離開的。
(4)、不要告訴我文字不重要
網(wǎng)頁設(shè)計(jì)中,95%的內(nèi)容通常都是在關(guān)注排版,文字在網(wǎng)頁中站著主導(dǎo)的位置。
(5)、不要讓我戴上眼鏡才能看清文字
在這個(gè)信息大爆炸的時(shí)代,已經(jīng)很少有人有耐心看完一整篇的文章了,如果你文字太小,可能訪客連看都不看,就直接離開了,就更別說留住訪客了。
對于不愿意閱讀文字的訪客,一個(gè)簡單的說明、評論再加上精美說明圖片就可以很好的滿足他們的需求了,這一點(diǎn)我們最常見到的就是個(gè)電商平臺,比如淘寶,我們可以發(fā)現(xiàn)很多店家基本上都是沒有做過多文字的陳述,取而代之的是精美的說明圖片。
通常,不喜歡閱讀文字的的人會去找圖片和鏈接,這一類型的訪客更注重包裝,你的圖片傳達(dá)的信息會比文字來得更加的豐富,過度的鋪陳文字反而成了內(nèi)容上的累贅,讓訪客反感。
但是,作為普通網(wǎng)站,我們還是不能不忽略搜索引擎的感受,對于內(nèi)容文字的簡要概述還是必須的,只要文字不影響訪客的搜索和體驗(yàn),文字仍然是必不可少的。