PIECE2巨群
網頁設計 ‧ 平面設計 ‧ 虛擬主機 ‧ 網路行銷
最新消息
資訊分享
關於我們 服務項目 客戶案例 製作流程 虛擬主機 聯絡我們
MAC下的網頁設計中文字體優化

最近某人吐槽某門戶網站在MAC下Chrome瀏覽器字體超醜,然後發現雖然現在MAC用戶越來越多,但是大家依然無視MAC下的字體差異,於是研究了下MAC下網頁設計中的中文字體,和大家分享。

看了一遍國內各大門戶和SNS網站,雖然可能大家的font-family設置都不太一樣,但是貌似現在只有QQ空間對MAC下字體做了優化。

ok,言歸正傳。

MAC和Windows自帶的字體非常不一樣,所以,針對Windows的font-family設置一般不適用於MAC系統,而在mac下,會調用系統默認的細黑體(STXihei),而這個字體渲染的其實並不是很好看。

優化的方法有兩個:


方案一:使用Hiragino Sans GB字體

目前它是MAC系統下自帶的比較好看的黑體字體之一,比較適合網頁設計渲染,也廣受歡迎。

比如QQ空間的字體設置為:

.os_mac {font-family: "ff-tisa-web-pro-1","ff-tisa-web-pro-2","Lucida Grande","Hiragino Sans GB","Hiragino Sans GB W3";}

前面三個字體為英文字體。


方案二:使用-webkit-font-smoothing:antialiased

當然這個只是webkit私有屬性,Firefox和Opera等流覽器不能使用——其實MAC版Firefox 的字體渲染比Webkit要好看一點兒。


總結

那麼,到底那種方案好一些呢?

如果你想偷懶,就只需要添加-webkit-font-smoothing:antialiased就可以了,最求最佳效果,就兩個都用上:P

如果你又更好的方案,歡迎提供。

 


轉貼來源:前端觀察 - 前端觀察專注於網站前端設計與前端開發

 


參考文獻:

1.戴軒廷、馬恆、張紹勳 (2004), 衡量網路廣告態度之指標建構, 台灣管理學刊, 4(1), 59-84.

2.李青蓉等編著.(1998).人機介面設計,台北縣:空大。

3.邱柏清.(2004).網頁介面愉悅行之研究,國立台灣科技大學設計研究所碩士論文。

 
返回列表
上一頁 下一頁


相關文章

回應式網頁設計
網頁設計要根據企業風格慎選配色
為你的網頁設計開發後,並代管網站來增加收入
虛擬主機的簡要說明介紹
介紹在平面設計中的職業


最新文章

HVACKer:入侵隔離網絡的新型攻擊技術
還有什麼不會被入侵?路由器 LED 燈已成為攻擊入口
美 5 家獨角獸同天申請 IPO 掛牌,最狂的是一家估值 124 億美的數據分析新創!
【台灣「智慧產業」開始佈局】緯創集團領投跨國 AI 新創 iKala,下一步拓展東南亞市場
快可以用手機遠端遙控你的所有家電了



 
PIECE2巨群 版權所有 © 2008 總公司:06-2895301 台北:02-82529838 台中:04-25152530 高雄:07-7931226
驗證 CSS 驗證 W3C
專精項目:網頁設計   網站設計   平面設計   包裝設計   關鍵字行銷   關鍵字排名   網路行銷   網站代管   虛擬主機   ERP系統