Quantcast
Channel: 字体设计 –优设网 – UISDC
Viewing all articles
Browse latest Browse all 241

超赞!网页设计中最常见的30款英文字体

$
0
0

关于英文字体,对我们网页设计师朋友们来说一定并不陌生,即使我们很少做英文语系的网站,但在浏览国外网站的时候,大家一定都会有或多或少的认识。其实不单单是在网页中,很多移动操作系统和浏览器中都广泛使用了今天我们即将介绍的这些字体。

想必大家也都能猜出来像 Arial、Helvetica 这种大名鼎鼎的字体肯定在里面了,那么还有什么呢?一起来详细了解一下吧!

相关推荐:
《平面排版时,教你突出中文美感的几种方法第二集(基础篇)》
《那些年,我们一起追过的字体》
《快速上手!制作ICON FONT》

首先,补充个小知识:

1.网页设计中的英文字体,一般有以下五类:

serif(衬线)
sans-serif(无衬线)
monospace(等宽)
fantasy(梦幻)
cuisive(花体)

网页设计中最常见的无衬线字体

在常见的两种字体风格中,衬线体的笔划感太”过”,不是特别的商业。随着瑞士设计风格的大力推广,无衬线字体变得愈发流行起来。

建议: 个人认为 Tahoma 以及 Verdana 字符编码效果最好 ,适用于多种环境

Arial

字体族科:Arial, “Helvetica Neue”, Helvetica

变体:

Arial:有时称为Arial Regular以便与Arial Narrow区别,其包括Arial、Arial Italic(斜体)、Arial Bold(粗体)、Arial Bold Italic(粗斜体)和Arial Unicode MS
Arial Black:此字体的特色在于其笔画相当的粗,包含Arial Black、Arial Black Italic(斜体)
Arial Narrow:为Arial的细瘦版本,包含Arial Narrow Regular、Arial Narrow Bold(粗体)、Arial Narrow Italic(斜体)和Arial Narrow Bold Italic(粗斜体)
Arial Rounded:包含Arial Rounded Bold(粗体),此字体可在微软韩文字体Gulim找到
——以上来自百度百科

Arial: one of the most famous web safe fonts.

Avant Garde

字体族科包括: “Avant Garde”, Avantgarde, “Century Gothic”, CenturyGothic, “AppleGothic”;

Avant Garde: cool sans serif font.

Calibri

字体族科包括: Calibri, Candara, Segoe, “Segoe UI”, Optima, Arial,;
Calibri,一种无衬线字体,为微软Microsoft Office 2007套装软件的默认字体,取代先前Microsoft Word的默认字体Times New Roman以及PowerPoint、Excel和Outlook的默认字体Arial。
Calibri是搭发布于微软Windows Vista六种英文ClearType字体的其中一种,是Microsoft Word默认字体的第一个无衬线字体,先前则是使用Times New Roman为默认字体。

Calibri: the finest font microsoft developed.

Candara

字体族科包括: Candara, Calibri, Segoe, “Segoe UI”, Optima, Arial

Candara是一种无衬线字体,为字型设计师Gary Munch为微软所开发,附带于Windows Vista中发行。——Wiki百科

Candara: a unique font

Franklin Gothic Medium

字体族科包括: “Franklin Gothic Medium”, “Franklin Gothic”, “ITC Franklin Gothic”, Arial, sans-serif;

Franklin Gothic: one of the most popular fonts among designers.

Futura

字体族科包括:: Futura, “Trebuchet MS”, Arial;

Futura灵感来自包豪斯,继包豪斯的设计理念,设计师保罗伦纳1924年至1926年首次创建Futura。虽然伦纳是不是包豪斯的成员,但是他赞同其很多观点,他认为现代的字体应该表达出现代模式,而不是成为过去字体的延续。Futura商业授权发行于1927年,由鲍尔型铸造厂投产。

Futura凸版

在设计 Futura 的过程中,伦纳避免产生任何非必要的元素,借鉴了无衬线的基本几何比例。Futura的清脆、干净的形式反映了其效率感,鲁莽的外观即使在现如今也已经淡淡退出了。

Futura成功催生了新的几何无衬线字体,如卡贝尔和世纪哥特式,其中包括的范围。现在超过80自成立以来,许多代工厂已经公布Futura变化的数字形式年,Adobe公司作为最常用的一个。几个国际公司还利用自己的Futura定制的版本,包括大众汽车(可见其著名的广告)和宜家。——Wiki

Futura: ironically, looks a little vintage.

Helvetica

字体族科包括: “Helvetica Neue”, Helvetica, Arial;

Helvetica被视作现代主义在字体设计界的典型代表。按照现代主义的观点,字体应该”像一个透明的容器一样”,使得读者在阅读的时候专注于文字所表达的内容,而不会关注文字本身所使用的字体。由于这种特点的存在,使得Helvetica适合用于表达各种各样的信息,并且在平面设计界获得了广泛的应用。

Helvetica最常见的派生字体,应该是Monotype公司于1982年出品的”Arial“字体。虽然在很多细节上与Helvetica有所不同,但许多非专业人士很容易将两者混淆。Arial字体随着Microsoft Windows操作系统的附赠而迅速普及。

斯滕佩尔公司于1983年发布改进版本的Neue Helvetica。原来的Helvetica字体家族只有31种,新版本的Neue Helvetica有51种,而且以Univers为参照进行编号,以Neue Helvetica 55 Roman为基准,数字第一位为粗细,第二位为风格。现在Helvetica以及Neue Helvetica由于企业收购合并的原因,成为Linotype公司的商品和商标。

Linotype公司在1983年发布”Neue Helvetica”字体。增加了更多不同的粗细与宽度的选择。——Wiki

Helvetica: the font that revolutionized the industry.

Impact

字体族科包括: Impact, Haettenschweiler, “Franklin Gothic Bold”, Charcoal, “Helvetica Inserat”, “Bitstream Vera Sans Bold”, “Arial Black”;

Impact是一个由设计师乔佛瑞·李在1965年发表的一个无衬线字体,其特粗的笔画、紧缩的间距以及狭窄内部空间为其特点,正如其名impact(压紧)所指。此字型的x字高相当大,几乎接近其大写字母的三分之二,因此升部相当短小,降部更是如此。因为字体较为粗犷,适合使用在标题上,而不常用在内文。

Impact是网页核心字型的其中一个字体,跟着Microsoft Windows系统一同发布。

Impact: ideal font for creating headings.

Optima

字体族科包括: Optima, Segoe, “Segoe UI”, Candara, Calibri, Arial;

奥普蒂玛体(Optima)是一款英文无衬线体。最初是为德国著名字体设计师赫尔曼·察普夫法兰克福的D. Stempel AG foundry公司在1952年1955年左右设计的。

在字体分类上,虽然这个字体没有衬线而被分类为无衬线体,它却与多数的无衬线字体不同,奥普蒂玛体的横竖笔画的粗细并不一致,横比竖要细一些,因此字体看起来兼具优雅、简练的风格,受到大众的喜爱。

2003年Linotype公司发布一个”Optima Nova”字体。这个Optima Nova的制作是在察普夫的协助下,由日本的小林章进行设计的。与Frutiger字体的改刻版”Frutiger Next”一样,在制作的事后不是单纯倾斜,而是另外操刀制作了斜体,提高了细节的设计质量。——Wiki

Optima: Modern and sleek font loved by designers.

Tahoma

字体族科包括: Tahoma, Verdana, Segoe;

Tahoma是一个十分常见的无衬线字体,字体结构和Verdana很相似,其字符间距较小,而且对Unicode字集的支持范围较大。

Tahoma和Verdana师出同门,同为名设计师马修·卡特(Matthew Carter)的作品,由微软在1994年推出。许多不喜欢Arial字体的人常常会改用Tahoma来代替,除了是因为Tahoma很容易取得之外,也是因为Tahoma没有一些Arial为人诟病的缺点,例如大写”I“与小写”l“难以分辨等。

Tahoma被采用为Windows 2000Windows XPWindows Server 2003Sega游戏主机Dreamcast等系统的默认字型。——Wiki

Tahoma: brilliant font to work with unicode.

Verdana

字体族科包括: Verdana, Geneva;

Verdana,是一套无衬线字体,由于它在小字上仍有结构清晰端整、阅读辨识容易等高品质的表现,因而在1996年推出后即迅速成为许多领域所爱用的标准字型之一。

此字体的设计源起于微软字型设计小组的维吉尼亚·惠烈(Virginia Howlett)希望设计一套具有高辨识性、易读性的新字型以供屏幕显示之用,于是她邀请了世界顶级字型设计师之一的马修·卡特(Matthew Carter)操刀,以Frutiger字体及爱德华·约翰斯顿(Edward Johnston)为伦敦地铁所设计的字体为蓝本,并由Monotype公司的字型微调(Hint)专家汤姆·瑞克纳(Tom Rickner)担任手工微调,字体结构与Tahoma(同为马修·卡特所设计)很相似,微软将Verdana纳入网页核心字体之一。——Wiki

Verdana: another good font for unicode.

网页设计中最常见的衬线字体

衬线字体再纸媒中使用较多,在纸张上的显示效果更加。但是在屏幕上(尤其是小屏幕上),显示效果不是那么的好。但是依然有很多设计师喜好用衬线字体,主要多用于标题,让标题看起来更与众不同。

Baskerville

字体族科包括: Baskerville, “Baskerville Old Face”, “Hoefler Text”, Garamond, “Times New Roman”;

Baskerville: excellent font for web even though it is a serif font.

Big Caslon

字体族科包括: “Big Caslon”, “Book Antiqua”, “Palatino Linotype”, Georgia;

Big Caslon: stylish serif font.

Bodoni MT

字体族科包括: “Bodoni MT”, Didot, “Didot LT STD”, “Hoefler Text”, Garamond, “Times New Roman”;

Bodoni Monotype: bold serif font for headings.

Cambria

字体族科包括: Cambria, Georgia, serif;

Cambria是搭载于微软Windows VistaMicrosoft Office 2007Microsoft Office 2008 for Mac等软件的一个衬线字体,其字符间距和比例相当的平均,对角和垂直方向的笔画和衬线比较粗,而水平向的衬线比较细,强调笔画的末笔。

当Cambria使用在大小超过20的标题时,其字体间的间距会些微的缩小以求美观,但这样的设计并不适用于商业文件。——Wiki

Cambria: Microsoft's finest serif font.

Didot

font-family: Didot, “Didot LT STD”, “Hoefler Text”, Garamond, “Times New Roman”;

Didot: stylish, decorated serif font for web.

Georgia

字体族科包括: Georgia, Times, “Times New Roman”;

Georgia是一种衬线字体,为著名字型设计师马修·卡特(Matthew Carter)于1993年为微软所设计的作品,具有在小字下仍能清晰辨识的特性,可读性十分优良。其命名发想自一份小报报道在美国佐治亚州发现外星人头颅的测试性头条

乍看之下,Georgia与Times New Roman相当类似,但它们有多处不同。首先,在相同的字号下,Georgia的字符比Times New Roman的字符略大;其次,Georgia的字符线条较粗,衬线部份也比较钝而平。另外在数字部份也非常不同,Georgia采用称为”不齐线数字“的数字,特色在于数字会像英文字母般有高矮大小之别。

微软将Georgia列入网页核心字型,是视窗操作系统的内建字型之一。苹果电脑麦金塔系统之后也跟进采用Georgia作为内建字型之一。

请注意:数字“0″与字母“o”在Georgia字体下可能是显示成一模一样,使用时需特别注意。——Wiki

Georgia

Lucida Bright

字体族科包括: “Lucida Bright”, Georgia;

Lucida Bright: serif font for content.

Palatino

字体族科包括: Palatino, “Palatino Linotype”, “Palatino LT STD”, “Book Antiqua”, Georgia;

帕拉提诺体(Palatino)是一种常见的英文字体。它属于旧衬线体,是最常被使用的10种衬线字体之一。由德国设计师赫尔曼·察普夫设计,1948年Linotype Foundry公司发布。赫尔曼·察普夫设计了一系列体现了意大利文艺复兴的风格的字体,包括Palatine, Sistina, Michaelangelo titling和Aldus,而且据说都是从阿尔杜斯·马努提乌斯印刷所铅字铸造师Francesco Griffo制作的铅字中取得的灵感。”帕拉提诺”这个名字源于16世纪意大利书法家将巴提萨·帕拉提诺(Giambattista Palatino)。

帕拉提诺体是基于文艺复兴的人文主义字体,可以看出从羽毛笔进化而来的痕迹,并富于运笔的韵律美。当时的字体多使用小字母和细笔画长竖线的搭配(长字母的字头字脚),而帕拉提诺体中进行了修改,增加字体的长度,便于阅读。字体竖线的粗细几乎不变,直线衬线较多,字母Q等的笔画富有明显特征,具有独特的优雅气息。——Wiki

Palatino

Perpetua

字体族科包括: Perpetua, Baskerville, “Big Caslon”, “Palatino Linotype”, Palatino, “URW Palladio L”, “Nimbus Roman No9 L”;

Perpetua: lovely name!

Rockwell

字体族科包括: Rockwell, “Courier Bold”, Courier, Georgia, Times, “Times New Roman”;

Rockwell: a bold font for creating headings and names.

Times New Roman

字体族科包括: TimesNewRoman, “Times New Roman”, Times, Baskerville, Georgia;

Times New Roman(泰晤士新罗马),可能是最常见且广为人知的衬线字体之一,在字体设计上属于过渡型衬线体,对后来的字型产生了很深远的影响。另外由于其中规中矩、四平八稳的经典外观,所以经常被选择为标准字体之一。——Wiki

Times New Roman: one of the most common fonts out there.

网页设计中最常见的等宽字体

等宽字体看起来像是打字机打出来的字体。等宽,i和w占据同样的宽度,虽然现在看起来有点怪,但是蛮有趣的。

Andale Mono

字体族科包括: “Andale Mono”, AndaleMono;

Andalé Mono,也写作Andale Mono,是Monotype公司出品的一个等宽字体风格的无衬线字体,其特色在于字符有高度的可辨识性,例如数字0“中有一点,可轻易与大写字母O“区别;容易混淆的数字”1“、小写字母”l“和大写字母”I“也加入衬线设计以利分辨。

由知名字型设计师史提夫·马特森(Steve Matteson)创造,作为终端机的显示字体与软件开发的源码字型之用,最早应用在苹果公司与IBM合作研发的Taligent计划,后来微软也将此字型选为网页核心字型之一。

在微软的Windows系统上,Andalé Mono最初是作为Internet Explorer 4.0的可选附件发行。自Internet Explorer 5开始,Andalé Mono改名为Andale Mono,字体版本升为1.25。虽然后来微软中止了网页核心字型计划,并且从Windows ME以后不再附带此字体,但目前在Sourceforge的相关计划网页上仍可下载得到,而且苹果公司也将此字体附于旗下的Mac OS X系统中发布——Wiki

Andale Mono: Monospace font for web.

Consolas

字体族科包括: Consolas, monaco;

Consolas 是一套固定字符宽度的字型,属无衬线字体,由 Lucas de Groot 设计。这套字型使用了微软的 ClearType 字型平滑技术,并随同 Windows VistaOffice 2007Microsoft Visual Studio 中发行,或可在微软的网站下载。在 Windows Vista 的 6 套新字型中,Consolas 近似于前版 Windows 中的 2 款内建字型:Lucida ConsoleCourier New,主要是设计做为程式码的显示字型之用,特别之处是它的”0″字加入了一斜撇,以方便与字母”O”分辨。

在 Consolas 之前,程式码的显示字型大多为 Courier New 或其他固定字符宽度的字型,字型的柔边(反锯齿)效果则依个人喜好选择开启或关闭,然而 Consolas 是专为柔边效果而设计的字型,特别是为了搭配微软的 ClearType 技术,如果不开启 ClearType,Consolas 的显示效果会打大折扣。另外,ClearType 技术还需要搭配液晶显示器才会有最佳表现。——Wiki

Consolas:Typical typewriter fonts.

Courier New

字体族科包括: “Courier New”, Courier, “Lucida Sans Typewriter”, “Lucida Typewriter”;

Courier是一个等宽字体粗衬线字体,主要是依据打字机所打印出来的字形来设计,于1955年由Howard “Bud” Kettler设计完成。原来的Courier字体是IBM公司在1950年代设计给打印机使用的字体,但是并未维护他们的专利,使得这个字型成为整个打字机制造业的标准。

在现今的电子时代,此字体也常被使用,因为其等宽的特性可以轻易地对齐字段的左右边界,也成为脚本程式设计源代码的常用字体。

12pt的Courier New字体曾是美国国务院的公文标准字体,但于2004年1月停用,改使用14pt的Times New Roman,因为其具”现代性”和”易读性”——Wiki

Courier New: comes built-in in most operating systems.

Lucida Console

字体族科包括: “Lucida Console”, “Lucida Sans Typewriter”, Monaco, “Bitstream Vera Sans Mono”;

Lucida Console: one of the best monospace fonts out there.

Lucida Sans Typewriter

字体族科包括: “Lucida Sans Typewriter”, “Lucida Console”, Monaco, “Bitstream Vera Sans Mono”;

Lucida Sans Typewriter Font

网页设计中最常见的梦幻体和花体

Brush Script MT

字体族科包括:”Brush Script MT”, 花体英文;

Brush Script: handwritten or paintbrush font effect.

Copperplate

字体族科包括:Copperplate, “Copperplate Gothic Light”, 梦幻字体;

Copperplate: Stylish fantasy font for headings.

Papyrus

字体族科包括:Papyrus, 梦幻字体;

Papyrus Font

适合移动设备显示的网页安全字体

如果你的网页设计针对移动设备,那么上面的很多字体并不使用,因为空间有限。

下面是一些适合移动设备的网页安全字体。

Arial
Courier
Georgia
Palatino
Verdana
Helvetica
Courier New
Times New Roman

希望大家伙能有所收获,在网页设计中添加英文的时候注意这几点。

原文地址:designzzz
优设网翻译:@MartinRGB

 
================关于优设网================
“优设网uisdc.com“是一个分享网页设计、无线端设计以及PS教程的干货网站。
【特色推荐】
PS礼仪手册:网页设计师必须修炼的内功技法,更是不可或缺的WEB设计指南http://hao.uisdc.com/ps/
设计微博:拥有粉丝量62万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加:

youshege
 


Viewing all articles
Browse latest Browse all 241

Trending Articles