设计师进阶:如何用文字性格激发网页的活力

设计师们在设计网页时,通常会为表达某种情感而选择字体。可以说,除了需要表达文字内容本身之外,设计师在选择一款字体时还应该考虑这款字体是否能与其他设计元素及布局相融合,同时加深网页上的人或事物的特点。

随着更多企业越来越“接地气”,他们开始注重与用户的互动与交流,增强用户的参与感,因此对话式的网站快速受到用户欢迎。这一趋势无形中要求设计师们需要加强对文字性格的把握,以更好的设计实现与用户的“对话”。

正如大家常听到一句话“字如其人”,在看到一种字体后,人们会下意识联想到某种人物形象、性格或感受,比如沉稳、柔美、活泼、可爱、平和等。

因此在设计之前,设计师需要不断问自己:我想让用户觉得,这是一个什么性格的人在和他们对话?我现在采用的这种字体所表现的性格,是我想要表达的特点吗?

通过思考和对比,才能应用恰当的文字性格,把握好网页的设计。

AnyForWeb将通过本文给大家展示收集的不同字体应用案例,希望能帮助设计师们在中文字体设计上加深理解。

我们需要先说明一点,同一类型的字体可以设计成不同的变体美术字,字体的粗细、曲直、疏密不同,在不同风格设计下可能展现不同性格特征。

1.客观、正式、官方的、通用的

基本上看到这几个描述词,大家肯定知道描述的是什么字体了。没错,说的正是宋体。

宋体是与印刷术同龄的出版字体,这种最普通的字体在报刊杂志中常用。在网页设计中,宋体也可以在很多地方使用,非常适合用于大段文字的版块。

2.清秀、方正俊雅、真实可靠

有物电商平台的banner图中采用了楷体和微软雅黑两种字体,大字使用的楷体是汉字主要书体,看起来工整规范、干净利落,给人方正俊雅的感觉,这段文字与图片表达的“手工感”相融合,共同传达出一种认真和质朴的精神。

这里有个细节需要大家注意喽!在这个案例中,楷体文字是嵌入在图片中的,而微软雅黑则是用font-family写在页面的,为什么处理方式不一样?在上一篇文章中AnyForWeb有提到过,详情请参考《常规or创意?别让网页中的文字设计禁锢了你》。

从文字的整体结构来看,楷体带有一种书卷味,可以考虑在教育行业的网站上适当采用。

3.强壮、坚韧、压迫、震撼、充满力量感

给人这种感受的字体一般笔画浑厚、浓重,很多情况下采用粗体或加粗的大号文字,在视觉上面积加重,给人一种强壮、震撼的感觉。

比如下面阿迪达斯采用的这款蒙纳简粗雅丽体,在网页上占据的位置非常显眼。

下面案例中节目的Logo位于官网首页,采用了一款纯直线字体,显得硬朗、笔直、棱角分明,给人一种坚决的态度。

还有李宁官网图片中使用的字体,笔画粗细均衡,规律一致,充满了坚韧。

NBA官网和国际飞镖公开赛网站则是采用了微软雅黑字体,加粗的大号的字体略带倾斜,内容标题也同样采用了加粗的微软雅黑。微软雅黑加粗后的视觉效果虽然不像上面几个案例的字体那么强势,但我们依然能在视觉上获得类似“隆重、这是比赛”的感受。

这类字体一般呈现出硬朗、粗犷、棱角分明等特征,适合应用于与运动、比赛、竞技、金属、游戏,以及面向男性用户群体的产品等。一些促销活动也会经常使用这类字体。

4.细致优雅、纤细、柔美、婉转、流畅、精致

给人这种感受的字体一般笔画纤细,婉转流畅,具有曲线美,很多情况下会采用末梢曲线优美的衬线字体。

上文提到让人感觉正式的宋体就是一款衬线字体,在适当的元素搭配中,宋体也能展现出典雅的一面,给人优雅的感觉。比如下面Tiffany的官方网站。

还有拉菲官网也是。

这类字体一般呈现出纤细柔软的特征,适合应用于珠宝、化妆品、珠宝首饰,以及面向女性用户群体的产品等。另外像红酒、餐厅、手工艺品牌、精选类品牌、奢侈品等也会使用这类字体。

有一点不得不说,其实很多品牌在中国区的官网上使用了特殊的自定义字体,但由于浏览器无法识别,浏览器最终以默认的宋体进行渲染,这时的视觉效果可能就不那么美好了。

这个问题怎么解决,我们之后将分享解决方法,我同样也在《常规or创意?别让网页中的文字设计禁锢了你》中提到过。

5.活泼、可爱、有趣

给人这种感受的字体一般字体末梢圆润,看起来圆乎乎的,显得稚趣、可爱。

比如喜宝HiPP官网采用的圆体。

还有帮宝适采用的幼圆字体。

给人这种感受的字体主要适用于趣味游戏、婴幼儿产品、游乐场、玩具等。另外,像柔软舒适的产品也会选用这类字体,比如某些家居用品等。

6.平和、干净、简单、平静

这类字体一般采用无衬线字体,链接衬线和字干的字弧被去除,字体看起来干脆利落,比如苹果官网的PingHei字体。

魅族官网的方正悠黑字体。

这类字体主要适用于科技行业,包括平台、电脑手机产品等,同样也适用于现代感的产品、简洁风格的产品等。

7.古典、中国风

柒牌采用的行书字体行云流水,形态优美,带着浓浓的中国特色,更好地表达了其品牌所传达的理念。

AnyForWeb为九扇屏设计的网站首页采用了瘦金体,这款字体风格独特,充分展现中国传统文化特色,体现其品牌特征。

此外,很多字体还能给人其他感受,比如费列罗官网的这款字体让人有一种愉悦、温暖的感觉。

加粗的微软雅黑字体在以下案例中让人感到专业、可靠。

黑体看起来刚健、踏实,在建筑行业、机械行业、房地产行业网站上展现出一种专业感。

看到这么多案例后,相信大家已经对字体性格有了基本了解,本篇关于文字性格的介绍就先到这里。了解这些基本的知识后,大家可以进一步学习,根据对不同字体结构、笔画弧度等元素进行判断,在不同场景下合理应用字体,最终能通过文字性格的展现让自己网页设计更有活力。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,968评论 6 482
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,601评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 153,220评论 0 344
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,416评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,425评论 5 374
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,144评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,432评论 3 401
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,088评论 0 261
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,586评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,028评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,137评论 1 334
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,783评论 4 324
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,343评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,333评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,559评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,595评论 2 355
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,901评论 2 345

推荐阅读更多精彩内容