網(wǎng)站設(shè)計

做好網(wǎng)頁排版，不要犯這10種錯誤

發(fā)布時間：2017-07-31 09:35:57

做好網(wǎng)頁排版.jpg

網(wǎng)絡(luò)上95％以上的信息是書面形式的。優(yōu)化排版則是優(yōu)化可讀性，可訪問性，可用性，整體圖形平衡。換句話說：優(yōu)化排版也是優(yōu)化用戶界面。本文將提供一組規(guī)則，幫助您提高文本內(nèi)容的可讀性和易讀性。

1. 少使用字體數(shù)量

使用超過3種不同的字體使網(wǎng)站看起來非結(jié)構(gòu)化和不專業(yè)，太多的類型尺寸和樣式一次也可能破壞任何布局。

一般來說，整個網(wǎng)站字體的數(shù)量限制在多兩種，一種一般就足夠了。如果您使用多個字體，請確保字體系基于字符寬度互補。如圖：左邊組的字體相對就比較和諧，而右邊字體的粗細對比太明顯，則顯得輕重比例很不和諧了。

2. 嘗試使用標準字體

字體嵌入服務(wù)（如Google Web字體或Typekit）有許多有趣而標準的系統(tǒng)字體，而因為用戶更加熟悉標準字體，所以可以更快地讀取它們。

除非您的網(wǎng)站對于自定義字體（如品牌宣傳或創(chuàng)建身臨其境的體驗）非常有吸引力，否則通常好使用系統(tǒng)字體。

3. 限制線長度

如果你想要一個良好的閱讀體驗，你應(yīng)該每行約60個字符。在每行上擁有適當?shù)淖址麛?shù)量是您的文本可讀性的關(guān)鍵。如果每行文字太短，視線必須反復(fù)折回來，打破讀者的節(jié)奏。如果一行文字太長，用戶的眼睛將很難專注于文本。

對于移動設(shè)備，您應(yīng)該每行30-40個字符。以下是在移動設(shè)備上查看的兩個網(wǎng)站的示例。第一個使用每行50-75個字符（打印和桌面的每行字符數(shù)），而第二個使用30-40個字符。

4. 選擇各種尺寸的字體

確保您選擇的字體在較小的屏幕上清晰可辨！

維瓦爾第字體將難以在小屏幕上閱讀：

5. 使用可區(qū)分字母的字體

許多字體使得很容易混淆類似的字母，特別是與“i”和“L”（如下圖所示），所以當選擇你的字體類型時，請確保在不同的上下文中檢查你的類型，以確保不會為你的用戶造成問題。

6. 避免英文全部大寫

請勿強制用戶閱讀所有大寫字母，與小寫類型相比，那只會大大延緩了用戶掃描和閱讀的速度，讓他們分分鐘爆炸。

7. 不要小化線間距

行間距一般是字符高度的30%，以便良好的可讀性。

而段落之間的間距可以比行間距提高20%，留白可以為用戶提供消化內(nèi)容的時間。下圖左：幾乎重疊的文字。右：良好的間距有助于可讀性。

8. 確保您有足夠的顏色對比度

不要對文本和背景使用相同或相似的顏色。文本越明顯，用戶能夠掃描和閱讀的速度越快。

△ 這些文本行不符合顏色對比度建議，難以根據(jù)背景顏色進行閱讀

△ 這些文本行符合顏色對比度建議，并且易于閱讀背景顏色

9. 避免將文字著色為紅色或綠色

建議使用除顏色以外的其他線索來區(qū)分重要信息。也避免單獨使用紅色和綠色來傳達信息，避免有色盲用戶無法順利閱讀的情況。

10. 避免使用閃爍的文字

閃爍或閃爍的內(nèi)容可能會使一些敏感人群發(fā)瘋，并且對于一般使用者來說，這可能是令人討厭或分心的。

原創(chuàng)不易，未經(jīng)授權(quán)，嚴禁轉(zhuǎn)載

原文地址：http://mpian.cn/i,72,7249,0.html

更多+

感謝云智互聯(lián)，系統(tǒng)提前完成，在整個項目周期內(nèi)，云智互聯(lián)對待我們并不像是對待客戶，更像是朋友一樣，每一次，都能以專業(yè)的角度向我們提出更合理、更有效的解決方案，并快速、細致地完成我們的每一個需求，再次感謝以至誠之心做事的云智互聯(lián)團隊。

潘濤
我是東方龍馬集團，在云智家做了2個企業(yè)官網(wǎng)，服務(wù)態(tài)度超級好。如果想做網(wǎng)站，選擇他家一定不后悔。性價比高，服務(wù)態(tài)度好。值得你的信賴！

譚嬌
技術(shù)好，設(shè)計精良，操作便利，很專業(yè)！配套的服務(wù)和后續(xù)的服務(wù)都很好,網(wǎng)站封面堪稱精品，運行方便，后臺操作的簡單。技術(shù)還會耐心教我,很好的云智互聯(lián)（北京）科技有限公司，建站很不錯的。

陳曦
不錯，價格比較合適，重點是響應(yīng)速度蠻快，有什么問題都會馬上給你解決，公司很滿意，因為他們都是針對每個項目建了相應(yīng)的討論組，有問題可以再里面提出，人員分工到位，解決問題很及時。

張經(jīng)理