干货 | 网页设计的7种字体排版设计趋势

时间：2023-09-29 06:30:02 | 来源：网站运营

时间：2023-09-29 06:30:02 来源：网站运营

干货 | 网页设计的7种字体排版设计趋势：




2006年，Oliver Reichenstein发表了文章《网页设计95%的工作是排版》，成为当年备受争议的文章之一。Reichenstein也说：“网页设计不是选择伟大的字体，而是我们如何使用它们。”

下面就让我们来看看网页设计中是如何使用字体的。


01 加粗字体的首页排版设计
超大的、加粗的、直接的、没有戏剧性的字体可能是最近几年网站首页设计中运用最多的字体。网站首页的超大图片被超大文本标题所代替，这些标题往往与主题、品牌或者信息紧密关联。
而效果也如图所见，字体排版成为网站中最显眼的设计。



例如CreativeDoc的首页中，6个加粗的白色字母在强烈的黑色背景中，对比强烈，十分醒目。



而Souffl这家欧洲的设计创意公司，网页上运用了一种更为简洁、狭窄的白色字体，黑色背景搭配流行的彩色动画元素。

02 衬线字体
衬线字体与无衬线字体相比更加优雅。所以设计师通常会在标题和说明中运用衬线字体强调突出，比如Calluna和Minion这两个字体。
在Cobble Hill和Gin Lane这两个网页设计上，设计师就在极简主义的首页上运用了优雅衬线字体。






03 纯文字排版
新闻业和其他行业的文字视觉革命进行的如火如荼，但有部分网页仍然追求直观、简单的文字排版。
Justin Jackson 的这个名为 Word 的这个网站的主要内容，是在网页上独立呈现文本的显示效果的。



Jackson 说：“文本是最网页中最强大的工具”，虽然这一说法直到最近才被接受。使用纯文字进行网页设计并不容易，但使用的好我们甚至不会注意到图像的缺失。
位于哥本哈根的设计机构B14就使用简单直白的文字来填满主页，说明他们是谁，做了什么。



一图虽然胜千言，但并没有像文字对信息的控制那么好。
自由撰稿人乔•科尔曼（Joe Coleman）以一种全新的方式诠释了“纯文字排版”。他用交互性元素和纯文字的设计来吸引用户。



Max Kaplun的作品又有不同，纯文字的排版中加入运用字符，字大小和重量的变化，和一个彩色的光标。




04 为等宽字体腾空间
等宽字体应用较广，不仅会出现在文字密集的场合，也可以用于网页设计。由于这种字体带有复古感，恰好与网页设计中粗野主义的回归相吻合。



Laurent Desserrey设计了一套令人着迷的作品集网站，借助闪光背景和等宽字体营造出粗野主义的视觉效果。



Run Your Mouth也通过使用等宽字体创造了同样迷人的粗野主义效果。


05 使用高亮效果来吸引关注
高亮效果的作用是构建内容的层次结构，这有利于读者在浏览时抓住关键信息。正如我们在课本的重点处涂上鲜艳色彩来突出一样，设计师在网页设计上也是如此。



旧金山的一家设计公司Godfrey Dadich在其主页上运用荧光绿的高亮部分来突出重点。



康奈尔大学（Cornell University）在网页上也运用了高亮效果。 通过荧光黄标记的关键词来突出重点，方便用户浏览。


06 运用纵横交错的标题文本

将文本块拆分，在网站首页上进行纵横交错的排布也是最近比较流行的方式。这种方式抛弃了传统水平对齐方式，给整体布局更多留白，产生了意想不到的效果。




例如上图的电影网站，就将Take What You Can Carry拆开来单独排版。




而其他的设计机构，比如 Elegant Seegulls 的网站，甚至进一步尝试垂直文本对齐，以创造持续的滚动效果。



在创意机构 Magic People Voodoo People 的网站上，则在四角上使用了水平和垂直的文本来构成它的名称。


07 分散字体

最后要介绍的就是分散字体，将单词彻底打散成单个字母，相较于第六种方式更为大胆。虽然视觉效果很好，但如果不谨慎部署，可能会牺牲可读性和可访问性。



The Impossible Is Inevitable 是一个在莫斯科犹太人博物馆所举办的展览，展览的名字是以在主页上浮动的、连在一起的字母形式出现。
展览的名字以这种分散的串联的方式出现也是有意为之。微小的丝线将视觉上分散的字母串联在一起，象征着展览对未知的探索和人类支离破碎、脆弱的血缘关系。




Octoplus Group是一个散布信件来讲述故事的通信机构，网站首页就是借助小而粗的字母来充当导航元素。这种设计从品牌信息传达和故事性的角度上来看是非常有趣且有效的。


撰文 ✎ 小香菇




51design出品，无条件欢迎分享转发