閱讀體驗是ui設計中必不可少的一項， 良好(hǎo)的設計應該都(dōu)是可讀的設計，如果信息都(dōu)無法正常而清晰的傳達，那麼(me)設計就(jiù)失去了意義。 設計的可讀性和排版設計息息相關，這(zhè)也就(jiù)跟設計師的設計功底息息相關。下面(miàn)簡單介紹文字影響UI界面(miàn)閱讀性的幾種(zhǒng)情況。

一、文字大小 

        文字的大小無論在ui界面(miàn)或者網頁當中任何一個地方，都(dōu)起(qǐ)到一定的作用。而文字作爲設計的一個組成(chéng)部分，閱讀性就(jiù)必須得到保證。 那麼(me)，如何去選擇字體的大小能(néng)達到比較好(hǎo)的效果呢？ 在網頁中，我們常見的文字大小一般是14px、16px，最小的字體一般是12px的。标題類的字體大小一般都(dōu)在18px以上。 我一般給客戶做網站，正文一般會(huì)選擇14px的字體，标題類的會(huì)采用22px加粗的一個字體。有一些特殊的界面(miàn)設計上，标題可能(néng)要求更大，字體也要細一些的，這(zhè)些需要單獨做變化。網頁中字體的大小盡可能(néng)的選用偶數，如果是奇數的話，字體顯示出來的邊緣會(huì)有一些毛邊，不利于閱讀。 在ui界面(miàn)當中，在字體大小的選擇上需要多斟酌一下，正文的自号大小和标題的大小應該有所區分，可以在黃金比例的字号上稍微找尋一個适合閱讀的字号比例。在蘋果6的界面(miàn)下，我們常見到的标題大都(dōu)是34px的，部分的app的界面(miàn)系統在部分标題下會(huì)使用到36px。這(zhè)裡(lǐ)再補充一點，無論什麼(me)系統，在UI界面(miàn)中标題或正文的字體一定要選用偶數，因爲在開(kāi)發(fā)界面(miàn)的時(shí)候，字号大小換算是要除以二的。 

        對(duì)字号的選擇如果還(hái)拿捏不準的話，還(hái)選擇一些工具來進(jìn)行輔助選擇，比如 Modular Scale （鏈接打不開(kāi)看這(zhè)： http://www.modularscale.com ），可以借鑒下裡(lǐ)面(miàn)的字體比例。 

二、字體的選擇 

        都(dōu)知道(dào)字體有宋體、黑體、楷體、手寫體等多種(zhǒng)字體形式，不同的字體表達的情感訴求是不一樣的，這(zhè)些外形不一樣的字體也會(huì)造成(chéng)閱讀性的易難程度。字體樣式對(duì)易讀性和快速浏覽非常重要，所以我們可以先來了解下ui界面(miàn)下如何選擇字體。 

1）iOS系統中用的字體是蘋果官方字體系列。 

        蘋果官方系列字體以 SF和SF Compact 兩(liǎng)套字體爲主。SF和SF Compact 分别又命名爲Text和Display兩(liǎng)個子字體系列。Text 系列字體用于小文本顯示，而Display 系列字體用于較大的字體顯示。 

2）Android的默認字體是Roboto和Noto系列。 

        Roboto系列字體有6種(zhǒng)字樣：Thin、Light、Regular、Medium、Bold 和 Black。 

        Noto系列字體有7種(zhǒng)字樣：Thin, Light、DemiLight、Regular、Medium、Bold 和 Black。 

        知道(dào)了這(zhè)兩(liǎng)個系統的字體，我們在設計界面(miàn)的時(shí)候就(jiù)可以有針對(duì)性的對(duì)文字做更深入的研究和設計，盡可能(néng)的提高界面(miàn)的閱讀性。 

三、文字的字間距 

        調整文字字間距的情況比較少見，但是特殊情況下是會(huì)做相對(duì)應調整的。都(dōu)知道(dào)，字和字之間是有間距的，我們打出來的字體都(dōu)是有默認的固有間距。通常情況下默認的固有間距是不需要我們去調整的，隻有在特殊情況下才需要對(duì)字間距做相對(duì)應的調整。大标題因爲字号比較大，在一些特定的界面(miàn)上，大标題的字間距會(huì)被縮小。這(zhè)個調整是細微的，可能(néng)我們都(dōu)沒(méi)察覺。那也側面(miàn)說(shuō)明調整過(guò)的字間距還(hái)是合适我們眼睛閱讀的。 

四、文字的行間距 

        行間距需要調整的地方就(jiù)比較多。在整個段落中，每行的字符數對(duì)于整體的可讀性起(qǐ)著(zhe)主要作用。如果文字段 落非常寬，閱讀性則差。文字設計得太密集也不行，會(huì)給讀者的眼睛帶來壓力，造成(chéng)混亂。所以段落的行間距在設計的時(shí)候就(jiù)需要留心。行間距設置可選擇在字體大小的120%到145%之間，這(zhè)個比例是我個人覺得比較合适舒服的，大家可以試試。 

五、文字的段間距 

        段落與段落之間需要有一定的距離，如果段落間距離過(guò)小，同樣影響視線的移動，過(guò)大則容易導緻上下文的聯系變得松散。段間距比較常見的設置爲2.0em。 

六、文字的顔色和對(duì)比度 

        文字顔色與相應背景也至關重要。如果在綠色背景上寫綠色文字，就(jiù)難以閱讀了。設計師選擇淺色字深色背景，或是深色字淺色背景，都(dōu)是有原因的。對(duì)比使得字符容易閱讀。文中提及的關于文字設計來提高UI界面(miàn)的可讀性，說(shuō)白了其實不過(guò)是選擇什麼(me)字體設定什麼(me)參數，但恰恰有可能(néng)是你看似一個不重要的數值，而導緻整個界面(miàn)的閱讀性丢失。當用戶打開(kāi)閱讀性差的界面(miàn)，可能(néng)不過(guò)幾秒就(jiù)會(huì)關閉，這(zhè)對(duì)産品來說(shuō)是相當大的損失。所以說(shuō)到底，前端設計師們在設計這(zhè)些界面(miàn)的時(shí)候，一樣要認真對(duì)比，保證界面(miàn)優美的情況下還(hái)能(néng)有效的閱讀。