UI設(shè)計(jì)中關(guān)于文本設(shè)計(jì)的幾個(gè)小技巧

01.文本寬度不要超過(guò)800px

在進(jìn)行長(zhǎng)篇幅文本設(shè)計(jì)時(shí)，要注意本文寬度不要過(guò)長(zhǎng)，千萬(wàn)不能鋪滿(mǎn)整個(gè)屏幕。

微信公眾號(hào)的文本寬度660px，知乎的文本寬度654px，google搜索結(jié)果頁(yè)的本文寬度600px，百度搜索結(jié)果頁(yè)寬度560px，百度百科的文本寬度790px。

總之，成熟產(chǎn)品的文本寬度幾乎都不超過(guò)800px，其中600～700之間最為合適。

02.左對(duì)齊長(zhǎng)文本

當(dāng)文本超過(guò)3行或4行時(shí)，慎重使用文本居中對(duì)齊。

因?yàn)槲谋揪又袑?duì)齊時(shí)，不可避免地存在兩側(cè)參差不齊，這會(huì)導(dǎo)致用戶(hù)在閱讀兩側(cè)內(nèi)容和換行時(shí)，導(dǎo)致額外的眼球運(yùn)動(dòng)，這會(huì)造成眼睛疲勞，閱讀困難。

左對(duì)齊的長(zhǎng)文本就在一側(cè)形成看不見(jiàn)的直線(xiàn)，引導(dǎo)用戶(hù)閱讀，具有更好的可讀性，因此書(shū)籍、網(wǎng)站等都在使用左對(duì)齊。

03.標(biāo)題或短文本使用居中對(duì)齊

如果標(biāo)題和文本都比較短，例如一行到兩行，可以使用居中對(duì)齊。再多的話(huà)，可以嘗試左對(duì)齊是否更有利于閱讀。

04.借助元素區(qū)分文本層級(jí)

當(dāng)我們需要區(qū)分不同權(quán)重的文本時(shí)，除了采用字體大小、字重等調(diào)整外，還可以嘗試借助目標(biāo)、項(xiàng)目符號(hào)或引號(hào)等其他元素建立清晰的視覺(jué)層次。

05.充分利用空白間距

我個(gè)人在進(jìn)行文本排版時(shí)會(huì)盡量避免使用線(xiàn)條或背景顏色，因?yàn)樵诖蟛糠謭?chǎng)景下，利用空白間距便可以將層次劃分清晰，并且可以使整個(gè)界面保持干凈整潔。