<ul id="g60s4"><pre id="g60s4"></pre></ul>
<strong id="g60s4"><nav id="g60s4"></nav></strong>
<ul id="g60s4"></ul>
  • <tr id="g60s4"></tr>
  • 
    
  • 或者

    做好網(wǎng)頁(yè)排版,不要犯這10種錯(cuò)誤

    作者:麋鹿 瀏覽:136 發(fā)布時(shí)間:2017-08-01
    分享 評(píng)論 0

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

    QQ截圖20170731092914

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

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

     

    uisdc-web-20170729-1

      一般來(lái)說(shuō),整個(gè)網(wǎng)站字體的數(shù)量限制在最多兩種,一種一般就足夠了。如果您使用多個(gè)字體,請(qǐng)確保字體系基于字符寬度互補(bǔ)。如圖:左邊組的字體相對(duì)就比較和諧,而右邊字體的粗細(xì)對(duì)比太明顯,則顯得輕重比例很不和諧了。

      

    uisdc-web-20170729-2

      2. 嘗試使用標(biāo)準(zhǔn)字體

      字體嵌入服務(wù)(如Google Web字體或Typekit)有許多有趣而標(biāo)準(zhǔn)的系統(tǒng)字體,而因?yàn)橛脩舾邮煜?biāo)準(zhǔn)字體,所以可以更快地讀取它們。

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

      3. 限制線長(zhǎng)度

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

     

    uisdc-web-20170729-3

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

    uisdc-web-20170729-4

      4. 選擇各種尺寸的字體

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

      

    uisdc-web-20170729-5

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

    uisdc-web-20170729-6

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

      許多字體使得很容易混淆類似的字母,特別是與“i”和“L”(如下圖所示),所以當(dāng)選擇你的字體類型時(shí),請(qǐng)確保在不同的上下文中檢查你的類型,以確保不會(huì)為你的用戶造成問(wèn)題。

     

    uisdc-web-20170729-7

      6. 避免英文全部大寫

      請(qǐng)勿強(qiáng)制用戶閱讀所有大寫字母,與小寫類型相比,那只會(huì)大大延緩了用戶掃描和閱讀的速度,讓他們分分鐘爆炸。

    uisdc-web-20170729-8

      7. 不要最小化線間距

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

     

    uisdc-web-20170729-9

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

    uisdc-web-20170729-10

      8. 確保您有足夠的顏色對(duì)比度

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

    uisdc-web-20170729-11

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

      

    uisdc-web-20170729-12

      △ 這些文本行符合顏色對(duì)比度建議,并且易于閱讀背景顏色

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

    uisdc-web-20170729-13

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

      10. 避免使用閃爍的文字

    uisdc-web-20170729-14

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

      結(jié)論

      使排版具有可讀性,可理解性、清晰明了至關(guān)重要。至關(guān)重要。好的排版可以讓您的網(wǎng)站感覺(jué)清爽而令人眼前一亮。另一方面,糟糕的排版選擇令人分心。排版是為了內(nèi)容更好的呈現(xiàn),應(yīng)以不會(huì)增加用戶認(rèn)知負(fù)荷的方式來(lái)尊重內(nèi)容。


    无码人妻精品一区二区蜜桃网站 | 亚洲日本精品一区二区| 精品久久精品久久| 日本精品VIDEOSSE×少妇| 国产精品视频视频久久| 香蕉久久夜色精品国产小说| 亚洲精品乱码久久久久久按摩 | 国产精品女同一区二区久久| 另类国产精品一区二区| 久久国产精品一国产精品| 日韩一区二区a片免费观看| 精品久久久久久亚洲精品| 国产午夜精品一区二区三区小说 | 日韩网红少妇无码视频香港| 国产精品久久久久无码av| 国产成人精品国内自产拍 | 99久久综合精品免费| 亚洲国产人成精品| 精品剧情v国产在线麻豆| 亚洲精品无码av片| 久久精品视频一区| 国产亚洲精品国产| 日韩亚洲人成在线综合| 国产在线拍揄自揄视精品| 日韩精品国产另类专区| 精品亚洲一区二区三区在线观看| 国产99久久亚洲综合精品| 免费99精品国产自在现线| 久久一区二区精品综合| 久久国产乱子伦精品免费午夜| 视频一区视频二区日韩专区| 亚洲av永久无码精品网址| 国产成人精品18| 精品无人区一区二区三区| 日韩精品人妻一区二区中文八零 | 久久精品中文字幕有码| 久久精品一区二区三区中文字幕| 国产综合免费精品久久久| 最新在线精品国自av| 日韩综合在线视频| 日韩一级免费视频|