- 相關推薦
網頁設計中字體應用的10個技巧
優化字體就是優化可讀性，可訪問性，可用性，以及文字的整體平衡。在本文中，將提供一些幫助提高文本內容可讀性和易讀性的準則。
1 使用盡量少的字體
使用超過3種不同的字體會使網站看起來結構松散并且不專業。請記住，太多的字體大小和樣式同時也會破壞網頁的布局。
2 使用標準字體
字體嵌入服務(比如Google Web Font 和 Typekit)有很多有趣的字體，這些字體可以給你的設計帶來全新的、新鮮的和意想不到的東西。它們也非常容易使用。
實際上，這種方法有一個嚴重的問題——就是用戶更熟悉標準字體，在標準字體下用戶可以更快地閱讀。
除非你的網站對自定義字體有著特殊的需求，比如為某個品牌設計網頁，或者意圖創造一種沉浸式的體驗，否則最好還是使用系統自帶的字體。安全的做法是使用一個系統字體：Arial、Calibri、Trebuchet 等等。記住，好的字體設計會把讀者吸引到內容上，而不是字體本身。
3 限制一行字的長度
一行中字符的數量是文本可讀性的關鍵。不應該光由你的設計決定了文本的寬度，也應該考慮到文本的易讀性。Baymard 研究所關于可讀性和字行長度的建議是：
“如果想要一個好的閱讀體驗，應該每一行有60個左右的字符。一行中字符的數量是文本可讀性的關鍵。”
如果一行太短，眼睛就得經常轉回去，這就打破了閱讀的節奏。
如果一行文字太長，用戶的眼睛將就很難集中在文本上。
對于移動設備，每一行應該使用30到40個字符。下面是兩個在移動設備上瀏覽網站的例子。第一個使用每行50-75個字符(打印和桌面應用的每行最佳字符數)，第二個使用了最優的30到40個字符。
在網頁設計中，你可以通過使用 em 或像素來限制文本塊的寬度，來找到每行的最佳字符數。
4 選擇一個適用于各種大小的字體
用戶用來訪問你的站點都是不同大小屏幕和分辨率的設備。大多數用戶界面都需要不同大小的文本元素(按鈕、字段標簽、欄目標題等)。這里重要的 是要選擇一個在不同的尺寸和字重上都能很好地保持可讀性和可用性的字體。
5 使用字母區分明顯的字體
許多字體都把一些字母設計得不容易識別，特別是“i”和“L”(如下圖所示)，以及字母間距不當的問題，比如“r”和“n”看起來像“m”。所以在選擇字體時，一定要在不同的環境中試驗字體，確保不會給你的用戶帶來問題。
6 不要全部大寫的字母
全部大寫的文本——意思是所有的字母都是大寫字母——在不涉及閱讀的情況下還是不錯的(例如縮寫或 logo)，但是當涉及到閱讀時，不要強迫你的用戶閱讀全是大寫的文本。正如 Miles Tinker 在他的影響巨大的《印刷的易讀性》中提到的，全部大寫的文本與小寫相比，大大降低了瀏覽和閱讀的速度。
7 不要把行間距最小化
在字體排版中，我們有一個特殊的術語來表示兩行文字之間的間距——leading(或行高)。通過增加行高可以增加文本行之間的垂直空白，從而提高可讀性。一個比較好的規則是為了打造良好的可讀性，行高應該比字符高度多大約30%。
正如 Dmitry Fadeyev 指出的，合理地使用段落之間的空白，已經被證實可以提升用戶20%的理解度。使用空白的技巧在于為用戶提供易于消化的內容，然后剝離無關的細節。
8 確保有足夠的顏色對比度
不要在文本和背景上使用相同或相似的顏色。文本越清晰，用戶就能越快地瀏覽和閱讀。以下是 W3C 推薦的正文文本和圖像文本的對比比例：
小字體的文本應該與背景有至少4.5:1的對比度。
大字體的文本(14pt的粗體或18pt的常規以上)應該與背景有至少3:1的對比度。
這兩行文字不符合顏色對比度的建議，很難在它們的背景顏色下閱讀。
這兩行文本符合顏色對比度的建議，很容易在背景色下閱讀。
一旦你確定了顏色的選擇，就需要在設備上和真正的用戶之間進行測試，這是非常有必要的。如果有測試反映出閱讀的問題，那么你就可以確信用戶也會遇到同樣的問題。
9 不要使用紅色或綠色的文字
色盲是一種常見的情況，尤其是在男性中(8%的男性是色盲)，所以建議使用其他顏色來引導重要的信息。同樣，應避免使用紅色和綠色來傳達信息，因為紅綠色盲是最常見的色盲。
10 不要使用閃爍的文字
閃光或閃爍的內容能引發易感人群的癲癇發作。不僅如此，這很可能會讓大部分的用戶感到厭煩或精神渙散。
【網頁設計中字體應用的10個技巧】相關文章：
網頁設計中的字體設計07-26
網頁設計中字體和文字搭配的技巧10-01
網頁設計中字體規范06-07
攝影圖在網頁設計中的應用技巧05-12
網頁中字體排版設計方法07-12
網頁設計中圖片常用的技巧08-17
網頁設計常用哪些字體08-05
網頁設計配色及字體規范06-09
網頁設計之字體設計規范06-20
網頁設計中圖文混排的技巧08-06