<th id="ik4gr"><pre id="ik4gr"></pre></th>
<rp id="ik4gr"></rp>
    <dd id="ik4gr"></dd>

  1. <rp id="ik4gr"><object id="ik4gr"><blockquote id="ik4gr"></blockquote></object></rp>
      <rp id="ik4gr"></rp>
        <button id="ik4gr"><acronym id="ik4gr"></acronym></button>
      1. <rp id="ik4gr"><object id="ik4gr"><input id="ik4gr"></input></object></rp>
        1. 杭州嵌入式培訓
          達內杭州嵌入式培訓中心

          13175137725

          網頁設計中字體間距的排版分析

          • 時間:2019-06-11 15:12
          • 發布:轉載
          • 來源:網絡

          網頁設計中除了圖片字體排版是非常重要的一個模塊,本文為大家分享的是關于文字設計中的一些字體間距或者是字體形狀等常見設計方法。有興趣一起看看吧。

          1.字間距(三種形式)

          上一篇沒有講到字間距,這篇講行長時正好給補上。常用的字間距有三種排版形式,分別是標準排版、緊湊排版和留白排版。標準排版就是軟件默認的字間距,字與字之間的距離不會太大也不會太小;緊湊排版是每個字之間的距離會向里縮進一些;留白排版是每個字之間會多留一些空白。三種排版形式如下圖所示。

          當我們大致了解了字間距的三種形式,接一下就一個個的去理解它們。

          2.字間距-標準排版

          標準排版就是字與字之間的距離不大也不小。在繪圖工具中的字符工具里的“字間距”功能的數值為0 ‰,這時采用的是標準排版。什么情況下使用這種排版規則呢? 通常在設計師比較懶惰的情況下會使用這種排版規則。因為在處理標題、正文和注釋時,需要根據不同的字號選擇不同的字間距來進行排版,字號不同字間距相同就會影響視覺感受,所有字號都用繪圖工具的默認字間距,只能說明設計師比較懶惰且工作不飽和(手動滑稽)。

          3.字間距-緊湊排版

          緊湊排版就是字與字之間的距離會縮短并向里縮進。在繪圖工具中的字符工具里的“字間距”功能的數值為負數,區間為-10 ‰~-40 ‰不等,具體數值還要根據不同的字號和字體來做決定,通常應用在標題當中。

          4.字間距-留白排版

          那留白排版就是字與字之間的距離會多留一些空白。在繪圖工具中的“字間距”數值為正數,區間為10 ‰~-40 ‰不等。與緊湊排版一樣,也是根據不同字號和字體來決定的。有些中文字體結構中的字與“外邊框”的距離就很大了,這時再給字間距加留白,一行就會顯得過于分散,所以還是要具體需求具體分析。留白排版通常應用在正文當中。那這里的“外邊框”指的是字體設計時用到的框,屬于中文字體結構中的一部分,專業術語叫“圍框”,日本人稱為“假象邊框”,不要深究先簡單了解一下就行。

          5.字間距-使用場景(字號)

          當理解了字間距的三種排版形式,就學一下在什么場景下使用它們。不同字號字間距也不同,字號越大字與字的間距就越小,字號越小字與字的間距就越大。字間距過大或過小都會影響閱讀體驗,文字的易讀性就會被影響。在設計以古典為主題的作品時,要營造拘謹和嚴肅感,就可以在常規的字間距的基礎上再減少一些間距;在設計以現代或科技為主題的作品時,要營造開放的態度和流行的感覺,就可以在常規的字間距的基礎上再增加一些間距。如下圖所示,帶顏色的是字間距的數值。

          另外,英文的字間距差異要比中文更大,但篇幅有點長了,字號這塊我就不拿英文來舉例了。好的講回來,如果反其道而行之就會造成不好的閱讀體驗,字間距過大就會影響閱讀體驗,非常大就會影響文字的易讀性。字間距非常小,字與字就會重疊,字的可讀性就很差。

          6.字間距-使用場景(字體)

          不同的字體結構也都不同,中文的無襯線體要比襯線體更粗獷占得位置也會更多一些,就導致字與字的距離會小一些,這種情況下就不能過多的減少字間距了,越縮減就越緊湊就會影響閱讀。相反襯線體的周圍間距要顯得大一些,這時可以適當縮減一些行間距,給讀者一種舒適的閱讀體驗。

          接下來看一下中英字體測試,中文襯線體/無襯線體,英文襯線體/無襯線體,字體、字形和字號的不同字間距也不盡相同。由于中文字體與英文字體結構不同,在處理英文的無襯線體時,粗獷的線條會增加的行的寬度,這時候可以多縮減一些間距,讓它與其他文本之間保持視覺的平衡。

          下面就附加一張字體間距的錯誤示例吧。字間距之間的差別非常微小,有些朋友可能會看不出差異。中文差異很小,英文那里比較明顯,英文的標題占的寬度太大了,就要進行縮進。

          7.了解行長

          接下來講下行長。因為受不同語言、字體、字形和字號的影響,行長也會不盡相同,所以就沒有辦法一次涵蓋的講完,只能針對幾種常用字體和字號來進行講解。由于篇幅的原因就不能講的非常細了,主要還是以微軟雅黑來做示例,微軟雅黑也都是頁面中比較常用的字體。

          以上就是本文為大家帶來的內容,希望對網頁設計的小伙伴們有所幫助。

          預約申請免費試聽課

          怕錢不夠?就業掙錢后再付學費!    怕學不會?從入學起,達內定制課程!     擔心就業?達內多家實踐企業供你挑選!

          上一篇:程序員需要了解的數據庫開發問題分析
          下一篇:嵌入式新人收:入行物聯網的避坑指南

          高薪運維工程師都具備哪些特性?

          大學畢業生參加嵌入式培訓班好就業嗎?

          新人如何選擇嵌入式培訓機構?

          學習沒進步、工作沒方法,你也這樣嗎?

          • 掃碼領取資料

            回復關鍵字:視頻資料

            免費領取 達內課程視頻學習資料

          • 視頻學習QQ群

            添加QQ群:1143617948

            免費領取達內課程視頻學習資料

          Copyright ? 2018 Tedu.cn All Rights Reserved 京ICP備08000853號-56 京公網安備 11010802029508號 達內時代科技集團有限公司 版權所有

          選擇城市和中心
          江西省

          貴州省

          廣西省

          海南省

          香蕉视频在线一级a做爰片免费观看视频 欧美成年性色生活片 百度 好搜 搜狗
          <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <文本链> <文本链> <文本链> <文本链> <文本链> <文本链>