回覆列表
-
1 # 網際網路電商時代
-
2 # 聚搜圖
排名前10的字型下載網站:
1,DaFont --字型庫
2,MyFonts --字型商城
3,1001 Fonts --免費字型
4,Font Squirrel --免費商用字型
5,1001 Free Fonts --字型下載
6,UrbanFonts --免費字型
7,FlamingText --根據字體制作LOGO
8,Fontspring --字型交易
9,FFonts --免費字型下載
10,Free-Fonts --免費字型搜尋下載
我比較熟悉英文,一個一個字型說:
Sans-serif
Helvetica: 被評為設計師最愛的字型,Realist風格,簡潔現代的線條,非常受到追捧。在Mac下面被認為是最佳的網頁字型,在Windows下由於Hinting的原因顯示很糟糕。
Arial: Helvetica的「克隆」,和Helvetica非常像,細節上比如R和G有小小差別。如果字號太小,文字太多,看起來會有些累眼。Win和Mac顯示都正常
Lucida Family: Lucida Grande是Mac OS UI的標準字型,屬於humanist風格,稍微活潑一點。Mac下的顯示要比Win下好。
Verdana: 專門為了屏顯而設計的字型,humanist風格,在小字號下仍可以清楚顯示,但是字型細節缺失嚴重,最好別做標題。
Tahoma: 也是humanist風格,字型和Verdana有點像,但是略窄一些,counter略小,曾經是Windows的標準字型,Mac 10.5之後預設也有安裝。
Trebuchet MS: 為微軟設計的一個humanist風格字型,個人覺得個性太過突出,用得不好會不搭。
Serif
Georgia: 基本上適合正文屏顯的襯線字型,非Georgia莫屬了。筆畫粗重,襯線明線,輪廓較大,小字型顯示也很清晰,同時細節還算OK。
Times: Times是為了報紙而設計的,特點是可以在有限的空間塞進去更多的文字,筆畫較弱,小字號正文屏顯看起來累眼。曾經Engadget改版的時候用了Times作為正文,被罵得很慘之後換成了Georgia。
中文不熟,拋磚引玉:
中易宋體:Win最常見的字型,小字型點陣,大字型TrueType,但是大字型並不好看,所以最好別做標題。
微軟雅黑:Vista之後新引入的字型,開啟Cleartype之後顯示效果不錯,不開Cleartype發虛。
華文細黑:Mac下的預設中文。
Droid Sans和衍生的WenQuanYi Microhei:Andriod中的中文,也是Linux絕大多數發行版本的預設中文,,當然也有用WenQuanyi Zenhei的,不過比較少了。
CSS3開始支援Embedded font所以英文字型選擇一下子多了很多,而中文字型由於檔案龐大,仍然就是那幾個選。
===================================
網頁設計中常用的19個Web安全字型
在Web編碼中,CSS預設應用的Web字型是有限的,雖然在新版本的CSS3,我們可以透過新增的@font-face屬性來引入特殊的瀏覽器載入字型。
但多數情況下,考慮各個因素的影響我們還是在儘量充分利用這些預設呼叫的字型實現CSS的編寫,這裡整理了19個Web安全字型,讓你無需任何顧慮的情況下暢快使用。
1, Arial
微軟公司的網頁核心字型之一,最常用的sans serif字型,當字號很小時不容易閱讀。但是,大寫的“I”和小寫的“l”是無法區別的,你可以考慮用Tahoma字型來替代。
(蘋果系統沒有這種字型,但有一種對應於Arial的字型叫Helvetica,它是MAC機上與Arial 字型最相似的WEB字型,是別一種非襯線字型.它是一種效能優良的列印字型,但在螢幕上表現不是很好,說道Helvetica字型,昨天發現了很多有意思的站點,主要是紀念Helvetica字型誕生50年而設的。)

CSS寫法:font-family: Arial, Helvetica, sans-serif;
2, Arial Black

CSS寫法:font-family: ‘Arial Black’, Gadget, sans-serif;
3, Arial Narrow

CSS寫法:font-family: ‘Arial Narrow’, sans-serif;
4, Verdana
微軟公司的網頁核心字型之一,微軟公司專門為螢幕顯示而開發的。應用廣泛。易於閱讀。是顯示器中最清晰的字型,即使字號很小,也很容易閱讀。半肥貓比較喜歡採用10PX的Verdana來做英文正文字型,也推薦大家使用,但字號最好介於10~14畫素之間,超出這個範圍就不好看了。

CSS寫法:font-family: Verdana, Geneva, sans-serif;
5, Georgia
微軟公司的網頁核心字型之一,可用性好。可讀性比Times New Roman強。是網站設計中,瀏覽效果最好的serif字型,因為它是專為網上閱讀設計的。)

CSS寫法:font-family: Georgia, serif;
6, Times New Roman
微軟公司的網頁核心字型之一,可能是最常用的serif字型,是網站瀏覽器預設的字型,12pt以上的字型容易閱讀,但小字號的字型易讀性差。(蘋果系統沒有這個字型,有一個對應於Times New Roman的字型叫Times)

CSS寫法:font-family: "Times New Roman", Times, serif;
7, Trebuchet MS
微軟公司的網頁核心字型之一,與Arial相似,半肥貓覺得:Trebuchet MS比Arial看起來優雅、古典一點。可以用來做標題,但小字號閱讀起來會很困難(低於13PIX閱讀起來就很累了,不太推薦用來做正文字型)。在蘋果系統上也可以用Helvetica做替代。

CSS寫法:font-family: "Trebuchet MS", Helvetica, sans-serif;
8 , Courier New
微軟公司的網頁核心字型之一,老式印表機字型,有一種獨特的機械工整感覺。呈現計算機編碼時,還會用到這種字型。12 pt的Courier New字型曾是美國國務院的公文標準字型,但於2004年1月停用,改使用14 pt的Times New Roman,因為其具“現代性”和“易讀性”。

CSS寫法:font-family: "Courier New", Courier, monospace;
9, Impact
微軟公司的網頁核心字型之一,Impact是1965年發表的一個無襯線字型,其特粗的筆畫、緊縮的間距。半肥貓覺得:字型較為粗獷,適合使用在標題上,而不常用在內文。

CSS寫法:font-family: Impact, Charcoal, sans-serif;
10, Comic Sans MS
微軟公司的網頁核心字型之一,手寫體。這是一種爭議很大的字型,講實話,半肥貓也不喜歡這個字型,一點美感都沒有,不過在一大堆規規矩矩的字型裡面,有這麼一個隨意性比較的字型,可以變換一下口味,也算不錯吧,建議不要用在正規的金融、政府、商業機構站點。

CSS寫法:font-family: "Comic Sans MS", cursive;
11, Tahoma
Tahoma是一個十分常見的無襯線字型,Tahoma和Verdana師出同為名設計師馬修·卡特的作品,由微軟在1999年推出,被採用為Windows 2000、Windows XP、Windows Server 2003等系統的預設字型。半肥貓覺得:它的字型結構和Verdana很相似,其字元間距較小,用來作為標題,效果好過Arial(Tahoma的大寫I 和小寫l比Arial容易識別),但如果作為正文,他的字號不能小於13PIX,否則很多筆畫粘連到一起,不利於閱讀。

CSS寫法:font-family: Tahoma, Geneva, sans-serif;
12, Courier
Courier是一個等寬字型的粗襯線字型,主要是依據打字機所打印出來的字型來設計。原來Courier New的字型是IBM公司在1950年代設計給印表機使用的字型,後來這個字型成為整個打字機制造業的標準。Courier New是Courier的變體,比Courier更具機械味道。

CSS寫法:font-family: Courier, monospace;
13, Lucida Sans Unicode
是一種OpenType型的無襯線字型 。1993年製作並隨微軟公司的Windows NT 3.1作業系統釋出。有較大的x字高,具有很好的可讀性,被廣泛用於顯示、出版等各種用途。
它支援Unicode2.0版本的基本字元,包括拉丁字母,希臘字母,西裡爾字母,希伯來字母,以及國際音標字元。該字型是首個 Unicode程式碼的字型, 該字型從Windows 98開始一直作為系統預裝字型發行。
後來釋出的 Lucida Grande字型作為蘋果公司Mac OS X系統的預設字型釋出。
CSS寫法:font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
14, Lucida Console
同Lucida Sans Unicode類似。

CSS寫法:font-family: "Lucida Console", Monaco, monospace;
15, Garamond
Garamond(加拉蒙德)是一類西文襯線字型的總稱,自16世紀40年代開始至今,有很多家公司和很多設計師參與到Garamond字型設計,如: Adobe Garamond, Monotype Garamond, Sioncini Garamond,和 Stempel Garamond等等。半肥貓覺得:字型給人端莊典雅,有些古典的感覺,在博物館和歷史性悠久的專案中使用,應該可以獲得不錯的效果。

CSS寫法:font-family: Garamond, serif;
16 , MS Sans Serif
微軟系統自帶字型。螢幕顯示的畫素字型。非襯線字型。

CSS寫法:font-family: "MS Sans Serif", Geneva, sans-serif;
17 , MS Serif
微軟系統自帶字型。螢幕顯示的畫素字型。襯線字型。
CSS寫法:font-family: "MS Serif", "New York", sans-serif;
18, Palatino Linotype

CSS寫法:font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
19, Symbol

CSS寫法:font-family: Symbol, sans-serif;
20, Bookman Old Style

CSS寫法:font-family: "Bookman Old Style", serif