無形之章9
術語
字形和字體
不得不說Font與Typeface即是在英文中也有很多混用的地方,很難分清,現在通常被翻譯為「字體」的Font在傳統印刷界是指特定尺寸、特定字重、字偶間距等信息的一種Typeface,比如「尺寸14pt,字重為Bold的Helvetica」就是一個Font,而這裡的Helvetica就是它的Typeface。不過現在Font的所指定的通常不再包括尺寸了,因為與鑄模的時代不同了,數字字體尺寸可以很輕易地改變。
Typeface的另一個稱呼是Fontfamily(字族),這個詞實際上比Typeface更好理解且不容易混淆,能很明顯的表達出Font是Fontfamily的子集的意思,所以在HTML&CSS的標準中使用的是Fontfamily(字族)。簡單來說「Helvetica」是一個Typeface,而指定具體的字重:「HelveticaBold」,這就是Font了。
還有一個概念是Glyph,它表示的是字的某種寫法或者說字體的「骨骼」,比如字母a和ɑ就是Glyph不同,涙–淚、強–強也是Glyph的不同。
而Font、Typeface和Glyph在中文裡的翻譯就亂七八糟了,按照國家標準(GB/T16964)應該是:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
然而,在實際使用上字體和字型混亂不堪,常常把Font稱為字體,而字型和字形更是常常搞反。常用民間稱法是把Font稱為字體,不用Typeface而是使用Fontfamily即字體族,再把Glyph稱為字形或字型。這種稱法實際上比標準翻譯更加流行。
羅馬體與義大利體
Roman指的就是襯線體,這個稱呼是因為襯線的起源於羅馬時期的碑刻。由於通常都把襯線體作為正文字體,所以很多場合下,Roman就變成了正文字體的代名詞。
而Italic(義大利體)最早是指義大利使用的一種手寫體,而後來Italic(義大利體)常被用作斜體與正文的羅馬體搭配,成為了斜體的代名詞。另外一種斜體的稱呼是Oblique(單斜體、仿斜體)也被稱為Slanted,這通常是指直接把正文字體做傾斜處理產生的斜體,而Italic(義大利體)則是特別設計的與正文相差較大的斜體。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△Roman羅馬
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△同一字體(AdobeGaramond)的Italic(義大利斜體)與Oblique(單斜體)
字體結構
這篇15000多字的文章,可能是最全面的字體基礎知識大全
字間距、字偶間距與等寬字體
字間距(Spacing)顧名思義是字元間的距離,在實現上就是字元圖形外邊界框的尺寸和字元在方框中的位置。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△字間距-《西文字體》
字偶間距(Kerning)也被稱為字距調整,是在字間距的基礎上,為實現不同字偶(一對字元)可以有不同字間距的調整值。不同的字母有不同的外形,所以字體只有同樣的字間距是不協調的,比如「AH」間是標準的字間距,而「AV」由於V和A的形狀,其位置可以重疊,所以需要負字偶間距才能達到協調的外觀。字間距和字偶間距都是一個字體的組成部分,並且字偶間距需要為很多字偶準備。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△一套字體中的多個字偶-《西文字體》
另外有字距的概念就是等寬字體(Monospaced)與比例字體(Proportional)了,比例字體就是上面說的按字元外形設置有不同字距的字體,這種字體外形協調,可讀性好。而等寬字體(Monospaced)是每個字字間距都相同的字體,其優點是可以很好的控制排版對齊,因此目前編程的代碼編輯器通常都會使用等寬字體(Monospaced)為顯示字體。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
字重與寬度
字重的劃分根據不同字體廠商各有不同,不同的字重稱呼也可以不一樣,常見的劃分如下:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△另外還有窄字體:Condensed、寬體:Expanded、斜體:Italic、Slanted(通常指仿斜體)。
連字
連字(Typographicligature)也被稱為合字,源於手寫時的連筆,如「fi」的i上一點常與f的一鉤合併。傳統英文印刷常會使用連字,而1970年代照相排版流行之後就很少使用連字了,而且由於顯示屏的解析度有限,是否連字差別不大,所以現在不是很流行使用連字。
連字的實現方式有兩種,一是字體的PostScript連字功能,這需要排版或顯示軟體支持,另外是使用合字字元,如:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
這篇15000多字的文章,可能是最全面的字體基礎知識大全
字面率、中宮、重心
這篇15000多字的文章,可能是最全面的字體基礎知識大全
字面率、字面、中宮、重心是常見描述中文字體外觀特點的屬性。
字面是相對於字體的外框而言字體實際尺寸的範圍,同樣字型大小下不同字體字面大的實際尺寸會更大。
字面率是字面與外框內尺寸的比值,一般簡體中文字體有92%左右的字面率,日文字體漢字通常字面率要高一些,94%左右,相對而言,日文字體漢字更追求平均和較大的字面率。
中宮是漢字主要結構的大小,類似於英文字體的x高度。中宮大小可以用來評判字體的鬆緊程度,中宮分橫向和縱向,不過通常看橫向的中宮尺寸就夠了。
重心是字體另一個主要的外觀屬性,是字體的視覺中心點,一般字體重心是位於中上部分。
英文字體
字體分類
英文字體的分類方法有許多種,不同的分類法側重點不同,這裡介紹常見的傳統分類法「Vox-ATypl分類法」和數字字體時代具有代表性的typekit網站的字體分類方法,還有按年代劃分(主要參考《西文字體》)字體的方法。
typekit分類法
Sans-Serif無襯線:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Serif襯線:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Sleb-Serif粗襯線體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Script書法體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Blackletter哥特黑體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Monospace等寬字體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Hand手寫體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Vox-ATypl分類法
Classicals古典:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
古典字體分為人文主義體(Humanist),加拉德體(Garalde)和過渡體(Transitional),他們的特徵是有著類似三角形的襯線:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△可以看到人文主義的字體x高度明顯小,大寫字母比小寫字母高許多。
Humanist人文主義字體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
人文主義字體是文藝復興時期的興起的字體,流行於當時文藝復興的中心義大利,所以也被成為威尼斯式(Venetian)字體。
人文主義字體以當時作家的手寫字體為參照,所以保留有很多手寫的特徵,比如傾斜的e、c、o。還有較小的x高度。
e、c、o的軸線傾斜
筆畫粗細差別不大
x高度較小
代表字體有:Centaur、Cloisteroldstyle
Garalde加拉德體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
加拉德體的名字(Garalde)是來源於2個設計師:ClaudeGaramont和AldeManuce。這種字體也被稱為「古風體」或「舊風格」字體。
這是一種比較中庸的字體,其去掉了很多手寫特徵,e的軸線完全垂直了,o和c的傾斜也很小,x高度也較高,字體的比例較均衡,所以很適合作為正文排版使用。
e軸線完全垂直,o、c軸線略微傾斜
筆畫粗細差別不大
x高度較大
代表字體有:Garamond、Bembo
Transitional過渡期體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
過渡時期是指法國大革命、美國獨立的18世紀啟蒙時代(AgeoftheEnlightenment),這種字體也被稱為新古典主義字體(Neoclassical)。
這種字體的幾乎完全拋棄了手寫特徵,襯線幾何化為十分規則的曲線。而且其筆畫粗細相差極大,細處特別細,粗處特別粗,這讓它並不很適合作為正文字體。它適合的是有足夠尺寸來展示其流暢典雅曲線的場合,比如標題或者LOGO。
垂直的軸線
強烈的筆畫粗細對比
襯線曲線平滑
代表字體有:Baskerville、TimesRoman
Moderns現代:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△Moderns(現代)字體的特徵
Didone迪多尼:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Didone(迪多尼)字體的最大特徵就是極細的無撐拱襯線,也被稱為髮絲襯線(hairline-serif),與Transitional(過渡期字體)相比有更高的筆畫粗細對比,字母開口閉合處也更緊湊。這種字體不是很適合作為正文排版,它需要較大的展示空間。
極細的髮絲襯線(hairline-serif)
筆畫粗細對比達到極致
字母開口處緊湊
代表字體有:Didot、Bodoni
Mechanistic機械風格體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Mechanistic(機械風格)也被稱為slabserif(粗襯線、厚板、板狀襯線)體,其最大的特徵就是粗厚的無撐拱襯線。通常Mechanistic風格的字體筆畫粗細對比低,且很粗,曲線也很生硬。
無撐拱(支架)的粗厚襯線
筆畫粗且粗細對比低
曲線生硬
代表字體:Clarendon、Rockwell
Lineals線體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
線體更常見的名稱是:sans-serif(無襯線體)和gothic(哥特體)。其是現代字體的代表,其特徵就是沒有襯線,所以它還有很多子類別:Grotesque(怪誕體)、Neo-grotesque(新怪誕體)、Geometric(幾何體)、LinealHumanist(人文主義無襯線體)。
由於Grotesque(怪誕體)是最早的無襯線體,所以很多地方也把無襯線體稱為Grotesque(怪誕體)或Grotesk(德語怪誕體)。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Grotesque怪誕體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
怪誕體是最早的無襯線字體。也被直接稱為歌德體或者音譯為格洛特斯克體。
它沒有襯線並且筆畫極粗還有明顯的筆畫粗細對比,通常只會用在標題或者大尺寸場合。
G字母有字刺
筆畫粗細對比明顯
較高的x字高
代表字體:MonotypeGrotesque、FranklinGothic
Neo-grotesque新怪誕體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
新怪誕體是最常見的無襯線字體了,其筆畫粗細變化小、開口處緊湊、X字高較大、曲線柔和很適合最為正文字體,有名的Helvetica就是新怪誕體的代表。
筆畫粗細變化小
X字體高度大
曲線柔和
代表字體:Universal、Helvetica
Geometric幾何體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
如其名是遵循幾何形式來製作的字體,極具現代感,不適合作為正文字體,著名的Futura就是幾何字體。
由幾何結構構成外形
筆畫粗細對比小
代表字體:Futura、Eurostile
LinealHumanist人文主義無襯線體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
和經典的人文主義字體相似,人文主義無襯線字體也留有手寫的特徵,雖然沒有襯線但是筆畫有裝飾線的粗細變化,作為正文時會又類似襯線體的效果。
有裝飾性的筆畫粗細變化
代表字體:Gillsans、Optima
Calligraphics書法體
相比上面那些字體,書法體外形更加多樣,
Glyphic雕刻體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
雕刻體來自於雕刻和鐫刻的字母。雕刻體是最早的字體,只有大寫字母(不過現在的雕刻體字體都會配上小寫字母),許多雕刻字體看起來可以被分類為襯線字體。
Blackletter哥特黑體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Blackletter由於流行於哥特時期(12世紀~14世紀末)所以常被稱為GothicScript(哥特手寫體)或者OldEnglishScript(舊英文手寫體),要注意的是國內很多地方直接把Blackletter翻譯成哥特體或者黑體,這很可能產生誤解,實際上在字體領域有一段時間Gothic(哥特體)代表的無襯線的字體,雖然目前在英文中幾乎不用Gothic代表無襯線體了,但是在日本和韓國還流行用Gothic代表無襯線字體,比如FranklinGothic和WindowsMSGothic。而「黑體」在中文字體中也是指無襯線體,所以為做區別最好稱其為「哥特手寫體」或者「哥特黑體」。
這種字體在德國使用到了二戰時期,所以一般也認為Blackletter是德國標誌性的字體,所以它還有個德文翻譯過來的名字:BrokenLetter(破筆字體)。
代表字體:WalbaumFraktur、MonotypeEngravers
Script書法體
Script(書法體)也可以稱為草體。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
代表字體:Shelley、Mistral
Graphic圖形字體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
圖形字體從本質上來說就是不屬於其他類別的展示字體。它可以是用毛筆、鋼筆等任意工具來書寫或設計。如果這個字體不是無襯線字體或者襯線字體,那它可能就是圖形字體。
代表字體:Albertus、Trajan
Gaelic
另外還有一種Gaelic(凱爾特體),主要在愛爾蘭使用,通常不會用到。
年代劃分
公元前~四世紀(古羅馬)
這篇15000多字的文章,可能是最全面的字體基礎知識大全
這個時期的代表字體是古羅馬帝國的雕刻體(Glyphic),由於這個年代小寫字母還沒發明出來,要表現這個時代的氛圍最好使用全大寫。
代表字體:Trajan、Stempel、Rusticana、Hercvlanum
這篇15000多字的文章,可能是最全面的字體基礎知識大全
四~五世紀
這篇15000多字的文章,可能是最全面的字體基礎知識大全
這個年代的代表字體是Uncial(安色爾)體,這是主要書寫在羊皮紙上的字體。Uncial原意為「一英寸高的文字」,因為當時羊皮紙昂貴,所以當時這種字體高度小字距小,不過當代的數碼字體都有了合適的字距。雖Uncial體流行於四、五世紀,不過直到八世紀作為書寫聖經的主要字體。
代表字體:Omnia、HammerUnziale789年,
這篇15000多字的文章,可能是最全面的字體基礎知識大全
九世紀(中世紀)
這篇15000多字的文章,可能是最全面的字體基礎知識大全
Carolingian(卡洛林)是卡洛林王朝時期興起的字體,外形上已經與現代的英文字體差不多了,也開始大小寫成對使用了。查理曼時期(789年),為保證抄本內容的準確性,把抄寫字體統一為Carolingianminuscule(卡洛林小寫字體),讓其成為了中世紀最具代表性的字體。
代表字體:Carolina、Carolingianminuscule、CarolingiabyWilliamBoyd
這篇15000多字的文章,可能是最全面的字體基礎知識大全
十三~十四世紀
這篇15000多字的文章,可能是最全面的字體基礎知識大全
這個時期主要的字體是帶有明顯平頭筆書寫特徵的Blackletter(哥特黑體)。
代表字體:DucDeBerry、NotreDame、AlteSchwabacher、WihelmKlingsporGotisch
這篇15000多字的文章,可能是最全面的字體基礎知識大全
十四~十五世紀(文藝復興)
這篇15000多字的文章,可能是最全面的字體基礎知識大全
文藝復興時期是人文主義字體興起的時期,相比過去的字體x高度更低了,而且義大利斜體開始流行。另外文藝復興時期還有復古的潮流,古羅馬時期的字體也備受尊崇。
代表字體:Centaur、LegacySerif、AdobeJenson、Poetica
這篇15000多字的文章,可能是最全面的字體基礎知識大全
十六~十七世紀(巴洛克)
巴洛克(Baroque)時期字體的特點是精緻的襯線和筆畫粗細對比度較高,也就是Garalde(加拉德體)的特徵。另外這個時期有誇張字花的手寫體也很有代表性。
代表字體:Baskerville、Galliard、Janson、BaroqueScript
這篇15000多字的文章,可能是最全面的字體基礎知識大全
十八世紀(洛可可)
這篇15000多字的文章,可能是最全面的字體基礎知識大全
這個時期的洛可可藝術(Rococo)風格盛行,其最具代表性的字體風格就是細膩柔媚、曲線大膽的各種手寫體。而得益於印刷技術的提升,字體越來越注重對細線條的表現,Didone(迪多尼)風格的字體也由此誕生。
代表字體:SnellRoundhand、ShelleyScript、Linoscript、Cochin、LinotypeDidot
這篇15000多字的文章,可能是最全面的字體基礎知識大全
十九世紀(維多利亞)
這個年代的代表字體是報紙、廣告中使用的各種誇張的裝飾字體。另外無襯線體也在此時開始廣泛使用。
代表字體:Thorowgood、Egyptian、Hawthorn、Carlton、Bernhard、FranklinGothic
這篇15000多字的文章,可能是最全面的字體基礎知識大全
二十世紀
二十世紀以來的字體多樣性極其豐富,很難說那一種能代表一個年度,不過也有Helvetica這樣的經典的字體。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△部分字體圖片出處:《西文字體》
中文字體
字體分類
歷史劃分
甲骨文:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
商周時期的文字形式。作為字體(字型檔)目前使用的最廣的是「北師大甲骨文體」,另外還有台灣中研院甲骨文體、香港中文大學漢達文庫的ics3.ttf、日本文字鏡研究會的Mojikyofont等。
篆書:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
春秋戰國時期的代表文字。是秦始皇統一六國后以小篆為全國的官方字體。
常用字體:漢儀篆書、方正小篆
隸書:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
漢朝的代表字體。隸書在秦朝就已誕生,不過到漢朝才成為主流,所以也被稱為「漢隸」。
隸書筆畫粗細變化小、較平直,外形扁平、工整、莊重。講究「蠶頭燕尾」(起筆凝重,結筆輕疾)、「一波三折」(線條運筆變化)。
常用字體:漢儀隸書、華文隸書、蒙納小隸
草書:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
草書源於漢代初期。
草書源於書寫潦草的隸書,主要分為章草、今草、行草、狂草。草書有大量字形的簡化、連筆,較難辨認。並且通常有一定傾斜。
常用字體:方正大草、方正黃草、葉根友疾風草書、白舟草書、奔行かな
行書:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
行書源於東漢時期。
行書發展源於隸書,是介於楷書、草書之間的一種字體,分為「行楷」和「行草」,「行草」較「行楷」筆畫更加奔放,更近似草書。相比草書,行書只是在隸書的基礎上更加突出筆畫的變化,筆畫間增加了「遊絲」,字形構成基本不變,沒有草書那樣較顯著的簡化、連筆和傾斜,能很容易的辨認。
常用字體:華文行楷、漢儀行楷、DF行書體、王漢宗中行楷、方正硬筆行書、金梅草行書、方正字跡-呂建德行楷
魏碑體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
魏碑體是北魏的代表字體。
魏碑體階與隸書與楷書之間,相比隸書,不像隸書那樣粗扁,相比楷書筆畫粗細變化又更為明顯。獨特的特徵是撇捺會向兩側伸展,收筆前有明顯粗頓以及抬峰,使整個字形穩重中又略顯飛揚。
很多時候也會把魏碑體當成楷書的一種。
常用字體:華文新魏、方正魏碑、漢儀魏碑
楷書:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
魏晉、南北朝時期到唐朝的代表字體。大體可分為早期的「魏碑」和後期的「唐楷」。
楷書始脫於隸書,沒有隸書那麼粗扁,筆畫帶有明顯毛筆書寫痕迹,「橫」依然明顯的左低右高。
在常見的中文排版中,楷體有類似西文中Italic(義大利體)的作用,即宋體作為正文,而楷體作為強調、引用字體。
常用字體:華文楷體、方正新楷體、漢儀全唐詩、方正蘇新詩柳楷、方正宋刻本秀楷
宋體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
明朝的代表字體,起源於宋朝。
宋體雖稱為宋體,但在宋朝並不流行,反而在明朝更為常見。由於歷史原因在大陸稱為宋體,港台和日本則稱其為「明朝體」。
宋體始源於宋代的印刷字體,當時以木板作活版印刷,為順應木的天然紋理,筆畫直橫平豎直、橫細豎粗,起落筆有稜有角(有明顯襯線),字形方正。所以也被稱為「匠人體」。
由於宋體橫細豎粗的特徵,很適合豎排,而現代排版通常都是橫排,所以現在常用的宋體筆畫橫豎筆畫對比會比傳統宋體略低。
另外由於Windows中自帶的宋體(中易宋體)12~14pt大小時顯示的是點陣字體,常有人以宋體代稱為點陣字,實際2者並沒關係。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△中易宋體12~14pt會顯示為點陣字體
常用字體:漢儀書宋、游明朝體、小塚明朝Pro、ヒラギノ明朝、リュウミン(RyuminPro)、方正新書宋、方正雅宋、方正宋體、方正新報宋、造字工房刻宋、蒙納長宋
仿宋體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
可以代表宋朝的字體。
仿宋體是仿製南宋臨安陳起陳宅書籍鋪出版的書籍的字體,於實際興盛於明朝但被叫做「宋體」的宋體來說更能代表宋朝的字體風格。在日本直接稱其為「宋朝體」。
仿宋實際是有明顯楷體風格的印刷體,筆畫較直,但不如「宋體」那樣完全直來直去,「橫」依然帶有楷書的左低右高特徵,筆畫粗細沒有宋體的橫細豎粗,而是較為平均。
常用字體:方正仿宋、文悅古體仿宋、蒙納仿宋
清朝體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
清朝的代表字體應該說是楷書,隨著雕版印刷技術的提升,印刷字體相比宋體有了更多表現筆畫的特徵。清朝字體的一個特徵是中宮普遍較緊湊,不過和其他楷體來說沒有決定性差別,所以「清朝體」的稱呼在國內並不多見,反而在日本比較常見。
清朝體有代表性的字體有仿照揚州詩局刊行的《全唐詩》而作的全唐詩字體,還有清朝官刻體,另外還有前些年在平面設計領域用到爛的康熙字典體,不過康熙字典體的流行和清朝體關係不大,主要是因為其掃描古籍錄入的斑駁字跡。
常用字體:康熙字典體、漢儀全唐詩、弘道軒清朝體、欣喜堂清朝官刻體、DF古籍木蘭A
黑體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
二十世紀中期以來的代表字體。
黑體即是無襯線的中文字體,沒有裝飾用的襯線,簡化筆畫特徵,筆畫粗細差別極小。也被稱為等線體、哥特體(日本叫法)。最早是日本依據西文無襯線體而作的中文無襯線體,後傳入中國(吳竹體),最早只是作為粗大的標題字體,所以被稱之為黑體。
黑體是目前屏幕顯示的首選字體。
常用字體:思源黑體、中易黑體、方正蘭亭黑、冬青黑體、方正等線、方正幼線、方正纖黑、漢儀旗黑、小塚ゴシック、游ゴシック、信黑體、微軟正黑體(蒙納)、微軟雅黑體(方正)、方正悠黑簡、メイリオ、蘋方
風格字體分類
上面是中文字體的主要劃分方式,有些字體在其基礎上又獨特的風格,自成一體。
綜藝體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
綜藝體是黑體的變種,通常用在廣告、標題上。字面極大、追求盡量將空間充滿。
常用字體:創挙蘭、方正綜藝、漢儀綜藝、造字工房力黑、造字工房版黑
圓體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
圓體也是黑體的變種,最早在秀英舎的『活版見本帳』(1914年)中出現,早期流行的圓體是石井丸ゴシック體(1956)。
圓體的特徵在於筆劃的末端與轉角呈圓弧狀。因此圓體不但具有黑體清晰易讀的優點,而且也予人較柔和的感覺。國內更加常見的幼圓體是圓體的一種,是筆畫更加細的圓體。
常用字體:蒙納幼圓、DF丸ゴシック體(華康圓體)、あいこフォント、方正圓體、造字工房悅圓
宋黑體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
宋黑體是介於宋體和黑體之間,帶類似宋體的襯線和黑體筆畫特徵的字體,和普通的的粗筆畫宋體的差別是:粗宋體會有明顯的「橫細豎粗」的筆畫粗細對比,而宋黑體沒有。
常用字體:方正宋黑、銳字雲字型檔宋黑體
圓宋:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
圓宋是基於宋體的變體,相當於圓體之於黑體。在日本被稱為「丸明朝體」。相對於圓體,其有宋體的特徵:筆畫有「橫細豎粗」的粗細對比、帶有襯線。而相對於宋體其襯線圓滑,雖有宋體的筆畫特徵但把稜角都做了圓化,字體結構方正,但細節圓潤,有馬克筆書寫的感覺。
常用字體:丸明オールド、漢儀潤圓、方正秉楠圓宋
姚體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
姚體通常認為是原中華書局聚珍部主任姚竹天於民國時期設計,上海解放日報社高級技工姚志良在二十世紀50年代改刻的字體。也有說法是姚體跟姚竹天的關係是誤傳。姚體興盛於中國大陸的60、70年代,被用作報紙標題、宣稱標語和招牌的字體。至今仍能在很多城市的車站中見到姚體的站名。
姚體是結合了宋體和黑體特徵的字體,一般歸類為黑體的變種。其特徵是像宋體一樣的直線筆畫和「橫細豎粗」的粗細對比,但沒有宋體的襯線,但有明顯的喇叭口和筆畫出頭作為裝飾,最明顯的莫過於豎長的字形和縱向的筆畫走向。
常用字體:方正姚體、蒙納小姚
金文體:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
這個金文體並不是指中國古代的金文,而是一個在日本流行的字體,實際上類似於篆書體,其特點是垂直延伸的字形,並且字的下半部分看起被拉長,有類似篆書的筆畫曲線。這種字體看起來既有有古典氣息,又有現代、神秘的感覺,非常多的用在日本科幻、魔法風格的小說、漫畫、動畫產品產品的標題和海報中。
常用字體:華康金文體(DFP金文體)、DFP金文體うめ
其他字體
繪文字emoji
繪文字(emoji)最早是在1998年左右出現在日本NTTDoCoMo公司的i-mode手機中的功能。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△最早的au絵文字
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△把文字和圖形穿插日本自古就有:日本江戶時代的判じ絵(畫迷)
繪文字(emoji)是以一個字元表示一個圖形的方式表達信息,每個繪文字(emoji)其本質是一個特殊字元,2010年10月發布的Unicode6.0中首次把繪文字(emoji)編入其中,往後每次Unicode更新幾乎都會增加新的繪文字(emoji)。每個繪文字(emoji)字元雖然都有指定的意義,但是實際外觀取決於使用的字體,而各個平台使用的字體並不相同:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
各個平台對的支持情況可以參考:CanIEmoji,各個平台上繪文字(emoji)實際外觀可以查看:emojipedia。
要注意的是繪文字(emoji)和顔文字(かおもじ、Emoticon、表情符號)是指定不同的東西,顔文字是指如:_(:3」∠)_^_^這樣用普通字元組成特定外形來表達表情或動作的文本。其使用的是普通字元,而不是特殊的字元,所以顔文字有更好的通用性,是ASCII藝術的一種形式。
Dingbat字體與Icon-font
雖然現在流行的繪文字(emoji)形式的圖形字元起源於日本的手機,不過把圖形用在字元中,早在數字時代之的印刷業就有了,活字時代就有用來裝飾文本的fleuron(花邊),後來也出現了Dingbats(裝飾符號、雜錦字體),其中最有名和使用最廣的是1971年的ZapfDingbats,在ZapfDingbats中主要還是用在傳統印刷品中的標誌或裝飾性符號,不過小圓臉表情已經出現了。而1990年隨Windows3.1發布的Wingdings和後來發布的其web版本Webdings(網頁核心字體之一)有了更多現代的圖形比如心型和眼睛。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△ZapfDingbats(部分)
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△Wingdings
Dingbats字體也被稱為Pi字體,一般名字中帶Pi的就是Dingbats字體。
而當今流行的icon-font技術就是他們的繼承者,例如網頁中常用的FontAwesome、iconfont.cn都是一種Dingbats,這種技術可以方便的在網頁或者文本構成的用戶界面中加入圖形標誌,而且由於是字體,所以這是當前(支持Svg等矢量圖形顯示技術的地方還不多)最方便的顯示矢量圖形的方式。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△iconfont
文本編碼與Unicode
對於了解字體來說文本編碼標準是不得不認識的,尤其是對要製作或者修改字體的人來說。字體的一個字元對應一個編碼(碼點:codepoint),而編碼對應字符集(CharacterSet)里的一個「字」,字體的字元通過字符集與「字」相連。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△文本編碼的流程
字符集與編碼方式
像通常說的Unicode、GBK、BIG5、Shift_JIS這些都是字符集,其主要作用是為字符集中的每一個「字」分配一個編碼(碼點:codepoint),要注意的有兩點:
字符集里的每一個編碼對應的是一個「字」而不是「字形」,也就是說一個「字」在不同的地區或標準中可能有不同的「字形」,但字符集中只能對其分配一個編碼(除非相差過大,比如簡化字),要顯示其不同的「字形」要通過使用為不同地區或標準設計的字體來實現。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△同字異形。左邊是簡體中文的,右邊是日文
字符集是為字分配一個編碼(碼點),而這個字存儲到文件要再通過特定編碼方式(Encoding)來變成實際的二進位數據,這樣做的意義在於能夠使用不定長(為了節省空間)的編碼。
舉一個十進位的例子來說:有兩個字,編碼分別是1、15要存儲的話,最簡單的方式是存儲為定長數據:01、15。之所以要定長是為了再次讀取時不會發生混淆,比如如果直接不定長存儲的話,讀取10字元時,讀到第一位1就以為讀到是1了。1,15存儲為110再讀取就變成了1,1,5了。而要定長存儲的話,就要浪費很多空間,所以要再經過一次編碼,比如這個例子里可以用把1作為標誌位,讀到1就表明這是2位編碼的字,要再度一位。這樣把兩個字編碼為2、15,這樣就能直接存儲為215了,這比定長的0115要節省空間。這個過程就是編碼方式(Encoding)來決定的。實際上的Encoding是根據二進位來處理的,上面的例子只是便於理解。
過去的字符集往往與編碼方式相對應,比如GB2312就只使用EUC-CN,這讓我們可以忽略它的編碼方式,或者說把編碼方式看成是字符集的一部分,統稱為編碼標準,比如只說某個文本是用GB2312文本編碼。而後來出現了可能會又不同的編碼方式的字符集,Unicode字符集就有UTF-8、UTF-16LE、UTF-16BE等編碼方式,這時就要區分字符集和編碼方式了。用UTF-8、UTF-16等編碼方式存儲同一個字元,它們的數據可能是不同的,但是這些數據都唯一對應於Unicode中的一個編碼(碼點:codepoint)。這本來容易理解,不過Windows下用Unicode來稱呼UTF-16LE(應該是由於UTF-16LE是Windows的內部Unicode編碼所以就這麼稱呼)這就造成了很多誤解,讓人以為UTF-8是字符集。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△Windows用Unicode直接代指UTF-16LE
代碼頁
代碼頁(codepage)是操作系統中管理各種編碼標準的方法,每個代碼頁對應一種字符集和編碼方式,比如Unicode-UTF-8的代碼頁是65001,GBK是的代碼頁是936。
代碼頁是實際編碼標準到應用程序間的中間層,好處是通過改變代碼頁可以簡單的切換系統默認支持的編碼標準,而且便於更新編碼標準,比如Winodows3.1時代碼頁936還是對應的GB2312,而winodws95時已經代碼頁936就更新到對應GBK了,這樣應用程序不需要修改就能支持新的編碼標準。
Windows中把當前系統默認代碼頁稱為ANSI。
GB2312、GBK、BIG5、Shift_JIS
GB2312是1980年制定的編碼標準,GBK是對GB2312的擴展(K)增加了一些字元並保持向下兼容。
BIG5是台灣制定的編碼標準,由於台灣使用繁體字,所以這是繁體地區最常用的文本編碼標準。
Shift_JIS是日本最常用的文本編碼標準。
目前中國大陸的標準是國家編碼標準是GB18030。
Unicode
上面的GBK、Shift_JIS等傳統編碼標準都只為一個地區使用所制定的,而Unicode是目標為所有國家、地區、語言的字編入同一個字符集,所以其被稱為統一碼、萬國碼。
Unicode使用平面(Plane)來安排編碼空間,每個平面分為256行,256列,即65536個字。共有17個平面。所以Unicode共可以容納約110萬字(1,114,112),最大的編碼是10FFFF。目前Unicode8.0已經所使用了12萬字(120,737)。Unicode是個還在不斷不斷更新擴充的標準。
Unicode的平面分為基本平面BMP(BasicMultilingualPlane)和補充平面(也有翻譯成輔助平面)SMP(SupplementaryMultilingualPlane),只有第一個平面是基本平面,也就是Plane0,剩下的16個平面都是補充平面。
如上面所說Unicode有多種編碼(Encoding)方式,UTF-32、UTF-16LE、UTF-16BE、UTF-8等,最常用的是UTF-8,其基本平面的字元(主要是ASCII字元)只要使用1個位元組存儲,而中文通常是佔3個位元組,少數要佔4個位元組。而UTF-16編碼第一平面的字元也要佔2個位元組,中文佔2到4個位元組。一般來說存儲中文使用UTF-16要比UTF–8佔有更少的空間。UTF–16BE和LE有的只是位元組序的差別,BE是大端在前,LE是小端在前。
此外歷史上還有UCS-2、UTF7等的編碼方式,至今已經很少使用了。由於歷史原因JavaScript內部使用的是UCS-2。UCS-2可看成是UTF-16的字集。在沒有補充平面(SMP)字元前,UTF-16與UCS-2所指的是同一的意思。但當引入輔助平面字元后,就稱為UTF-16了。現在若有軟體聲稱自己支持UCS-2編碼,那其實是暗指它不能支持在UTF-16中超過2個位元組的字元。對於小於0x10000的UCS碼,UTF-16編碼就等於UCS碼。JavaScript在ECMAScript6之前就因為這個原因無法處理大於2個位元組字元。
BOM
BOM是位元組順序標記(byte-ordermark),通常用在UTF-16中標識文本的位元組順序,即區分UTF-16LE和UTF-16BE。後來在Windows中被用作區分文本編碼方式的標誌:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
由於除了Windows其他系統對BOM的支持程度不一,所以在製作Web用的文本時,不應該使用BOM。
CJK
CJK是中日韓統一表意文字(CJKUnifiedIdeographs),目的是要把分別來自中文、日文、韓文、越南文、壯文中,起源相同、本義相同、形狀一樣或稍異的表意文字,賦予其在UISO10646及Unicode標準中相同編碼。
字體格式
TrueType
TrueType是最常見的字體格式,後綴名為「.ttf」的字體就是TrueType格式。TrueType字體的輪廓使用的是二次貝塞爾曲線,
OpenType
OpenType可以說是TrueType的擴展,OpenType有和TrueType一樣的封裝格式(SFNT),可以使用TrueType的二次貝塞爾曲線的字體輪廓,也可以使用對曲線表現效果更好的三次貝塞爾曲線CFF(PostScriptType2)。
WOFF、EOT
WOFF是W3C標準推薦的網頁字體格式,其本質上是對TrueType、OpenType格式的壓縮封裝。EOT是微軟推出的網頁字體格式,本質上是對OpenType格式精簡再封裝,雖然EOT不是W3C標準,但是由於EOT出現的很早(IE4就支持了),為了兼容性(尤其是對IE),EOT也是常見的網頁字體·格式。
格式轉換
由於TrueType是二次貝塞爾曲線,OpenType一般是三次貝塞爾曲線,從三次轉換到二次的過程不會是無損的,所以很可能產生偏差。而且很多TrueType字體的UMP(元素/單位)設置的很低,所以從現狀來看,TrueType字體的質量往往要低於OpenType字體。
而從TrueType轉換到OpenType格式是無損的,因為OpenType格式甚至可以不用把二次貝塞爾曲線轉換成三次貝塞爾曲線,而是直接包含TrueType的曲線。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△三次曲線轉二次曲線
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△UPM值低(左)與UPM值高(高)
抗鋸齒
這篇15000多字的文章,可能是最全面的字體基礎知識大全
字體的抗鋸齒通常是用次像素(亞像素)對字體像素做成調整,讓曲線在人眼中看起來更加平滑。
通常抗鋸齒渲染的次像素分為兩種,灰度的次像素和彩色的次像素。灰度的次像素是更為簡單和基礎的抗鋸齒方法,而彩色的次像素是根據LCD顯示器像素點的構成而設計的,目的是不僅僅控制圖像的最小單位:像素,還要控制組成像素的RGB子像素,如下圖顯示,灰度次像素只能降低整個像素的亮度,而彩色的次像素,黃色能夠關閉藍色的子像素的顯示,青色能關閉紅色像素顯示,這樣就能控制子像素了:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
微軟的ClearType是典型的使用彩色次像素抗鋸齒的技術,OSX上也有類似的技術。彩色的次像素能夠控制比灰度次像素更高實際顯示精度,這在屏幕單位尺寸解析度低的時候格外有效,而屏幕單位尺寸解析度較高的場合,效果相對於灰度次像素優勢就不大了,比如手機端,彩色次像素在手機上不僅會花更多性能和電量,在屏幕旋轉時還需要重新計算,而且手機屏幕單位尺寸解析度較高,所以目前手機上Android和iOS等系統都只是使用灰度次像素,只有曾經Windowsphone7里使用過ClearType。
彩色次像素的效果是完全依賴特定屏幕的(根據屏幕子像素排列順序),所以在PhotoShop這樣的繪圖工具中都是使用的灰度次像素而不是彩色次像素,因為製作出的圖片可能會在各種屏幕中展示,使用彩色次像素在一些屏幕中效果會很好,而另外的則會很差。所以使用彩色次像素的都在系統層,而且會根據檢測連接顯示器的型號或者用戶設置來保障效果:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△Windows顯示設置里的ClearType文本設置。實際上就是要你選擇你屏幕的子像素排列順序
Windows、OSX字體渲染差異
Windows和OSX的字體渲染差異一直是富有爭議,Windows和OSX的字體渲染完全是從兩種不同的偏好出發的,Windows的字體渲染追求在屏幕上清晰的像素表現,而OSX追求的是儘可能再現字體本來的外觀,這兩者的差別在於Windows下顯示字體很大程度依賴hinting(微調)來進行像素對齊,力求點對點顯示即使是要改變字體的外形。而OSX不依賴hinting,即使字體顯示到像素不是點對點而造成模糊,也不願意改變字體外形。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
可以明顯看到Windows下示例字體像素對齊更清晰、銳利但是代價是改變了字體筆畫,字體筆畫變細了,p字字碗上提的特徵也沒有了。OSX下示例字體由於沒有強制對齊像素所以邊緣較模糊,但是保留了字體的外形和筆畫特點。
應該說OSX的字體渲染策略在高解析度的屏幕下效果要比Windows更好,不過在較低低解析度下,Windows的字體渲染策略也有其優勢,能夠在低解析度下提高字體的易辨識度。不過也有很多問題,比如由於過於追求像素的對齊,很可能產生破壞性的字形改變:
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△Windows下字體渲染的問題,有的字體的m的像素對齊造成的字形改變過大
由於現在Mac都是高分屏,所以字體渲染比起大多都是低分屏的Windows要好的多,不過要是與高分屏的Windows相比,實際優勢不是特別大。
系統默認字體
桌面端
這篇15000多字的文章,可能是最全面的字體基礎知識大全
這篇15000多字的文章,可能是最全面的字體基礎知識大全
網頁端
微軟的網頁核心(Webcorefonts)字體,是微軟在1996年所發起的一個計劃,定義了一套基礎字體集以供網頁顯示之用,這些字體是Windows中會預置的字體,而且微軟提供免費的下載。這些字體直接使用在網頁中有很好的通用性。不過這並不是W3C的標準,所以也不能保證在不同系統都可用,具體各種字體在不同操作系統中的支持情況可以參考這個列表:fontmatrix
這篇15000多字的文章,可能是最全面的字體基礎知識大全
移動端
這篇15000多字的文章,可能是最全面的字體基礎知識大全
排版與標點
點號
點號作為語句的分隔符,表示語句的停頓或結束。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
標號
標號作為語句的標識符,起標示語句性質的作用。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
簡體中文使雙引號「」和單引號『』,繁體中文(台灣)和日文中相對應的是『』「」。
簡體中文中有時也會使用『』「」,與繁體的區別是,簡體中文裡嵌套的方法是先雙后單:『「」』在繁體(台灣)和日文中是先單后雙:「『』」。
在日文中『』還有書名號的作用(日文也有《》二重山括弧,但沒有固定用途,通常是標註漢字的假名),另外繁體(台灣)中除了乙類書名號(《》),甲類書名號是﹏﹏形式的下劃線。
西文引號
引號常見的有2種,直引號「」和彎引號「」
前者是直引號,是印表機時代的產物(可以用一個鍵表示引號),通常在傳統印刷領域,使用直引號「」會被當做是業餘者的行為。不過在網路時代,直引號的廣泛使用,讓人們已經習慣了直引號,甚至由於編程的代碼使用的都是直引號,在要表現IT技術的場合往往還會特意直引號。
這篇15000多字的文章,可能是最全面的字體基礎知識大全
△直引號用在傳統排版中被稱為Dumb(呆瓜)冒號
另外要注意的是引號的方向,在中文和英文中引號的方向都是朝內的:「」,而德文則是朝外的:Danish「,另外法文引號和中文書名號相似:franais,德文中也有使用法式引號的,不過方向相反:Danish
間隔號混淆問題
間隔號很容易混淆,簡體中文中的間隔號與為·,與英文中的一樣如:道格拉斯·理查·郝夫斯台特。
另外還有全形的間隔號:.如《禮記.禮運》。
在台灣的標準里所有間隔號都應該是全形的,而中國大陸的簡體中文裡兩種都可用,而且常常使用的是與英文一樣的半形形式。
還有一個是日文中的「中黑」:,其用法是用作分隔符,用在羅列詞是整體的情況下,如「北京台北間のホットライン電話」
這幾個間隔號混淆的問題在於驗證系統,比如驗證用戶名是否相同,很可能不同來源的名稱其實指的是一個用戶,只是用不同的系統、輸入法輸下輸入了不同的間隔符,由於中國少數民族眾多,名字中帶間隔符的不在少數,所以這是個值的注意的問題。
斜體
斜體在西文中是其強調的作用,通常表示要強調、引用的詞,還有書名號的作用。由於大部分情況下中文字體都只能用仿斜體,效果很差,所以盡量避免對中文使用斜體。
中西混排
中西文間隔
中文中出現西文,中文和西文間應該要有一定間隔,排版和文字處理工具一般都會自動在中西文間留有間隔,不過在更多情況下,需要手動的輸入空格來把中、西文隔開。
標點規則
在中西混排中,由於正文是中文,原則上應該使用中文標點,遵守中文標點的習慣用法。出現英文原句時,可以使用英文標點,再用中文引號標識出來。
段首空格
按傳統的習慣,段首應該留兩個空格,作為段與段之間的分隔標誌,不過現在數字排版時代,已經使用了段與段之間的間距很大,已經可以作為段與段之間的分隔標誌了,所以不需要段首空格了。