SPARKFUL

Blog

Insights from the SPARKFUL x Fourdesire teams

原來這些字體不一樣

Decill Changuser-interface-design
name

本文有大量圖檔遺失,我們正在努力恢復中了!

電腦字體百百種,尤其是對於常使用電腦做編排輸出的人,系統內建的中文字體一定不夠用,這時候我們會額外安裝第三方廠商提供的字體,其中最常見的就是華康公司的產品了。使用這些中文字體的時候,我們會發現有些字體名稱後面有加上(P)的字樣。而且在大部分的時候,選擇哪一個都不會感到明顯的差別。

其實這個 P 代表「調和字」(Proportional Spacing),而沒有 P 的我們稱之為「定寬字」(MonoSpacing)。這在我們使用中文字時並沒有分別,但是在英文字母、數字以及符號上則會出現不一樣的結果。

「調和字(P)」代表每一個字母所占的寬度不一樣,例如「i」就會比較窄,「W」就會比較寬。

「定寬字」則是代表每一個字母所占的寬度都一樣。

如下圖,我們可以清楚的看到兩種字體外觀上的區別:

unknown

而其實 Windows 裡內建的新細明體就是「調和字(P)」,細明體則是「定寬字」,我們將幾種常用的字體列出如下:

unknown

調和字(P)這是為了讓中英文或與符號混排時,讓字體間有最好的視覺搭配所特別設計的調和字型。因此在編排文件時建議用調和字型,讓文件看起更美觀。

而我們在寫程式的時候最適合選用的是定寬字,著重在於字元之間清晰、整齊。

通常一套好的「程式用定寬字(Monospace Font for Programmers)」必須具有以下特點:

  • 字體清晰
  • 字集完整
  • 適當間距
  • l(小寫 L )、I(大寫 i )以及 1(數字) 容易分辨
  • 0(數字)、o(英文字母)以及 O(英文字母)容易分辨
  • 英文引號 ` 以及 ' 必須容易分辨,最好是可以左右對稱
  • 標點符號清楚,特別是 { } [ ] 這些程式常出現的符號

Top 10 Programming Fonts 列出了十大建議程式用定寬字,有興趣的不妨參考一下。


Reference:

  1. Photo by Markus Spiske on Unsplash
Decill Chang
Decill Chang
Principal Designer
A しばいぬ lover.
divider
Related Posts
name

電影色彩學:這些經典電影如何運用「色彩」引導觀眾情緒

電影裡的弦外之音無論是電影、圖畫或任何形式的創作中,「色彩」都是非常基本且重要的元素。好的色彩運用可以讓人一眼看出創作者想表達的情緒。因此,如何恰當的運用色彩是一項相當重要的課題。平常在看電影的時候,除了關心劇情,也可以...Read more
name

藏於字句間的創作:產品中的在地化翻譯

產品辛苦開發了,但要吸引其他語言使用者的使用,並不是那麼簡單的一件事。即使產品已經在某個國家(例如台灣)有了足夠的使用者數量,也不是翻譯成日文,就會憑空冒出許多日本的使用者。網路是連結的,但社群不是許多人...Read more
name

視差設計:如何在狹小的手機畫面中製造「空間感」

在行動裝置小小的平面螢幕裡,無論是平面風格(Flat Design)還是仿真介面(Skeuomorphism),我們是否能夠在手指滑動之間,跳脫出二維的空間,為使用者創造出額外的層次與空間感呢?也許以下影片能夠給你一些想法: ...Read more