2006 年,Oliver Reichenstein 撰寫了文章《網頁設計 95% 的工作是排版》,這是當年最有爭議的文章之一。 Reichenstein 在文章中這麼説道:“網頁設計不僅僅是挑選並使用精美的字型,更多的是關於我們如何在設計中使用它們。” 網站最基本的功能是呈現資訊,讓多用户可以閲讀。字型的展示和排版自然也是網頁設計師工作的重要內容之一,今天我們整理了一些關於文字排版的技巧,分享給大家。

  首先我們要清楚一個問題,就是什麼樣的排版才可以稱得上是優秀的頁面文字排版?很多人都認為優秀的文字排版,在閲讀感受上一定是很棒的,文字表達的意思也是連貫的,在視覺上體現出來的就是平衡,在整體上有一個空間感。網頁製作時文章的佈局,內容的設定以及欄目的設計都對文字的易讀性有影響。從文字排版的易讀性出發,需要考慮文字的字型、文字的大小、段落之間的行距、間距、背景顏色的使用以及文字的顏色等等。

  字型、字號

  字型和字號這兩個元素必須捏在一起説。

  字型分為襯線體(serif)與非襯線體(sans serif)。簡單的説,襯線體(serif)就是帶有襯線的字型,筆畫粗細不同並帶有額外的裝飾,開始和結尾有明顯的筆觸。常用的英文襯線體有 Times New Roman 和 Georgia,中文即是我們在 windows 下最常見的中易宋體。

  與襯線體相反,無襯線裝飾,筆畫粗細無明顯查差異的字型就是非襯線體(sans serif)。 Arial 、 Helvetica 、 Verdanad 都是我們熟悉的英文非襯線體,中文有微軟雅黑和 mac 下預設的中文-華文細黑。

  我們隨手拿起一本書或者一份報紙,數一數每行的文字,一般情況下都不會超過 40 個漢字。這是因為如果每行文字過長,讀者會不停的轉動脖子,感到疲憊的同時也會降低閲讀效率;目光從行尾移至下一行首,也很容易序列,影響讀者瀏覽文章的節奏。這點同樣適用於網頁上的文章閲讀。由於顯示器是橫向的,我們更要注意劃分閲讀區域。

  白色是全頻光,全放射光對人眼睛的最有刺激,所以很多印刷品讀物的紙張都選用乳白色或者淡黃色的紙張。由於顯示器本身就發光,所以同是純白色背景的文字,在電腦上比在紙上閲讀會使眼睛更容易疲乏,另有研究表明:在電腦上閲讀只有在紙上閲讀速度的 78%,閲讀效率大大減低。因此,為了提高頁面瀏覽的舒適度和效率,越來越多的頁面採用淺灰色和淡黃色做為頁面背景。

  另外,印刷品以文字為主的出版物往往會採用低光澤度的紙張,也是因為光澤度高的紙張反射度高,導致閲讀質量下降,容易使人視覺疲勞。頁面背景仿造低光澤度的紙張(紙張紋理)也能否提高閲讀的舒適度呢?

  雖然在網頁設計中依然有很多需要我們注意的地方,最後,分享給大家一個想法就是:網頁設計中排版很重要。做出正確的排版可以讓您的網站感覺清爽,糟糕的網頁排版會令多用户分心,傾向於關注自己的感受而非內容。排版的關鍵在於使資訊層級清晰、多用户易於閲讀、並且保證文字是可讀的。文字的排版不應該增加多用户的認知符合,以求達到尊重內容、尊重多用户的目的。