在網(wǎng)頁(yè)設計和APP軟件中，一個(gè)好的排版不僅僅要擁有漂亮的字體。更要有高度的可讀性——易于瀏覽——同時(shí)能讓用戶(hù)專(zhuān)注它的內容。

這是一個(gè)相當艱巨的任務(wù)，但是大多數設計師可以通過(guò)練習達到這種效果。

今天我們將去看看優(yōu)秀的用戶(hù)體驗需要遵守的10個(gè) “準則”，同時(shí)你也可以學(xué)習以便幫助你設計出非常棒的設計。（每個(gè)規則都配有一個(gè)網(wǎng)站的例子）

可讀性

必須使用無(wú)襯線(xiàn)體的想法是過(guò)時(shí)的，但是你要去了解為什么必須使用無(wú)襯線(xiàn)體的想法是過(guò)時(shí)的深層次原因：文字必須是易于閱讀的。

你需要避免難以閱讀的字體，然而就是這些難以閱讀的字體存在于腳本當中，比如新奇的字體或者哥特風(fēng)的字體。（除了那些特別需要裝飾的藝術(shù)字體以外。）

絕大多數可讀性字體都能夠被輕松閱讀的，它不會(huì )花費用戶(hù)太多時(shí)間去注意字體本身。這就是可讀性準則的原理。

給行間距留足夠的空間

關(guān)鍵就是設計一個(gè)用戶(hù)都喜愛(ài)的行間距。適宜的行間距有利于閱讀，這在移動(dòng)端尤其的重要。

造成行之間變化的因素有以下這些：

文本大小 文本數量 字體樣式 屏幕寬度

這里沒(méi)有什么明文的規則去告訴你應該怎么做–但是這里有一些規則你可以去遵循：

對于大多數網(wǎng)站，設置行間距的文本大小約125% 對于移動(dòng)設備，設置行距的文本大小約150% 使用一個(gè)松散的段落間距——等于“回歸”——使段落容易閱讀 使用你的雙眼去測試，看文本在屏幕上是松的還是緊的。（感受即可） 使用大而圓的字母

大又圓的字更易閱讀。所以字母有大的圓弧-這個(gè)弧度在字體里面就像一個(gè)循環(huán)的“o”。

緊湊和壓縮的字體是很難閱讀的。寬松的風(fēng)格，比如上圖這個(gè)例子就容易閱讀，因為每一個(gè)字母都容易區分。

給字體設置大小

毫無(wú)疑問(wèn)，使用大點(diǎn)的文字會(huì )讓用戶(hù)感覺(jué)舒服。大或者小的文字取決于你需要放置多少文字在你的頁(yè)面里；尤其注意大段文字。

不同的設計師對使用多少文本有不同的想法，大多數認為每行使用45-60個(gè)字是理想的。這樣縮小了手機的排版，同時(shí)大多數用戶(hù)能接受的。

尋找字母高度

字母高度——尤其是小寫(xiě)字母——讓用戶(hù)輕松的瀏覽你的內容有很大的影響。

小寫(xiě)字母“x”不管多高它仍然是小寫(xiě)”x”. 用更高的“x”小寫(xiě)字體更容易閱讀，這就是說(shuō)小寫(xiě)字母的高度更接近大寫(xiě)字母。查找字符集，其中x的高度是三分之二是大寫(xiě)字母高度的四分之三。

學(xué)會(huì )表現文本的字間距

好的字間距意味著(zhù)好的排版。

你不會(huì )有時(shí)間，你也不需要，回到字間距這里。但當展示字體的時(shí)候。你希望每一個(gè)字母都是組合在一起的，就像它們原本如此。這個(gè)細節將會(huì )幫助你去如何展示，防止用戶(hù)忘記重要的部分。

考慮比例

比例能夠幫助你去為一個(gè)項目創(chuàng )造樣式。雖然這聽(tīng)起來(lái)像是在做數學(xué)題，但是它能讓你的工作更加輕松。

回到行間距；那就是比例。考慮著(zhù)文本的大小、文本主干、小標題、標題和大面積的復制。把他們連成一片，從視覺(jué)上看起來(lái)是一片和諧，同時(shí)你也知道是用怎樣的比例更好。一開(kāi)始可能有些復雜，但是 TutsPlus有個(gè)很酷的教程幫助你去理解它。

統一風(fēng)格

當談到字母的形式，粗體是很重要的。由于超細的字母缺乏對比，所以很難閱讀。同樣，細體和粗體有強烈的反差也會(huì )存在同樣的問(wèn)題。

解決方法：堅持相對統一的字體形式。這種風(fēng)格是很容易被使用，不管你是使用哪種背景都有可讀性。

限制字體的使用

兩個(gè)字體。再說(shuō)一次：兩個(gè)字體。

所有設計都應該遵從這個(gè)準則。太多的字體會(huì )讓你的用戶(hù)發(fā)瘋。眼睛會(huì )非常痛苦，可讀性很差。同時(shí)也讓用戶(hù)很痛苦。

學(xué)會(huì )使用兩種字體——你可以有一種藝術(shù)字體，如果需要——保持這樣的習慣。標出每個(gè)字體應該如何使用。包括顏色、大小和相應放置的位置。對于每一個(gè)設備，不同的頁(yè)面也應該是一致性的。

對比度

在一些少數流行的設計里面，背景和字體只有很小的區別。它看起來(lái)很酷炫，但是并沒(méi)有那么友好，可讀性也差。

內容才是讓你的網(wǎng)站特別和重要的關(guān)鍵。讓背景和字體有更大的區別，它能讓用戶(hù)輕松的閱讀。（這就是為什么白色或者淺色背景使用黑色或者深色背景非常流行的原因。）

網(wǎng)站文本越多，這些準則就越發(fā)重要。當你瞇著(zhù)眼睛看文本時(shí)，對比可能就會(huì )減弱（或字母太小）。Color Safe是一個(gè)強大的顏色工具，它能幫助你去組合接近對比度的顏色。（它會(huì )讓你的網(wǎng)站看起來(lái)更加酷！）

排版設計能幫助你設計出非常好的設計體驗。

http://ezekroy.com/jianzhanzhishi/7456.html 優(yōu)秀的用戶(hù)體驗需要遵守的10種準則