圖趣再談網(wǎng)頁設(shè)計(jì)中的文字長度控制
之前圖趣也跟大家分享過網(wǎng)頁設(shè)計(jì)請使用16像素字體不然就會(huì)付出昂貴代價(jià)。 其實(shí)提升網(wǎng)頁設(shè)計(jì)中文字可讀性的關(guān)鍵之一,就是讓每行文字承載合適的字?jǐn)?shù)。這不僅僅是設(shè)計(jì)一下文字寬度的問題,它也應(yīng)該是一個(gè)易讀性的問題。
文字最佳長度是每行承載50-60字符,包括空格。也有其他資料建議不超過75字/行也可以接受。但你一定會(huì)問,不按這樣的標(biāo)準(zhǔn)做又會(huì)怎樣?
太長-如果一行里文字太多,用戶眼球很難長時(shí)間聚焦文本。因?yàn)槲谋鹃L度過長會(huì)讓人很難注意到段落的起點(diǎn)和終點(diǎn)。此外,對于這么大塊文本來說,也很難對當(dāng)前行進(jìn)行繼續(xù)閱讀。
太短-如果一行里文字太少,眼睛要不停的來回掃視,破壞了閱讀節(jié)奏。同時(shí),每行文本太短也樣會(huì)讓人覺得緊張,這行沒看完就跳到下一行去了(很可能一些重要的詞會(huì)被跳過)。
原本跳到下一行文字時(shí),潛意識(shí)里是會(huì)那么有點(diǎn)小亢奮(只要?jiǎng)e太頻繁,原因見上面兩點(diǎn))。因此在每一行的開頭,讀者的精力都很集中,但這種專注會(huì)逐漸消褪,可能還沒等把這行看完。
為了避免文本過長或過短所帶來的弊端,同時(shí)又能持續(xù)的激勵(lì)讀者,我們建議把每行承載的文本量控制在5-75個(gè)字符(中文建議35-45個(gè)漢字,14px)。
那么網(wǎng)頁設(shè)計(jì)中如何控制最佳長度
在網(wǎng)頁設(shè)計(jì)中,可以使用em或px(像素)來實(shí)現(xiàn)每行字符的最佳數(shù)目(使用em可以獲得很好的效果,但操作起來比px略顯復(fù)雜)。其實(shí)無論選擇哪一種,要獲得最佳效果,都需要為你的讀者設(shè)置一個(gè)固定寬度。
這也是我們?yōu)槭裁床煌扑]使用“流式”布局的原因之一:實(shí)際上你在強(qiáng)制用戶通過改變?yōu)g覽器窗口,來獲得更好的閱讀體驗(yàn)。當(dāng)想到時(shí)下顯示器屏幕有這么多不同的分辨率,很明顯,“流式”布局會(huì)讓文本行變得要么寬,要么窄。
正如大家看到在站上,我們使用了17px的Arial來呈現(xiàn)文字。文章容器寬度為504px,每一行大概65個(gè)字符。在你的頁面中,每行顯示多少個(gè)字符?50-75個(gè)?如果你想讓你的讀者擁有更好的閱讀體驗(yàn),就該這么做。
本文地址:http://m.pkvc.cn/tutorial/di956.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁設(shè)計(jì)中的常見頁面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫:40款為網(wǎng)頁設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺設(shè)計(jì)分享—專題頁面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁設(shè)計(jì)精粹 網(wǎng)頁中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢
- 10個(gè)智能對象處理的ps技巧
- 網(wǎng)頁UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏