- 零基礎學網頁UI設計
- 胡雪梅
- 1536字
- 2020-11-02 10:02:43
2.1.1 文字在網頁中的應用
文字排版設計主要包括字體的選擇和文字在網頁中排版的藝術規律。文字的排版設計,已經成為網頁設計中的一種藝術手段和方法,它不僅給瀏覽者美的感受,而且可以影響瀏覽者的情緒、態度及看法,從而起到傳遞信息、樹立形象和表達情感等作用。
☆ 小技巧:文字在傳達信息時具有高度的明確性
圖形和文字是平面設計構成要素中的兩大基本元素。在傳達信息時,如果僅通過圖形來傳達信息,往往不能達到最佳的傳達效果,只有借助文字才能達到最有效的信息說明。在網頁設計中也不例外,在圖形圖像、布局版式和配色設計等眾多構成要素中,文字具有最佳的直觀傳達作用以及高度的明確性。
文字不僅是語言信息的載體,而且是一種具有視覺識別特征的符號。通過對文字進行圖形化的藝術處理,不僅可以表達語言本身的含義,還可以以視覺形象的方式傳達語言之外的信息。在網頁設計中,文字的字體、規格以及編排形式就相當于文字的輔助表達手段。
通過圖形化處理的文字是對文字本身含義的一種延伸性的闡發。與語言交流時的語氣強弱、語速的緩急、面部表情及姿態一樣,文字的視覺形態的大小、曲直、排列的疏密整齊或凌亂都會給瀏覽者不同的感受。圖2-1所示為網頁UI中的文字設計表現。
☆ 提示
文字可以有效地避免信息傳達不明確或歧義等現象的發生,從而使瀏覽者能夠方便、順利和愉快地接受信息所要傳達的主題內容。
1.字體的表現力
從視覺效果來講,文字本身是一種特殊的圖形,不同的字體具有不同的性格和表現力。筆畫粗壯并且棱角分明的字體,會給瀏覽者一種男性化、莊重、嚴肅、醒目和有力的感覺;筆畫纖細并且字型圓潤的字體,則會帶給瀏覽者一種女性化、清新、精密和柔弱的感覺;而手寫體帶給瀏覽者的就是隨性、有個性和設計感強烈等印象,如圖2-2所示。

圖2-1 網頁UI中的文字設計

圖2-2 網頁中字體的表現力
2.字體種類的選擇
同一網頁UI中,使用的字體種類較少、差異性較小的話,可以使網頁具有文靜、雅致的特點,這種字體搭配方式常用來表現精細和高格調的網頁。
使用的字體種類多且差異性大,會讓網頁顯得喧鬧,給瀏覽者一種信息量巨大的感覺,所以通常并不建議使用。一般來講,除非特別需要的情況,同一個網頁中,使用的字體不宜超過4種,如圖2-3所示。

圖2-3 網頁中使用字體的數量
3.盡量使用標準字體
不是每位瀏覽者都可以在終端上看到同一個字體,這意味著設計師選擇的特殊字體,用戶有可能看不到,因此應盡可能選擇標準字體。
·用戶更熟悉標準字體,因此他們可以更快地閱讀。
·特殊的并且少量的字體可以制作成廣告素材嵌入網頁中使用。
·良好的排版會使用戶更加關注內容本身,而不是字體的類型。
4.限制一行文字的長度
保證每一行文字的字符數量是文本可讀的關鍵。在網頁中不是設計師來定義文本的寬度,而應根據用戶的可讀性來定義。
如果一行文字太長,會使用戶在閱讀時容易串行,在大段的文本中很難找到正確的行。這樣會導致用戶的眼睛難于專注文字。
如果一行文字太短,會使用戶的眼睛經常移到下一行文本,打破用戶的閱讀節奏。而一行文字太短也會向用戶發出一種信號,使用戶沒有讀完當前行就自動跳轉到下一行,這樣的話用戶可能會忽略潛在的重要詞句,導致信息誤判。
☆ 提示
設計移動端UI時,應該每行30~40個字符,具體顯示多少個字數,與不同分辨率的屏幕、文本寬度和字體大小都會有關系。設計的原則是:保證用戶可以流暢地閱讀文本,文字不宜太小或太大。以iOS操作系統的網頁UI為例,正文文本最小字號不能小于24px,太小了用戶會難以閱讀。
5.避免在界面中大段地使用大寫字母
不要所有文本都使用大寫字母。如果想要用戶閱讀大寫字母,設計師可以將首字母大寫,或者將具有特殊含義的縮寫以大寫字母表示。與小寫字母相比,大量地使用大寫字母會嚴重降低用戶的閱讀效率和愉悅感,如圖2-4所示。

圖2-4 網頁中字母的大小寫