排版可以说是网页设计和开发领域最具挑战性的链条之一。与其说是因为技术问题，谢天谢地，这些现在可以解决，而是因为它需要额外的时间，而我们似乎从来没有过。我们首先将脑细胞与设计和开发的许多其他方面打包在一起，然后花其余时间跟上数字世界的快速步伐。
就像生活中的其他任何事情一样，在块上创建最好的网站和排版设计工作需要专注和时间。是时候学习，实验和掌握这种复杂而多层次的艺术形式了。我们经常坚持基础知识，因为增强的排版可能不适合我们正在从事的项目，并不是每个客户都愿意承担包含这种专业沟通层所需的额外时间和金钱。最终的结果是，我们在这个备受推崇的学科中几乎没有获得任何增长，最终认为我们甚至不值得尝试。
除了焦点和时间之外，您还需要对细节，平衡，历史，文化，情感，心理学，符号学，色彩，对比度等有敏锐的眼光。在看似简单的基于符号的书面文字世界中发生了很多事情，虽然本文只能提供对排版维度的奇迹的窥视，但它可能只是有助于缩短将头部放在正确的创意空间中所需的时间，并增加批判性眼光的深度感知。
加入我们，通过将一组精心执行的以字体为中心的网站放在显微镜下，来解构网页设计中排版的一些最佳用途。我们希望您喜欢这个设计发现的旅程，并敦促您尝试应用下一个数字项目中提出的一些原则。
* 某些网站可能需要一些时间才能加载。请耐心等待，他们是值得的！
1.排版作为主角：
Bonne Marque by Alexander Engzell & Bonne Marque
一个项目的名字包括Alexander Engzell，Antoine Wodniack，Jimmy Raheriasoa，Anastasi Tikhonova和Giant Steps-你知道这个项目将是特别的。如果您碰巧知道前三个“正在制作的传奇人物”的作品，那么您就会知道它将是极简主义，时尚，前沿和精心制作的排版。总结这个网站的最佳方法是将其与一部伟大的电影进行比较，每次您看到它时都会提供更多内容。
从第一页到最后一页，用户会遇到一些非常令人印象深刻的排版想法，例如带有视频遮罩的超大大写字母和相同大写字母的变形。还有经典和现代字体的完美结合，以及对讲故事的富有同情心的关注。注重细节的爱好者应该注意，这些才华横溢的小伙子对使用的单词给予的关心和关注，就像他们对排版和互动性一样。
进入任何一个项目组合项目都会揭示另一种美味的技术，即如何在列磁贴中呈现非常全面的副本，以便于视觉消费，同时仍然看起来很棒。奖励计划是，这种方法也适用于响应式设计。请注意大方的边缘，以保护极简主义美学。值得在许多领域解构，新的Bonne Marque网站是一个看似开创性的作品，它平衡了出色的排版，交互性和美学，并深思熟虑地使用了视差和运动fx。排版作为英雄的一个很好的例子。
Maeva Barrière by MashvpMashvp是伟大设计的代名词，法国人再次展示了如何通过使排版成为Maeva Barrière网站大部分的英雄来完成它。严格的黑白调色板为该设计的支柱奠定了基础，而由于删除了所有多余的元素，新的极简主义水平迎接了用户。这个网站是如此的极简主义，以至于它几乎没有什么可解构的。向下滚动会在内部页面上调用颜色反转，这也是一个不错的触摸。
最后的基调是明亮的，以丰富多彩的摄影为后盾，然后是排版的无可挑剔的英雄。这是一个光滑而时尚的网站，由于排版的力量，经过深思熟虑的交互性以及一些非常敏锐的创意头脑，值得一玩。
OH - Beauty & Simplicity by John Jattoh即时哇因素在标称加载时间后击中用户，这要归功于一些原始字体的使用，高冲击力的颜色和流畅的fx。伦敦设计师约翰·贾托采用经典的排版网站，并通过在这个高雅的数字通信作品中大胆地使用字体来使其成为自己的网站。
平滑和丰富多彩的过渡使用户毫不费力地从一页移动到另一页，而高度响应的滚动对于UX纯粹主义者来说是一种乐趣。设计一致性在整个项目部分都带有类型的英雄，但请务必单击页脚中的导航汉堡包，以获得另一种漂亮的光彩。
John Jattoh网站从一开始就是一次愉快的体验，它使用排版，构图和黑暗空间，带来邪恶的喜悦。值得关注的设计师。
Admir Hadzic Portfolio by Admir HadzicAdmir Hadzic的投资组合网站代表了几个热门趋势的智能和连贯的整合，就在它们达到大众意识的关键时刻。这包括我们所说的“nue-simplism”，在这种情况下，它适用于英雄 - 粗体排版。从一开始，用户就会受到一个令人惊叹的主页的欢迎，该页面具有真正的国际风味，以日本极简主义，意大利大胆和法式优雅为主导。
这是一个诱人的页面，一方面吸引用户在玩了哦，如此平滑的视差fx后点击了一个大胆的全大写标题，另一方面，它灌输了一种禅宗 - 就像走进当代博物馆或图书馆，并自动尊重沉默一样。
当我们浏览网站时，美丽而适当的页面过渡会让我们前进，引导我们进入豪华的远景和酷炫的字体混合。当滑过项目区域时，我们会体验到更多的意大利风格大胆，因为超大和笨重的身体字体统治着个人资料页面。总而言之，这是一项真正具有开创性的工作，充满了优雅和精致，排版与其他网站元素一样精湛。
WOBI on Leadership by Agencia EgoAgencia Ego在这个原始网站中以两种成功的方式使用排版。首先是作为一个视觉“钩子”，在设计的独特性方面为主页增添了一大亮点。这种令人惊叹的排版使用在一个趋势可以如此迅速淡化的世界中总是受欢迎的。
但是，与许多提供此类设备并随后是空灵感的网站不同，如果您向下滚动到“Chip Conley”，您会发现一些出色的分层段落，这些段落再次与提供的独特图形相辅相成。平衡可能是一个很难破解像这样的冒险设计，但Agencia Ego一定错过了备忘录，因为对他们来说，这似乎是孩子的游戏。一个伟大的排版结果。
2.排版作为配角：
Maxime Chillemi & Clément Grellier 的 FAKE MUSIC
有人称主页为网页设计的“金钱镜头”。《假音乐》完美地证明了这一点，它以精美抽象现代主义和美女法国的旋律舞蹈开始了演出。排版只是法国设计师Maxime Chillemi和开发人员Clément Grellier创造的和谐合奏中的一个音符，但它是使此页面取得成功的基础。
让我们以大字母F为例，我的猜测是，当你点击页面时，这是你的眼睛看到的第一件事。你接下来看了什么？也许是大M？尽管在屏幕中间有一件华丽的艺术品，周围环绕着华丽的空白，但许多眼睛被大而简单的字母形式所吸引，因为它们是语言的象征，一个对我们生存至关重要的核心方面。
假音乐中排版的平衡，构图和保留使用创造了一种与网站背景完美匹配的当代节奏和沉着，展示了法国设计师的主要标志之一。就好像他们有一个内置的视觉节拍器，可以确切地知道多少是太多，哪些元素值得关注，以及它们何时应该出现在舞台上。
移动到页面底部，英雄区域下方的极简主义类型几乎是意料之中的，并且作为次要选项，可以通过闪电般快速滚动来简单地滚动浏览这部分内容。
当然，在这个优秀的网站上还有很多值得一看的地方，但是我们对FAKE MUSIC的排版曝光已经结束，所以请查看其他页面并享受节目！
WeLoveNoise by WeLoveNoise拿出一大袋创造力，添加原创性，一汤匙超极简主义排版和一些独特的互动性 - 你就有了WeLoveNoise。这是一个以排版为背景的网站，作为抽象极简主义英雄的配角。
Luke Finch是一位目前在旧金山工作的多学科设计师，他巧妙地使用极简主义来提供激光聚焦的UX走道路径，让您在浏览特色项目时将独特的字体选择置于中心舞台。被空格包围并保持较小的字体大小，类型的重要性被提升。
WeLoveNoise是一种需要创造性尊重的设计，值得在您的鼓舞人心的排版网站播放列表中占有永久的位置。
Braind by Braind如果您需要进一步证明排版是“nue-simplism”的主要方面，那么请查看Braind的新网站。甚至Braind的标志也暗示了这些来自俄罗斯的才华横溢的窥视者对排版的视觉冲击力的理解程度。
从主页加载的那一刻起，您就知道您正在盯着一个在颜色，构图和交互方面正好流行的页面。但。。。这是一篇关于排版的文章，所以我会尽量不要被周围的眼睛糖果分散注意力，并专注于类型。
浏览项目时，我们看到厚实的超粗体标题与常规或标准尺寸的字体并置 - 总是很好。如果你深入研究一些项目，你会注意到有“现实世界”的文本需要处理，并且他们确实处理了它。在这里，我们通过粗体全大写的垂直标题迎接另一种右潮流风格。
IMO这总是具有为网站增添一丝俏皮的效果，一种微小的混乱感，上面写着“我是一个规则破坏者......在我的业余时间;)”。在滚动时将运动fx添加到类型中，再加上甜蜜的页面过渡，以令人愉快的风格完成了这个正潮流网站。
3. 通过排版将混合语言融合在一起
Mazen El Rifai by Douze Degres
网页设计中的排版已经足够困难了，但想象一下，必须将两种视觉上不同的语言与水彩画相结合，并将它们带入数字领域。这是一个艰难的电话，但对于Douze Degres来说，这是一天的工作，因为他们用他们的网站为才华横溢的黎巴嫩艺术家Mazen El Rifai回答了挑战。
经典字体与数字混合风格的身体字体成功混合，该字体由英雄增强 - 副本的流畅动画输入，这是这种类型的前沿效果。字体选择是大胆的，同时保持低调，虽然我们中的设计师可能在精神上考虑其他字体选择，但快速向下滚动以显示第二语言，在艺术上呈现出优雅和风格，这反过来又为整个页面注入了传统。
这些元素的力量与富有表现力的水彩画相结合，将这种富有同情心的设计带回家。
4. 排版作为艺术
Dada-Data by akufen， David Dufresne & Anita Hugi
Dada-Data是艺术和排版爱好者的梦想网站，拥有奇妙的富有想象力的字母景观和令人费解的抽象主义概念。忠于主题，来自加拿大的设计师akufen设法将字体作为一条线，将这件充满激情的数字达达编织成冒险，仿佛达达总是注定要这种混乱，多层次和动画的存在。
这个网站不仅是一个令人高兴的看，而且导航是令人兴奋的，这也是用排版技巧执行的。
达达作为一种艺术形式的风格并不适合所有人......但没关系，这有点重点。Dada是一个充满讽刺和无稽之谈的运动，以回应第一次世界大战的暴行，而Dada-Data将这一传统带入了新的数字时代，掌握了这本关于排版的未来历史经典书籍。
一旦你屈服于随意的导航，一定要探索这些项目，这种导航被巧妙地设计成通过它的傲慢和对秩序的污点来进入你的皮肤。在这个邪恶的网站上还有更多值得一看的地方，再一次，由于熟练的排版的力量，这一切都成为可能。
Marche à l'ombre by Les vadés这是一个排版纯粹主义者的网站，因为它依赖于排版使其工作的深层次，并且它所做的工作。从实心块文本开始，我们发现添加了一个砂砾般的纹理，这有助于将标题与网站其余部分的情感混合在一起，而不是普通的扁平颜色，否则可能会使它“站在”页面上方并破坏情绪。
罕见而勇敢地使用斜体是很高兴看到的，并在这个优雅的设计中清楚地增添了风格。当用户向下滚动时，微妙的运动fx为每个页面上的类型增添了生命，这提供了一个很好的“樱桃在顶部”，一个非常好的执行体验。
这是排版作为艺术，这在设计带来的审美愉悦中显而易见 - 无论语言如何。虽然从一开始就有一个漂亮的视觉语言肯定是一个优势。
米凯拉·基乌奇尼的《陶斯图迪奥》柔和的色调柔和了视野，因为我们深入研究了意大利最优秀的数字艺术家之一Michela Chuicini讲述数字故事的典范。
意大利设计有一些东西。一方面，它讲述了美好的生活，令人兴奋的时尚和浪漫的时刻，而它则跳动着一颗充满信念和勇气的强烈骄傲的心。Michela Chuicini在这个华丽的投资组合网站中俏皮地尊重这些传统，它的成功归功于排版的力量......在一条眨眼的鱼的帮助下，在个性的海洋中游泳。
纯粹专注于Michela的开创性主页，我们看到每个字母都是在选择和放置时对空间，功能，形式，更重要的是情感的深思熟虑和尊重。从顶部开始，我们看到逻辑和层次结构为UX带来了新鲜空气，而放大和厚实的小写字母则呈现出一种视觉舞蹈，将用户带入探索性情绪。到目前为止，网站顶部的高雅插图角色已经眨了眨眼，并在SEO中赢得了网站宝贵的几秒钟，因为您悬停并玩“测试鱼”，看看是否有任何其他惊喜等待着您。
对细节的关注增强了用户的感知，并将注意力转移到令人惊叹的“小东西”上，这些“小东西”有助于使这个主页在设计上取得巨大成功。在这一点上，在进一步检查网站之前滚动整个页面成为强制性的，直到最终冒险更深入地看看可以找到其他好东西。
Taostudio是艺术和排版的胜利，与书籍封面，海报或大预算年度报告一样有效。通过巧妙地使用排版，Michela的作品超越了多种设计媒介，是排版在设计中的力量的真实例子。
我们吃午饭兄弟？作者：亚历克斯·皮尔斯这个狡猾的网站可以很容易地包含在上面的“排版作为英雄”部分，但我们将其作为艺术包括在内，因为排版和颜色对这种设计赋予了多么强大的力量。事实上，我们午餐兄弟？为提供您可能在很长一段时间内见过的最大胆的排版而切入。
为了使这个网站更加令人惊讶，我们午餐兄弟？网站旨在提供德克萨斯州达拉斯的精选餐厅列表。如果Craigslist以这种方式走下去，那将是多么酷！
忘记你认为的关于目录站点的一切，因为这个简单但超大胆的基于类型的盛会需要引起注意。以这种方式使用排版突显了UX在主要基于类型的网站上是多么令人印象深刻。不需要按钮，不需要图像来加强议程，只需要纯粹的大胆话语来刺激眼睛和思想。确实很好吃！
5. 排版以增强感兴趣的数据
Elkanodata的《历史上的女性足迹》
为历史遗址设计可能是设计师将面临的最艰巨的任务之一。为什么？因为你正在一个被戏剧吞没的世界里处理事实。Elkanodata以全新的视角迎接了这一挑战，这在他们的《历史上的女性足迹》的设计中显而易见。
Elkanodata的熟练窥视者没有用严肃的字体和阴郁的情绪来压垮我们，而是使用排版来设定更积极的基调，首先创建一个独特且引人注目的登录页面。精心挑选的动画图像被友好而中性的字体所掩盖，并通过全大写的强度得到加强。这个雅致的合奏与宽敞而柔和的纹理背景并置，其净效果鼓励探索内部内容。
在这一点上，你的滚动手指接管了你，你立即遇到颜色的逆转和更多的权力类型，但演示在主题方面是柔和的。这有效地让你的大脑做好准备，准备好以中立的观点接收即将到来的内容。从这里开始，排版再次变化，专注于易读性，而标题仍然受到“高雅的艺术”处理，以保持艺术与信息的平衡。
历史上的女性足迹是一个很好的例子，该网站使用多种排版技术来征服一个非常艰难和复杂的项目。
6. 排版与社会问题
超越监狱 - 机场工作室
Beyond Prison是一个网站，展示了由于书面文字的固有力量，有争议的问题和排版是如何齐头并进的。从一开始，加载顺序就为用户提供了一个大胆的无废话段落，这有助于设置即将发生的事情的严肃但富有同情心的情绪。
在导航和图像中使用模糊是一个很好的触摸，有利于UX，同时提供柔化效果以平衡类型和问题的严重性。接下来，背景视频的标题和摘要的介绍动画是另一个创造性的奖励，它展示了对如何在视觉上表示正确的情感敏感性水平的特殊理解，这是该网站排版成功的关键。
你越深入这个看似不起眼的网站，你就越能意识到设计师通过正确使用排版和fx完美地确定了内容的上下文。这里需要吸取一些重要的教训。
6. 排版作为导航
C2 作者：Anna Travis
C2现在大约一岁，但仍然是一个现代谜。如果您是这个网站的新手，那么您将获得一种享受。如果没有，那么让我从“多维排版”这个术语开始，以激起你的兴趣。让我们来看看它。
当你第一次看到C2的主页时，如果你脑子里的声音喊着“眼睛糖果”，不要感到惊讶。一些网站似乎有“特别的东西”，而C2的特殊的东西来自一个精心制作的第一眼美学美和C中微观排版的几何美的混合。
具体而言，这些尺寸包括沉降到2D平面上的类型元素的柔和动画和空间运动;精心制作的宏观视图，以大写字母C为特色，在黑色和粉红色高光下形成鲜明对比;C形内镶嵌的“印刷游乐场”;排版元素的精湛构图和对细节的关注;最后，粉红色单词的额外维度充当直观且易于使用的导航。
你问的网站的其余部分怎么样，值得一看吗？绝对。这些家伙远远超过一个页面奇迹，这要归功于出色的过渡，时尚的布局，水平内容滑块等等。总体而言，C2是一款全屏游戏，它掌握了出色的数字设计和讲故事所固有的许多元素。而这一切都始于类型！
结语
以上只是排版的力量如何被用来影响网站的基调，影响，情感甚至UX的快照。通过抽出时间尝试排版，并鼓起勇气，您可以为项目添加额外的维度，同时从客户和同行那里获得宝贵的尊重点。像所有事情一样，实践经验是掌握这只具有挑战性的野兽的关键。
如果你有一个很棒的排版网站建议，那么请在下面的评论中分享。
编辑：尘渊文化
获得灵感，鼓舞人心！
