寫在這篇文章之前：中文網(wǎng)頁字體的窘境

在國外的設(shè)計師幸福地討論著如何不用圖片進(jìn)行字體替換時，當(dāng)Google Proudly地提供越來越多的web fonts時，使用中文的網(wǎng)頁設(shè)計師只能發(fā)出一聲嘆息。中文世界的網(wǎng)頁字體窘境，不僅僅是由于中文符號過多造成的字體文件過大這樣的技術(shù)阻礙；更深一層的原因是，根本就沒有幾種可用的好字體。

一方面，盡管一些中文字體提供商也在致力于提供不同平臺的解決方案，字體價格還是貴得令人乍舌，方正字庫的年費高達(dá)萬元，這對普通設(shè)計師來說很難承受。另一方面，制作中文字體是吃力不討好的事，幾千個符號和26個拉丁字母完全不在一個量級上；使用正版在中國一直是會呼吸的痛，花大力氣做出來的字體，拿不到多少錢，這又降低了制作好字體的積極性。

中文網(wǎng)頁的常用字體，過去只有“宋體”，現(xiàn)在微軟增加了“雅黑”，但“雅黑”還算不上安全字體。在迫不及待地使用雅黑時，我們?nèi)匀灰�注意降級問題。由于雅黑的字體大小、字距和宋體都有區(qū)別，我們需要注意降級后，各個用戶代理在排版上可能出現(xiàn)的問題。

使用非標(biāo)準(zhǔn)字體，最好的方案依然是圖片替換。關(guān)于圖片替換術(shù)已有許多文章論述，方法也各有優(yōu)劣，需要注意的關(guān)鍵點是：

1 可用性：注意在無CSS或無圖片的情況下，依然能保證文檔內(nèi)容的完整性。盡量減少額外無意義的標(biāo)簽。

2 圖片負(fù)載：利用GIF、PNG8、JPG各自的特點，有針對性地制作替換圖片，能有效地減少不必要的圖片尺寸。在幾種格式中，首推PNG8，即使在IE6中它的透明背景也能被正確顯示。PNG8使用的技巧是，輸出時把“雜邊”設(shè)置為和背景接近的顏色。

總而言之，中文網(wǎng)頁的字體，還沒有接近完美的解決方法出現(xiàn)。就像下面這篇文章會告訴我們的，完美不值得等待，只有積極地采用更新的技術(shù)，創(chuàng)造更好的作品。而無論中英文字體，是否采用非標(biāo)準(zhǔn)字體永遠(yuǎn)只是一個技術(shù)問題，更重要的是設(shè)計師對字體的理解。我們能否理解每一個字符方寸筆畫之間的蘊含的意味，并適當(dāng)?shù)赜迷谠O(shè)計中，這是我們這些相對落伍的中文世界設(shè)計師要艱難完成的任務(wù)。

正文：

受夠了Arial？厭倦了Times New Roman？ 文字替換術(shù)（font-replacement methods）在過去的兩年中發(fā)生了顯著的改善，但如果你沒有持續(xù)關(guān)注這項技術(shù)，往往很難說出這些方法有什么不同。這篇文章將討論現(xiàn)今可用的不同的文字替換技巧。

我們將探討每種技術(shù)的優(yōu)點和缺點，字體使用授權(quán)，以及網(wǎng)絡(luò)上最好的字體資源，以便于你能在自己的網(wǎng)頁設(shè)計中開始使用它們。

入門：字體替換術(shù)

Since the beginning of the web， designers have been restricted to a limited number of fonts

從網(wǎng)頁誕生之初以來，設(shè)計師們一直被有限數(shù)量的字體所束縛。

網(wǎng)頁設(shè)計的潛力看起來正在一天天地增長。HTML5，CSS3和Javascript這樣的技術(shù)應(yīng)用帶來了很多令人驚喜而有創(chuàng)造性的網(wǎng)站設(shè)計。從純文本的瀏覽器時代以來，網(wǎng)頁已經(jīng)走過一段很長的路。盡管如此，網(wǎng)頁設(shè)計中仍然有一個領(lǐng)域相對而言依然停滯不前。

在任何設(shè)計師的“兵工廠”里，要創(chuàng)造網(wǎng)站的外觀和“感覺”，排版和字體選擇是不可或缺的元素。不幸的是，自網(wǎng)頁誕生之初，設(shè)計師們一直被有限數(shù)量的字體所束縛。能被大多數(shù)的網(wǎng)頁用戶正確顯示，設(shè)計師能安全地使用的，還能讓人提起興趣的字體是極少的，Helvetica，Arial和Georgia是其中的三種（別忘了Comic Sans）。

為了擺脫這種限制，用字體來表達(dá)創(chuàng)意，設(shè)計師使用的傳統(tǒng)方法是把文字合并到圖片中——然而這種方法有許多的缺點。增加了很多可用性問題，并隨著加載時間增加，網(wǎng)站的性能也相應(yīng)地受到負(fù)面影響。

這篇文章會探討一些在網(wǎng)頁中不用圖片加入非標(biāo)準(zhǔn)字體的方法。我們會看到每個方法的優(yōu)點和缺點，字體的使用授權(quán)，以及這項技術(shù)對網(wǎng)頁設(shè)計師到底意味著什么。

Cufón

要在網(wǎng)頁中加入非標(biāo)準(zhǔn)字體，使用Cufón是一個簡單、有效得難以置信的辦法，它的功能不需要依賴服務(wù)端的語言或插件。Cufón只需要幾行Javascript代碼就能工作，它使用HTML5的畫布特性渲染字體，并為Internet Explorer使用VML（Vector Mark-up Language向量可標(biāo)記語言）渲染字體。

Cufón在主頁上提供了一個字體轉(zhuǎn)換工具，它能將你選擇的字體轉(zhuǎn)換為SVG，并為你創(chuàng)建一個Javascript文件，你需要在html中引用它。Nettuts+的Jeffrey Way曾寫過一篇關(guān)于如何在你的網(wǎng)頁中集成Cufón的step-by-step優(yōu)秀教程。

Cufón對很多網(wǎng)頁設(shè)計師來說是一個很流行的選擇，因為它有許多優(yōu)點，相對來說幾乎沒什么缺點。它不依賴其它腳本語言或插件，這意味著它對相當(dāng)大部分受眾都是可用的，并且被近期所有的主流瀏覽器所支持，包括IE9。你還可以直接對Cufón替換的文字應(yīng)用CSS樣式，包括比較新的CSS3特性，例如漸變�？紤]到速度，它比sFIR要快得多，而且沒那么密集，但它仍然不應(yīng)該被用在主體的大段文字上。

優(yōu)點：

不同的瀏覽器間很不錯的兼容性

可以在你的字體中的只包含字符里的特定集合（ABC，123，等等），以便于控制文件體積。

CSS字體樣式在所有的瀏覽器中都能保持（顏色、尺寸、陰影??）

缺點：

文字無法選擇

表現(xiàn)：最好在頂部、標(biāo)題和副標(biāo)題中使用

特別的樣式（文字修飾、翻轉(zhuǎn)等）需要一些額外的工作。

標(biāo)簽： 網(wǎng)頁設(shè)計師 網(wǎng)頁字體 字體替換 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。