你有問過自己,為什麼要工作嗎?

字體重要嗎?
這是一個大家既熟悉又陌生的要素,從大學時期我們做報告時就會學到一點關於字體的知識,像是標準字體是 12pt 等等,但若要更深入討論我相信許多人都很難回答,頂多我們可能會知道某些字體好像比較常出現在海報上等等。大部分的設計像是各類廣告或是 Logo 都會搭配文字來傳達理念,更不用說八成都是文字的雜誌,隨著使用的字體不同能造成的結果也各有差異,比方說我們在設計在選舉中扮演的腳色?這篇文章中提到的歐巴馬總統如何利用字體建立他在選民心中的形象,或是我們用另一個更常見的例子,各式各樣的 Logo 都會採用不同的字體提升其辨識度,比方說可口可樂、 PUMA 、IKEA 等等,現在你是不是腦中已經浮現它們各自對應特殊的字體了呢?
字體在設計中扮演的角色
字體其實充斥在生活中,默不作聲的影響我們對事物的判斷,字體可能會影響觀眾對廣告的感覺、展覽中照片旁的說明也可能因為字體沒調整好而導致讀者無法順利將之讀完,或者在網頁設計上,錯誤的字體可能導致該網站的信任度不高而導致流失顧客,這些都是我們沒注意到但卻天天在發生的事情。今天就來介紹有關字體運用的基本知識以及一些我個人的看法。
字體、字型、字型家族 ?
首先我們來看看很容易造成混淆的幾個名詞「字體、字型、字體家族」,最基本的就是字體( Typeface ),在英文解釋為 “a particular design of type” 也就是具有某種設計理念的文字,是一個比較概括的概念,而所謂的字型 ( Font ) 的英文解釋為 “a set of type of one particular face and size” 。 簡單來說,字體是最初也是最基本設計的概念,而字型就是基於字體但做了部分程度上的修改後被實際應用在設計上的文字型態,而當字型逐漸衍生出許多種類時,它們集合而成的就是字體家族( Font Family )。我們拿 Noto Sans 為例子,Sans 是一種字體,Noto Sans 是ㄧ種字型,但其實點開就能發現有許多不一樣的字型 Thin, Light, Regular, Medium, Bold 等等同樣隸屬於 Noto Sans 字型家族 ( Font Family) 。

而字體衍生成字型的過程中除了調整各式間距、高度,通常都有三種不同型時的變化,我們將之分為襯線字體 ( Serif ) 、無襯線 ( San Serif ) 、 裝飾標題字型( Decorative or display typefaces ) ,其中對比最明顯的就是有無襯線的差異,襯線字體的特色就是每個字的構成有粗細之分,並且在下方都有突出的小腳,就像是我們看習慣的古早報紙字體,襯線字體的小腳、各種線條粗細能幫助讀者的視線流暢的移動,所以特別適合使用在雜誌、文章等等類型的作品上,此外因為襯線字體的模樣與古典的英文書寫體、中文毛筆體更為相像,所以襯線字體也會帶出更經典、正式的感覺,許多古典產品上方的裝飾也因此選用襯線字體。

與玲瓏有緻的襯線字體相反,無襯線字體整體線條統一粗細,看起來簡潔有力且富有現代感,常常是各類標題、流行服飾招牌喜愛選擇的字體,但也因為看起來太多統一,所以當大量的無襯線字體集合在一起時就容易讓讀者抓不到重點,所以並不適合用於文章或較多文字的作品中。
而最後一種裝飾標題字型又常被稱作手寫型或是創意型,這種字型往往擁有最獨特、最高辨識度的特性,像是可口可樂、迪士尼、樂高等等 Logo 都採用這種字型,雖然這類的字體辨識度、記憶性都高,但同時這類字體過多也更容易造成視覺疲勞,因此通常都只使用在標題、 Logo 上,但最近也掀起一陣手寫字體的流行風,完全仿手寫的字體運用得當的話放在文章中反而能使文章充滿溫度、更好的讓讀者融入故事中。
文字之間的關係
除了字體字型,文字的格式也會影響讀者的閱讀體驗。當然如果要詳細的討論文字格式的話那等於是要跳入另一個專門的領域之中,所以今天將只討論一些十分基礎、實用的規則幫助大家更了解如何將字體運用在設計中。

字距 Tracking & 調距 Kerning
第一個我們來討論十分容易搞混的兩個元素,字距 ( Tracking )、調距 ( Kerning ),其實嚴格上來說兩個中文翻譯都是字距,但我為了方便區分會刻意分成這兩個講法。先來談談 Tracking,它指的是整體文章之中每一個字之間的距離, 適當的文字距離才能幫助讀者更順利地接收到我們想傳遞的訊息,過寬的話可能導致看起來呆版,太密集的話可能導致讀者感覺煩躁、沒耐心讀完。有興趣的朋友可以試著用 perfect paragraph 這個小遊戲去進行練習與體驗。
在以下的範例也可以發現 Tracking -100 是完全不能夠閱讀,同時 Tracking 100 如果放在較長的文章中也會比較難閱讀,但是如果使用 Tracking 100 在海報標題上,就可以帶給閱讀者非常大的空間感,而 Tracking -100可以呈現一種很緊張,即時的感覺。

而相較於 Tracking ,Kerning 基本上不會出現在中文,Kerning 指的是「單字」中每個字母間的距離,通常這種程度的調整較常出現在英文的標題或者廣告、宣傳標語上。有些字母太靠近的時候我們就會使用Kerning來進行非常細微的調整,這邊我們也提供一個可以練習 Kerning 的小遊戲 kerntype 給大家練習。

行高 Leading
Leading 在中文有時也稱為行距,簡單來說就是行與行之間的距離, Leading 的數值越大行的間隔就越大,反之就越緊密。如果上面提到的 Tracking 是讓讀者閱讀得更順暢,那 Leading 就是讓讀者閱讀文章時能適時地喘口氣,在閱讀時如果行與行之間距離過近,導致一次要看兩到三行的內容,容易讓讀者無法好好吸收、感到疲勞。

在下面的範例,我們可以發現 Leading 太大,或是太小都會導致讀者非常難閱讀,所以這非常考驗對於設計師對於字型的了解與如何達到平衡。

對齊 Alignment
在我們普遍看到的文章中總共有四種段落對齊方式,分別是靠左 ( Align Left )、靠右 ( Align Right )、置中 ( Align Center )、左右對齊 ( Align Justified ),現代一般的文章、文案都是採用靠左對齊的方式,因為這樣最符合讀者的閱讀習慣,至於靠右對齊雖然很少出現在文章,但如果是要搭配圖案呈現的作品就很適合,圖片左邊文字右邊的配置能讓讀者自然地先觀察圖片,再去看文字描述。置中對齊則是最能夠吸引注意力的方式,所以特別適合用於標題或是想強調的部分,比方說當我們在敘述中想引用某位偉人曾說過的話,我們就會將它以置中的方式呈現在下一行。

最後一種就是 Align Justified 左右對齊,會加長文字之間的空間讓一行文字填滿紙張不留下左右空白,這也是在較傳統的報章雜誌上常見的對齊方式。

起伏邊 Rag
Rag 也是在英文排版中較容易出現的問題,由於英文單字並非一個完整的正方形單位,當單字組成非常攏長時就會導致軟體自動幫我們跳行的問題,那這時就會在上一行出現一小塊留白,這個留白的部分就是 Rag ,如果看看下面的例子,我們可以發現為什麼在中文的書籍與雜誌排版中,比較沒有 Rag 的問題,因為每一個中文字都是一個正方形的單位,不會導致上述的問題。從下方中間那個圖,我們可以發現許多空隙穿插在段落中,這會讓讀者非常難以閱讀,所以這時就必須適時的調整 tracking 或是刪減一些內容去作出調和。此外雖然中文沒有 Rag 的問題,但中文的閱讀比英文更重視語感,如果讓讀者在閱讀時感覺好像詞句被切斷了就會導致思緒也被打斷,進而影響閱讀體驗,比方說下方第一行「畢業於舊金山藝術大學—廣告&新科技媒體研究所。」這一句話,因為切斷的部分都是完整的單詞「新科技媒體/研究所」所以並不影響閱讀,如果切在不適當的地方變成「新科技媒/體研究所」,那就有可能打斷讀者的思緒。

選擇字體時容易遇到的迷思
一次使用多種字體更好被閱讀?
在剛開始還不熟悉字體排版前,常常都會在設計中應用大量不同的字體。文章的標題、段落小標、內文、引用段落、重點部分等等都使用了不同的字體,原本以為凸顯重點但其實使用過多的字體反而會讓讀者搞混。就像我們前面所提到的,每個字體都有不同的個性,一次使用太多的字體反而讓讀者無法輕易暸解內容的重點在哪?如果要讓內容更好閱讀以及有層次,我們可以在選定好一個適合的字體後,用字的大小來區分重要程度,大的通常代表標題,也是最要先注意的資訊,而小的尺寸通常是細節與延伸內容,透過大小區分也是個創造內容層次跟掌握讀者閱讀視線。
好看的字體一定好用嗎?
設計師在挑選要應用字體的過程中,有時可能會看到一些時尚又好看的字體,它們可能外觀很漂亮,也能夠讓受眾很直覺的感受到字體的個性與風格,但這些字體卻不一定適合用在所有的作品上,字體的選擇除了美觀之外,更要注重讀者的閱讀體驗。就像有時候我們可能會設計到一些財經雜誌或是歷史相關的書籍,而會閱讀這些書籍的讀者,大部分都是年齡比較大的讀者,如果我們使用比較小的尺寸以及主打時尚美觀的字體,可能會讓這些讀者讀的很吃力,做設計是為了解決問題,我們在設計時除了要考慮美感,更要思考怎麼樣設計才更適合讀者。
結論
對於剛接觸字體的讀者而言,我們可能還不曉得怎麽樣去使用字體。雖然挑選字體要注意字體風格是否符合專案以及該字體在專案中要達成的作用及目的,但是有時挑選字體更像是一個猜謎與常識的遊戲,也看重自己的直覺,我們可以使用以下的練習方式,去培養我們的字體直覺。自己動手做是最快的,我在一開始練習時,會先試著使用自己覺得合適的字體,並反覆嘗試不同樣的字體在同樣的媒材上,去看看哪個字體比較合適,當我們練習完成時,可以在 Adobe Font網頁對照看看在相同的風格或是網頁上,其他人都是使用什麼樣的字體?我們使用的字體,效果跟這些建議相比是好還是壞?這樣至少就可以提供一個方向來做練習了,但是每個專案畢竟都不相同,因此當我們隨著練習越多,也對字體的使用越熟悉時,我們就要自己跳脫這些建議以及規則,找到自己的字體的使用方法。
Boring 精選
Starting Over |藉著疫情偷偷喘口氣思考也沒關係
你有問過自己,為什麼要工作嗎?
Design School 指南書
在這個階段的讀者們已經進入設計環境在學習設計,但是對於是否要走上設計師這條路可能還不是那麼確定。除了設計以外的事情,在學校中也許多事情可以嘗試,是不是選擇多到不知道怎麼開始?本篇文章,列出幾件我認為在學生時代必須要做的事情,給你參考看看。
Apple 已經控制了我們的下面
大數據掌握行為,同時也可以掌握多巴胺。
你拿時間做什麼?一位設計師的高效時間管理訣竅
有一天同事走過來我旁邊說,為什麼你做很「快」 — — 什麼意思?什麼叫快?是做事很快?還是想事情很快? 我們就互相分享自己的workflow,也因此有這個機會分享我的workflow給各位thinker or designer。
更多文章

設計師該如何得體的表達「不同意」
為什麼我們總避免表達「不同意見」?到底要會做人?還是會做事?

設計師都只用蘋果電腦?ProArt創作者系列筆電打破我們對 PC的刻板印象!
因為PC 螢幕色域不夠廣、不夠精緻,不適合跑設計軟體,還是這是我們一直以來的刻板印象 ? 本篇文章分析幾個角度來討論 PC 電腦,分別是螢幕大小、電腦效能配置,而這些配置將會如何影響創意者的工作流程?

第一份設計工作,應該要在乎薪水嗎?
當我準備從研究所畢業時,身旁同學都把薪水的數字看得很重要,因為感覺薪水的數字代表我們的價值,是嗎?

2021-03 | Show Me You Legs
testing testing

當我們工作倦怠時該如何重新出發?
明明在工作中各種會影響團隊效率的問題我們都會積極處理,但為什麼在面對倦怠時,卻很少想過要處理它?

沒有靈感時,先上網搜尋更多作品是件好事嗎?
唷~我知道! 我也知道那個! 大家好像什麼都知道?

Starting Over |藉著疫情偷偷喘口氣思考也沒關係
你有問過自己,為什麼要工作嗎?

開會是時間殺手? 其實開更多會能夠幫團隊省下更多時間!
讓人討厭的不是開會,而是無意義又攏長的會議才讓人討厭。

Design School 指南書
在這個階段的讀者們已經進入設計環境在學習設計,但是對於是否要走上設計師這條路可能還不是那麼確定。除了設計以外的事情,在學校中也許多事情可以嘗試,是不是選擇多到不知道怎麼開始?本篇文章,列出幾件我認為在學生時代必須要做的事情,給你參考看看。

社群平台可以取代個人網站嗎?
在社群媒體的時代,設計師還需要建立個人網站嗎?還是社群媒體可以完完全全的取代網站式的作品集,許多設計師都把作品放置在Behance, Dribbble等等,那這樣做又存在什麼風險?