成人午夜激情影院,小视频免费在线观看,国产精品夜夜嗨,欧美日韩精品一区二区在线播放

網(wǎng)頁(yè)在各平臺(tái)都顯示為最高質(zhì)量的黑體的方法

2013-11-27 14:24:06來(lái)源:知乎作者:梁海

我確實(shí)認(rèn)為在目前常規(guī)的顯示屏上(臺(tái)式機(jī)、筆記本電腦、iPad……)還是必須用黑體才能保證正文字號(hào)的中文清晰易讀。(這里的「黑體」當(dāng)然指的是字體的一類風(fēng)格,并非 Windows 自帶的那個(gè)自稱「黑體」的「中易黑體(

我確實(shí)認(rèn)為在目前常規(guī)的顯示屏上(臺(tái)式機(jī)、筆記本電腦、iPad……)還是必須用黑體才能保證正文字號(hào)的中文清晰易讀。(這里的「黑體」當(dāng)然指的是字體的一類風(fēng)格,并非 Windows 自帶的那個(gè)自稱「黑體」的「中易黑體(SimHei)」,中易黑體沒(méi)法用作正文字體,頂多在標(biāo)題等大字號(hào)場(chǎng)所可以利用一下)。我不喜歡點(diǎn)陣宋體。 

所以,一般來(lái)說(shuō),我們確實(shí)需要保證自己的網(wǎng)頁(yè)設(shè)計(jì)在各平臺(tái)顯示時(shí)都能用上各平臺(tái)最佳的黑體。這需要一點(diǎn)分析,以及對(duì) CSS 的 font-family 屬性的一點(diǎn)了解。 

一、各平臺(tái)最佳正文字體現(xiàn)狀: 

  • Windows 
    Windows 在 Vista 之前都以中易宋體(在 Windows 里顯示為宋體,英文名是 SimSun)為簡(jiǎn)體中文默認(rèn)字體,正文字號(hào)時(shí)為點(diǎn)陣字體,尚可接受,但字號(hào)稍大就奇丑無(wú)比。中易宋體沒(méi)有粗體,它的西文部分也完全沒(méi)法用。 
    從 Vista 開始,微軟提供了微軟雅黑作為新的簡(jiǎn)體中文默認(rèn)字體,這款字體跟上了時(shí)代,但褒貶不一。微軟雅黑有粗體,西文部分達(dá)到了 Windows 的水準(zhǔn)。自己的網(wǎng)頁(yè)設(shè)計(jì)中要不要用微軟雅黑來(lái)顯示正文——這是一大抉擇。注意,決定用不用微軟雅黑時(shí)要考慮到 @pansz 說(shuō)的 ClearType 問(wèn)題:有一些 Windows 平臺(tái)(包括一些 Windows XP)會(huì)因?yàn)榉N種原因擁有微軟雅黑但卻沒(méi)開 ClearType,此時(shí)微軟雅黑的效果是很糟糕的。 
    Windows 的主要問(wèn)題在于字體渲染技術(shù)極其落后,所以字體渲染效果非常受限。
  • Mac OS X 
    OS X 一直用華文黑體作簡(jiǎn)體中文默認(rèn)字體,這個(gè)字體族有常規(guī)體和粗體,西文部分很差勁(和中易宋體西文差的原因倒還不太一樣)。 
    從 OS X 10.6 開始,系統(tǒng)自帶了冬青黑體簡(jiǎn)體中文(該字體在 10.7 以前沒(méi)有中文名,叫作Hiragino Sans GB)。這款字體至今沒(méi)有成為系統(tǒng)的簡(jiǎn)體中文默認(rèn)字體,但它是目前 OS X 最好的簡(jiǎn)體中文字體。 
    OS X 的字體渲染技術(shù)顯然是目前所有操作系統(tǒng)中最佳的。 
    另外,OS X 還有一款叫 Hei Regular(family name 是「Hei」)的老舊字體——絕對(duì)不要再用它了,除非你知道自己在干什么。
  • iOS 
    自帶華文黑體。
  • GNU/Linux 
    Linux 社區(qū)常用的簡(jiǎn)體中文介面字體似乎主要有文泉驛點(diǎn)陣宋體、文泉驛正黑和文泉驛微米黑,另有一些人把 Windows 或 OS X 的字體復(fù)制過(guò)去用。文泉驛點(diǎn)陣宋體類似于 Windows 的中易宋體,而文泉驛正黑是在無(wú)自由黑體可用的情況下被迫制作的質(zhì)量不太高的黑體。文泉驛微米黑是Linux 社區(qū)現(xiàn)有的最佳簡(jiǎn)體中文界面字體,但它沒(méi)有粗體。但因?yàn)槲娜A微米黑的質(zhì)量也沒(méi)有絕對(duì)優(yōu)勢(shì),加之 Linux 各發(fā)行版的情況非;靵y,所以或許不指定字體最好。 
    各 Linux 發(fā)行版默認(rèn)的字體渲染效果參差不齊,成熟一些的(比如 Ubuntu)在某些方面會(huì)略強(qiáng)于 Windows。
  • Android 
    自帶 Droid Sans。文泉驛微米黑由 Droid Sans 衍生而來(lái),主要擴(kuò)展了它的中文部分(Droid Sans Fallback)。

二、所以,為網(wǎng)頁(yè)設(shè)定字體時(shí)有以下目的需要達(dá)成: 

  • 對(duì)于 Windows:在中易宋體和微軟雅黑之間二選一,加粗和較大字號(hào)的文本使用微軟雅黑。沒(méi)有微軟雅黑的系統(tǒng)會(huì) fallback 到中易宋體。
  • 對(duì)于 OS X:盡量使用冬青黑體簡(jiǎn)體中文。沒(méi)有冬青黑體簡(jiǎn)體中文的系統(tǒng)會(huì) fallback 到華文黑體。
  • 對(duì)于 iOS:系統(tǒng)會(huì)自動(dòng)使用華文黑體。
  • 對(duì)于 Linux:盡量使用文泉驛微米黑。沒(méi)有文泉驛微米黑的系統(tǒng)會(huì) fallback 到別的字體。
  • 對(duì)于 Android:系統(tǒng)會(huì)自動(dòng)使用 Droid Sans。

三、要達(dá)到以上目的,CSS 的 font-family 屬性可以這么寫(中文字體之前的「…」代表西文字體,根據(jù)自己的口味選擇就好,比較自由): 

  • 控制(為 Windows 選擇微軟雅黑,為 Linux 選擇文泉驛微米黑): 
    font-family: … "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; 
    為什么不把中易宋體(SimSun)、華文黑體(STHeiti〔10.6 之前〕或 Heiti SC〔從 10.6 開始〕)和 Droid Sans 寫出來(lái)?因?yàn)樗鼈兪窍到y(tǒng)默認(rèn)字體,以上字體都沒(méi)有的話就會(huì)自動(dòng)調(diào)用。除非你的用戶中很多人的系統(tǒng) locale 都不是中文,否則不必寫出 STHeiti 之類(如果要寫,請(qǐng)把它寫在 Hiragino Sans GB 和 Microsoft YaHei 中間)。中易宋體(SimSun)盡管身為宋體,在 Windows 中卻也是簡(jiǎn)體中文 的默認(rèn) sans-serif 字體。
    注意:把冬青黑體簡(jiǎn)體中文(Hiragino Sans GB)放在這么前面會(huì)在某些情況下出問(wèn)題,詳見第四部分。
  • 自由(僅在 OS X 上盡量使用冬青黑體簡(jiǎn)體中文,放任其他平臺(tái)使用默認(rèn)字體): 
    font-family: … "Hiragino Sans GB", sans-serif; 
    這個(gè)方案沒(méi)法控制 Windows 到底用中易宋體還是微軟雅黑,于是正文字號(hào)的效果或許見仁見智,但大字號(hào)時(shí)如果用的是中易宋體就非常難看了,所以可以為 Windows 把所有大字號(hào)文本的 CSS改成「最強(qiáng)控制」的那個(gè)方案。
    注意:把冬青黑體簡(jiǎn)體中文(Hiragino Sans GB)放在這么前面會(huì)在某些情況下出問(wèn)題,詳見第四部分。

不要輕易在 font-family 屬性里寫上中易宋體(SimSun)。因?yàn)槿绻銓懥怂瑸榱吮苊獍惭b了 Office 的 OS X 調(diào)用它來(lái)顯示,你就得把冬青黑體簡(jiǎn)體中文和華文黑體都列在它前面。而把中易宋體(SimSun)和華文黑體這樣的系統(tǒng)默認(rèn)字體寫出來(lái)實(shí)在是沒(méi)有必要。 
不要輕易把中文網(wǎng)頁(yè)的 font-family 寫成以「serif」結(jié)尾,因?yàn)槿绻谐龅淖煮w都沒(méi)有,系統(tǒng)會(huì)按照「serif」的指示去用歸于 serif 的中文字體——比如 OS X 會(huì)用華文宋體,太細(xì)了,效果實(shí)在不好。 

基于上面提到的這兩個(gè)方案,還有各種中間形態(tài)可以選擇。而 @崔凱 提到了另一個(gè)常見方案:font-family: … sans-serif; ——即完全由各平臺(tái)自己決定使用什么中文字體。這是很常見的方案,其實(shí)也是最成熟的方案,豆瓣、知乎等網(wǎng)站都是如此。但因?yàn)檫@個(gè)方案和這個(gè)問(wèn)答的初衷不符,所以我沒(méi)有把它列入討論范疇。 

四、另外: 

@厲向晨 提出了一個(gè)重大問(wèn)題:如果把冬青黑體簡(jiǎn)體中文用作 font-family 的第一個(gè)中文字體,對(duì)于安裝了冬青黑體簡(jiǎn)體中文的 Windows 用戶來(lái)說(shuō),因?yàn)?Windows 對(duì) PostScript 輪廓的字體渲染得很糟糕,效果會(huì)幾乎沒(méi)法閱讀;而如果把微軟雅黑放在冬青黑體簡(jiǎn)體中文前面,微軟雅黑在 OS X 里的渲染效果起碼可以接受。

目前 Windows 里的情況比較亂,IE9+ 可以識(shí)別系統(tǒng)里安裝的冬青黑體簡(jiǎn)體中文,而較新版本的 Firefox(@顧軼靈 說(shuō)是 4+)能部分識(shí)別(似乎會(huì)分不清字重),其他瀏覽器/內(nèi)核不行(必須用 PostScript name 才能識(shí)別)。所以,對(duì)于正文,最好針對(duì)不同的平臺(tái)分別指定 font-family;對(duì)于大字號(hào)標(biāo)題(尤其粗體)倒不必?fù)?dān)心。

其實(shí),如果你的網(wǎng)站可以判斷 UA 來(lái)針對(duì)各平臺(tái)提供不同的 CSS,那么以上的排序問(wèn)題就沒(méi)那么復(fù)雜了。根據(jù)以上分析,為各個(gè)平臺(tái)指定你想要的字體就好。

應(yīng)當(dāng)注意的 WebKit 怪癖:如果你將西文字體設(shè)置為 Georgia 之類的 serif 字體(即,與列表后面的 sans-serif 中文字體不屬一類),且 WebKit 內(nèi)核的 UA(Mac OS X 的 Safari 是個(gè)典型)找不到你指定的任何中文字體,可能會(huì)導(dǎo)致 UA 用系統(tǒng)默認(rèn)的 serif 中文字體。比如,如果 Mac OS X 的 Safari 遇到了「font-family: Georgia, , sans-serif;」,就會(huì)用華文宋體顯示中文。所以某些情況下你可能有必要加上「STHeiti」。

原文地址:http://www.zhihu.com/question/19911793

關(guān)鍵詞:網(wǎng)頁(yè)字體
主站蜘蛛池模板: 家居| 霞浦县| 云林县| 延吉市| 大宁县| 六安市| 喀喇| 西丰县| 南城县| 贺州市| 云阳县| 新晃| 胶南市| 青浦区| 资源县| 建瓯市| 高州市| 裕民县| 大英县| 乌海市| 鄢陵县| 同心县| 林西县| 双江| 达拉特旗| 邵武市| 乌拉特中旗| 东阿县| 太谷县| 康乐县| 三台县| 奉新县| 广平县| 微博| 德兴市| 商南县| 新干县| 驻马店市| 平泉县| 东乡族自治县| 韶关市|