2009/6/15

@font-face 的問題?

之前就在實驗 @font-face 動態連結字型的問題,中文會遇到的問題比英文多,略列如下:

  1. 中文字型檔好肥,多在 8MB 之譜,加上
  2. 自由的字型也超少,還有
  3. 據說 Safari 目前的實作方式是,等下載完動態連結字體才顯示出來,請想像使用者在開啟網頁、另外開小遊戲玩了十來分鐘以後終於看到網頁文字的感覺。

第二個問題無解,要就自己刻,不然就去談;第三個問題目前無解,我覺得這樣實作很詭異… 完全沒考慮字型檔很大的情況要怎樣讓使用者「接受」;第一個問題目前看起來解法有二:

  • 用小一點的字體,例如 Droid Sans Fallback 大概是 3-4MB,「或許」你可以接受… 吧
  • 使用unicode-range指定要下載的範圍,僅下載需要的文字
  • 用不知道何年何月會出現的動態組字技術,不是為了拼罕見字、而是為了拼出字型

Safari 已經支援 unicode-range,所以至少我們有個瀏覽器可以試試看效果如何(我還沒試)。有另一個問題是,我怎麼知道我用了哪些字範圍要從哪裡到哪裡?unicode-range 規格上可以指定多個不連續範圍、而不是笨笨的只能從 A 到 B,所以我的想法是可以弄個小程式動態去掃自己網頁上的文字,指定一個最佳範圍給你。

不過這樣在 Safari 裡好像還會有一個要測試的問題:假設要這樣搞,我勢必要利用 JavaScript 在網頁讀取完畢後掃描網頁文章、escape 後判斷出範圍,接著也以 JavaScript 指定 @font-face 需下載範圍。但剛才說 Safari 要讀完字型才給看文字… 這樣會不會發生我指定完範圍結果套不上去的慘劇?

結果到最後好像還是要利用 Flash 或 圖片 (爆炸)

3 則留言:

  1. MS的eot就有提供工具來處理第一個問題……方法也就是你說的掃描網頁並抽需要用到的字碼。不過當然這東西目前不是動態的,對於現代的網站來說實用性比較有限。如果eot有機會成為標準(MS去年把eot規格送W3C審議,字型廠商贊成,其他瀏覽器廠商反對)的話,也許也會有人開發出動態抽字的辦法吧。

    回覆刪除
  2. 謝這篇文章..果然被我猜對了..拜託..英文字母只有 26個..中文字有幾萬個..常用字也有 5000個..這種技術根本不可能給中文字用..是給拼寫文字用的

    回覆刪除
  3. 這種技術搭配抽字還是可以給中文字用的,本文其實就是為了要說明中文字使用上的可能解法,而且也已經有廠商解了。

    回覆刪除

歡迎留下您的意見