干貨：50個超好用的字體設計工具與資源

漂亮的字體設計總是招人喜歡的，感謝那些創(chuàng)造這些神奇設計技巧和工具的大神們，還有那些樂于分享他們所知的設計師。我們不斷地尋找優(yōu)秀的資源，進行編輯，并精心挑選其中最好的呈現給大家。接下來就為大家展示一些新鮮出爐的與字體設計相關的資源。

為了幫助大家改善字體在設計作品中的運用，我們在這里提供一些與字體設計相關的文章、工具以及資源。在這里可以學到字體設計的一些基本原則，學到如何將不同的字體結合起來，以及在選擇字體的時候需要注意的事項。我們也會展示與字體設計相關的幻燈片、相關術語、排版設計以及一些實驗。

 

字體設計：參考與資源

字體的分類——?The Taxonomy of Type

這篇文章的目的在于幫助設計師們識別不同字體的基本屬性。它解釋了不同字體的分類并且給出具體例子。是一篇簡短實用的文章。

 

 

Typedia:?共享的字體百科——Typedia: A Shared Encyclopedia of Typefaces

Typedia是一個對各種字體進行分類與連接的資源網站，一個幫助人們學習字體與字體分類的社區(qū)，是字體設計領域的維基百科與數據庫。任何人都可以加入其中，對網站上的頁面內容進行編輯與修改。

 

字體解剖與術語——Typeface Anatomy and Glossary

許多字體的名字當中都含有縮寫。其中一些縮寫與字體的形狀以及字體的格式有關，或者與設計特征以及制作有關。在Unzipped的 The Abbreviated Typographer中，你可以找到關于這些縮寫解釋的匯總列表。

 

排版符號中的小秘密——Typographic Marks Unknown

很多排版設計中使用到的符號大家都會覺得眼熟卻不知道其真正的含義。這些奇妙的小字符在作者們快速潦草的書寫中幸存了下來，并發(fā)展出一些妙趣橫生的進化史。現在這些符號在鍵盤與軟件中重生，卻很少被使用，這里就介紹了這些符號的來歷與它們的正確用法。

 

字體周期表——Periodic Table of Typefaces

一個靠譜的關于字體與字體類別的周期表。

 

IPAD&IPhone 字體——Fonts for iPad & iPhone

這里搜集了所有能在iphone, ipod touch 和 ipad上使用的字體。

 

字體解剖學（壁紙）——Font Anatomy (Wallpaper)

關于字體專業(yè)術語與小法則的基本介紹。如果你想知道字體不同部位的稱呼就來看看吧。

 

排版規(guī)則清單(PDF）——Typographic Rules Checklist

這個清單不僅包含了常用的排版規(guī)則與啟蒙教學，還可以作為排版設計過程中的要點提示。

 

排版設計注意事項(PDF）——Typography Checklist

由Jason Dewinetzlf編輯的一份關于排版設計的注意事項清單。在你開始新的設計項目或者打印新的出版物的時候可以參考一下。

 

聽說你要選個字體（信息圖表）——So You Need A Typeface (Infographics)

這個圖表會幫助你選擇符合你設計需求的字體。來看看如何前往你想要的字體。

 

找到最適合的字體

The Right Font for the Job

幾年前，當你選擇字體時，你可能會想是用TrueType還是PostScript,是Mac還是Windows。而現在，選擇就相對簡單些了：OpenType是最方便且功能最齊全的字體格式，并且能適用于各種平臺或打印流程。PostScript 和 TrueType中的不同規(guī)則都可以OpenType中共存。OpenType最大的好處?是它是一個跨平臺的字體格式。你不用轉換格式就可以在Mac或者Windows上使用它。

 

Erik Spiekermann 的排版錯誤提示——Erik Spiekermann’s Typo Tips

隨著桌面排版這個發(fā)明的出現，設計師們開始在自己的電腦上進行排版。在那之前，他們都是為排版工人設定好具體的要求然后把工作留給那些專家們。因此，即便是上好的印刷品質，大家還是能看到一些排版的錯誤。這篇文章中你可以找到Erik Spiekermann（FF Meta的設計師，Meta設計的創(chuàng)始人，‘Stop Stealing Sheep”的作者之一，FontShop創(chuàng)始人）提供的一些防止這些錯誤的提示。

 

13種看待字體的方式——Thirteen Ways of Looking at a Typeface

在我職業(yè)生涯的頭十年，我為Massimo Vignelli工作，他是一位能夠使用有限數量字體來進行創(chuàng) 作的傳奇設計師。從1980年到1990年，我的大部分項目都使用五種字體：Helvetica (naturally), Futura, Garamond No. 3, Century Expanded, 當然還有Bodoni。

 

為網頁選擇字體——Picking Type for Web

對于即將面世的MIX Oline的更新設計，為網頁選擇字體自然也是視覺設計的過程的一部分。我對
不同的字體都進行了實驗。要想找到一種字體既美觀又便于閱讀是很棘手的。

 

如何選擇字體——How To Choose A Font

你有沒有過被不知道選神馬字體的問題而困擾？其實大家都遇到過這個問題。這篇文章就是一個指導你如何選擇字體的導航。我最推薦的五本關于字體設計的書籍之一就是“The Non-Designers Type Book”（Robin Williams著），而這篇文章中提到的指標便是這本書里總結出來的。在你每次選擇字體的時候都可以看看這篇文章。

 

在字體選擇方面——On Choosing Type

字體設計不是一種科學，而是一種藝術。有些人喜歡把這門藝術科學化，他們認為大量的數據分析就可以激發(fā)出好的字體創(chuàng)意。但是這種香腸生產模式的心態(tài)只能生產出香腸。字體設計與選擇字體絕不是一種被公理與規(guī)則束縛的科學，而是一種令人喜悅的藝術。

 

字體的結合

基本原理：將Helvetica與其他字體結合——Fundamentals: Combining Type With Helvetica

在FontShop的基礎上，我們退出了Guest FontList。在建立這個表單的時候，我們咨詢了大家崇拜的專家來回顧一些有相同用法、風格和概念的字體。

 

四種混合字體方法——Four Ways to Mix Fonts

有沒有一種方式讓我們知道某些字體能否共存？建立一個對比模版是最直觀的方式，但是將一個字體發(fā)展成三個、四個甚至五個形態(tài)是很嚇人的。這里有4個關于如何在字體的海洋中安全航行的提示，這些提示都是基于H&FJ字體結合的高度科學第一原則：保持一個元素的一致，讓一個元素進行變化。

 

我是如何選擇字體的——How do I choose paring fonts ?

當我需要為我的項目選擇字體時，我總是依賴我的感覺并進行大量的測試，然后等待愛或恨的魔力來為我做決定。這個方法大部分時候是靠運氣的，而且很費時間，所以我決定在論壇上求助。

 

字體設計

OpenType初學者指導——Beginner’s Guide to OpenType

OpenType（簡稱OT）是一種跨平臺的字體格式，它包括了專業(yè)的設計元素，為字體提供了豐富的語言支持和先進的排版管理。使用OT技術你可以使用不同的方式為字體替換字形元素；連字符，大小寫，復古圖形，分段，上下標，序數，候補，斜體，等等。這篇文章會幫助你描繪一些在OT字體中常見的元素并告訴你它們應該被如何使用。

 

設計幾何形字體——Making Geometric Type Work

對于剛剛開始進行字體設計的平面設計師來說，一般都以幾何形字體或者模塊化字體作為起點。Illustraor以及其他軟件都提供一些簡單的元素例如圓形、方形、三角形等，這些元素都可以用來創(chuàng)建一些不錯的字母。當我對有限的商業(yè)字體感到厭煩是我就會用這個方法。我會扭曲每個字體特征，以使它符合一些簡單而嚴謹的框架中。這個方法總是能創(chuàng)造出一些奇特且易于辨認的字形。

 

我所知道的字體設計——A few things I’ve learned about typeface design

一位雷丁大學（UK）字體設計研究生講師的金玉良言。

 

案例學習：Vesper的制作——Case-Study: The Making of Vesper

這是一個由Vesper原創(chuàng)設計師提供的Vesper的制作過程。“Vesper的創(chuàng)作經歷了將近三年的過程。在這篇文章中，我將設計的過程分為2個階段：1）我在雷丁大學的學習過程中；2）我離開雷丁之后。希望這個經過高度濃縮但任然冗長的文章，能讓大家在我的設計過程中學到一些有趣的知識。”

 

字體與排版工具

Typelt：在線輸入方言標記、變音標記、特殊字母——TypeIt: Type accent marks, diacritics and foreign letters online

這網站可以幫助你輸入口音符號和一些特殊的標點字符。除了使用點擊按鈕來添加符號外，你還可以使用預設好的快捷鍵，例如Ctrl+N：只需要將鼠標指在目標字符上你就可以看到工具提示。

 

網絡字體標本——Web Font Specimen

由于字體在敏感的CSS上會有些許不同的呈現，在設計師為設計項目購買字體前，看到字體以不同的方式呈現對網頁設計師有很大的幫助。

 

排版設計：比例與韻律——Typograph: Scale & Rhythm

這不僅是一篇論文，同時也是一個工具。在探索兩個或多個交織在一起的概念的過程中，又是會有趣，但有時會很棘手，這個網頁就可以幫助你使字體更有活力。移動在標尺上的顏色方塊來更改這些文字。說到底，這些文字都只是劇本，如何表演還要看你。

 

TextMod 2.1

不同于一般文本生成器，在TextMod中你可以自由地對文段進行編輯來對字體進行測試，并使它符合你想要的設定。你的TextMod設定會被存儲在cookie里面。不過到目前為止，TextMod只適合編輯拉丁語與亞美尼亞語。

 

Readability

Readability是一個簡單的書簽小工具。它可以移除網頁上一些雜亂的元素，使你在閱讀的時候更能享受其中的樂趣。

 

免費XHTML/CSS字體排版——Free Typographic XHTML/CSS-Layouts For Your Designs

這個網站上發(fā)布了一些以(X)HTML/CSS為基礎的字體與模版，由一些設計社區(qū)創(chuàng)造并發(fā)布在這里讓大家免費使用。

 

鍵盤排版工具——Typography Keyboard Layout

這個小工具可以讓你輕松輸入一般鍵盤上沒有的字符的。希望它可以幫你實現更好的設計作品。

 

字體家族——{ font-family }

這是一個為網頁開發(fā)員與設計師們準備的資源。它會為你推薦CSS中適合使用的普通字體的替代品。

 

EmChart

這個小工具將你的字體的基本尺寸與子元素的比例陳列出來。

 

MyFontbook, 一個無瀏覽器限制的免費字體預覽工具——MyFontbook, A Browser-Based Free Font Viewer

MyFontbook是一個免費的工具，可以幫助你通過瀏覽器來預覽、分類、整理那些安裝在你電腦系統(tǒng)中的字體。

 

字體搜索器——Font Finder

FontFinder是為設計師、開發(fā)員與排版師而生的。它允許用戶在任何一個頁面上分析任何元素上的字體，復制任何字體信息到剪貼板上，也可以提供替換字體來對新的排版進行測試。

 

Unicode代碼表格——Unicode Codepoint Chart

這個表格根據不同類型的元素與標志（還有語言）進行劃分，每個分類下都有視覺參考。在這里，只需要點擊你想要的符號或字符就可以進入到關于它細節(jié)信息的頁面，并且可以在瀏覽器中進行頁面測試，還有輪廓（SVG格式），一系列編碼以及字符組合（HTML entity, UTF-8, UTF-16,?UTF-32, ISO-8859-8等）。

 

@font-face字體生成器——Create Your Own @font-face Kits

這是一個在線生成字體的套裝工具。

 

XHTML字符實體參考——XHTML Character Entity Reference

這個網站包含了252個可以在HTML4和XHTML1.0中使用的字符，并概括了24個HTML4的標準規(guī)范，由W3C發(fā)布。

 

HTML字符辭典——HTML Entity Character Lookup

使用HTML字符可以保證你的網頁上所有的元素都是有效的。但是想要從250個元素中找到與字符對應的代碼卻很麻煩。這個辭典可以幫助你通過字符的外形來搜索。

 

CopyPasteCharacter.com

你可以在這個網頁上復制單個或多個特殊字符，并把他們粘貼到你的應用程序上。

 

調查研究

字體設計樣板和實踐——Typographic Design Patterns and Best Practices

盡管在CSS中的字體選擇有限，但在排版的時候還是會出現很多變化。用Serif還是sans-serif，每行的高度，間隔，字體尺寸，等等因素。

 

使用ClearType和普通顯示的視覺搜索與閱讀——Visual Search and Reading Tasks Using ClearType and Regular Displays

這是一篇將ClearType于普通顯示的呈現進行對比的學術論文。結果是：對大部分用戶而言，ClearType很大程度上改善了肉眼閱讀的質量。

 

字體術語的調查結果——‘Font’ vs. ‘Typeface’: font terms survey results

在這次的調查中，大部分的觀點認為在電子字體中“typeface”的含義是字體設計，其中包括它的風格，但不包括它的形成過程，而“font”的意思是單個字體的形狀，例如某個格式的Myriad粗體，斜體等。不過，這也可能不準確。

 

Font or Typeface?

這是集合了在FontFeed上的多個作者編輯的一份設計指導。我們認為在談論排版與字體設計等相關話題時應該使用相同的術語。由于這些專業(yè)術語在經過相當長的一段時間并經過了一些技術改革后，已經有了變化，它們有時會被解讀為不同的意思。這就導致讓大多數人認為這些專業(yè)術語難理解或者令人感覺困惑。

 

漂亮實用字體設計的規(guī)則

網頁字體設計導航——A Guide to Web Typography

網頁字體設計自從1991年Time Berners-Lee開啟了個開關后便經歷了很漫長的旅程?；叵氪蠹疫€使用IE 1.0的時候，好的網頁字體設計簡直就是一種奇跡。但是現在就不同了。我們不僅擁有支持圖片顯示的瀏覽器，我們還有機會通過驚艷的字體設計為網頁賦予生命。

 

 

漂亮字體設計的原則——The Principles of Beautiful Typography

對大部分人來說，字體只是能夠組成詞語、句子、段落的一些簡單而又熟悉的形狀。自從能夠通過簡單的在鍵盤上敲擊來進行輸入后，大家都快把字體這種兼具創(chuàng)造性和藝術性的媒介給遺忘了。

 

什么是字體設計？——What is typography today?

大部分人認為字體設計就是畫畫圖，選選字體。如果要這么說的話，那建筑學也不過是畫畫圖和選選家具。實際上字體設計與建筑學都不是一種目的，而是一種到達目的的方式。建筑的目的是讓居民們在其中舒適的居住，而字體的目的是放松人們的頭腦，讓讀者輕松的閱讀，讓觀看者舒適的觀看，并吸引他們的注意力。

 

麻煩的字體鋸齒處理——The Ails Of Typographic Anti-Aliasing

當印刷界的字體享受著高DPI的待遇，炫耀地展示著優(yōu)美的曲線與微妙的細節(jié)時，屏幕上的字體還在苦逼的忍受著笨重的像素、煩人的鋸齒、扭曲的字型以及削減的襯線。在顯示器廠家生產出大家買得起的200或300PPI顯示器之前，我們還是要用軟件來解決這些問題。

 

由字體啟發(fā)的界面設計——Type-Inspired Interfaces

在接到新的項目時，最令我感到恐懼的事之一就是如何著手。如何布局內容？該選什么顏色？一旦這些事定下來，之后的設計就變得簡單的。但是空白的頁面還是花費我最多的時間。最后我都會從選擇字體開始入手。

 

CSS與字體的植入

修改后的字體堆——Revised Font Stack

大家為了使完善網頁設計完善和獲得更多優(yōu)秀字體而做了很大的努力。但是大部分設計師還是愿意選擇安全型的字體：Verdana,Georgia,Times New Toman, 還有Arial. 雖然選擇有限，但還是可以在這些預裝的字體中探索到新的可能。

 

成為字體嵌入大師——Becoming a Font Embedding Master

我在最近的幾天中嘗試使用@font-face找出最好的嵌入字體的方式。這門黑暗的藝術必須被征服。這絕不是一個簡單的過程。

 

網頁字體用戶指南——Web Font User Guide

為設計師、開發(fā)者與系統(tǒng)管理員準備的參考指南。它揭示了如何使網頁字體在你的網頁上程序。同時也涵蓋了需要更改哪些設定才能成功的使用網站服務器提供網頁字體。

 

靈光一現：展示與博客等

我們愛字體藝術——we love typography

一個關于字體設計、印刷、標志設計的展示。

 

發(fā)現——FINDINGS

一個收集漂亮字體的博客。

 

字體/平面海報——typo/graphic posters

一個展示字體設計與平面海報的網頁。

 

城市字體設計之旅——The Journal of Urban Typography

TJOUT專注于收集與研究在城市環(huán)境里那些有特別用意的標志、字體碎片、字體設計。

 

壓痕印刷：一個讓人激動的印刷品集合——Pressing Letters: A Collection of Inspirational Letterpress

這個項目的目的是將已完成的作品進行分類，并以此來激發(fā)大家的創(chuàng)造力。任何人都可以上傳他們的字體設計作品、參考指南、小建議等。這個網頁上有很多不同的小目錄，包括，名片、書籍、日歷、形象設計、音樂包裝、文具與海報。這是一個絕對值得收藏與光顧的博客。

 

最新字體設計新聞——Alltop: Top Typography News

一個字體排版設計新聞、文章、工具的集合點。

 

最后點擊：字體設計相關的游戲

字體訓練師——FontTrainer

一個幫你識別不同字體細微差別的有趣的小工具。

 

將你的個性總結在一個字體中——Your Personality, Summarized in a Typeface

如果你曾經與字體設計師一同工作，你會發(fā)現他們很少單純的討論字體的美觀或功能性。他們一般會討論這個字體是否有魄力，或者是否讓人感覺平靜，或者是否有親和力。實際上，他們在討論字體的個性。這其實是有道理的，你的個性也可以在字體中展現。Pentagram就是這樣一個可愛的小網站。想不想測一測你是什么字體？

 

TypePong

TypePong是一個現代化的復古Iphone游戲。用自己喜愛的字體來玩乒乓球，你也可以跟朋友對戰(zhàn)或者挑戰(zhàn)世界排名。

 

深度字體挑戰(zhàn)——Deep Font Challenge

你是一個厲害的字體射擊大師，還是一個連Futura都拼不出來的小白癡？為了證明的設計知識，射擊字體靶子，根據命中率與射擊速度來計分，但是提醒你，在游戲當中桌面會旋轉，要注意哦~。

翻譯：翻茄匠，@XuHY_____
原文：smashingmagazine