Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

5 советов по сочетанию шрифтов

30 августа 2018 | Опубликовано в статьюшечки | Нет комментариев »

Словосочетание «комбинирование шрифтов» для кого-то звучит невероятно привлекательно, а кого-то повергает в уныние. Далеко не все дизайнеры любят возиться со шрифтами. Но почему так важно правильно сочетать шрифты? Есть ли способ сделать это быстро и забыть? Теоретически можно, но это не совсем в ваших интересах.

Выбор хорошо сочетающихся шрифтов поможет вашей странице быть более функциональной и эстетически привлекательнее. Также это ваш графический интерфейс будет выглядеть профессионально-выполненным, а текст будет хорошо читаться.

Два шрифта необязательно будут хорошо смотреться вместе, даже если каждый из них в отдельности вам нравится. Какими бы замечательными они ни были, шрифты вполне могут не сочетаться, а это плохо скажется на вашем дизайне.

В этой статье мы рассмотрим лучшие сочетания шрифтов, которые хорошо работают вместе в дизайне сайта, графики и полиграфии.

Важность правильного сочетания шрифтов

Почему так важно, чтобы шрифты хорошо сочетались? Все просто. Неправильно подобранные гарнитуры усложняют пользователю чтение контента. Когда вам приходится прилагать усилия, для того, чтобы прочесть текст, велика вероятность того, что вы просто передумаете его читать.

Так же как и с цветовой схемой, чтобы обеспечить вовлеченность пользователя, правильные сочетания необходимы. Важно подобрать такой шрифт, чтобы ваш заголовок явно выделялся на фоне остального текста, и пользователи точно понимали что это он. В случае с заголовком ограничений не так много, как с основным текстом, и здесь вы можете выйти за рамки.

А вот основной текст должно быть легко читать, так как именно его будет больше всего на вашей странице. Ну и конечно вся типографика — и основной текст,  и заголовки и подзаголовки — должны правильно работать вместе.

Понимание различия шрифтов

Прежде чем мы начнем разбирать сочетаемость шрифтов, давайте быстро пройдемся по типа гарнитур.

font types

Шрифты с засечками

Шрифты с засечками отличаются тем, что буквы начинаются и заканчиваются штрихом.

Шрифты без засечек

У этого типа шрифтов напротив нет штрихов.

Рукописные шрифты

Эти шрифты имитируют письмо от руки. Часто буквы соприкасаются, переходя друг в друга.

Декоративные шрифты

Это самая разнообразная группа шрифтов. Декоративные шрифты могут быть очень разными, и используются в основном в заголовках или надписях, и почти никогда для текстов большого объема.

Как правильно подобрать сочетание

Теперь, когда мы разобрались с тем, какие бывают шрифты, давайте посмотрим как они работают вместе.

Вот несколько подсказок, которые помогут вам правильно выбрать гарнитуры, которые будут соседствовать на странице.

1. Контраст вместо конкуренции

Шрифты должны контрастировать, а не конкурировать на странице. К примеру, два декоративных шрифта скорее всего будут конкурировать за внимание пользование.

Чтобы этого не происходило, выбирайте один декоративный или рукописный шрифт, а второй — с засечками.

Главное при подборе двух шрифтов, чтобы они не были слишком схожи. Гарнитуры должны различаться настолько, чтобы пользователь четко видел различия.

Чтобы добиться этого абсолютно точно, вы можете экспериментировать с жирным и наклонным вариантами шрифтов. Это также поможет создать то, что в дизайнерском мире называется иерархией контента.

Иерархия в типографике это когда когда заголовок очевидно больше подзаголовка, подзаголовок больше обычного текста.

font family

2.  Найдите большое и классное семейство шрифтов

Когда вы найдете семейство шрифтов, которое вам действительно понравится, самая тяжелая часть по созданию типографической иерархии будет сделана за вас.

В идеале, такое «супер-семейство» должно включать шрифты с засечками и без, а также их варианты в жирном и наклонном виде.

Такой набор очень полезен, потому что вы можете быть уверены, что эти шрифты хорошо работают вместе, раз они являются частью одного семейства. Все что вам нужно — выбрать нужные вариации.

3.  Не используйте больше трех разных шрифтов

У каждого шрифта своя личность. Когда их много, разные шрифты плохо работают вместе, как много хозяек на одной кухне.

Ограничьтесь одним-двумя шрифтами, чтобы избежать ощущения перегруженности дизайна и хаоса в типографике на странице.

4. Работайте с кернингом

Кернинг — это интервалы между буквами. Не бойтесь экспериментировать с этим значением, и вы сможете добиться действительно хороших результатов.

Однако далеко не все шрифты хорошо выглядят с увеличенным межбуквенным расстоянием.

Например, для рукописных шрифтов увеличение кернинга чаще всего сделает шрифт менее плавным, буквы не будут перетекать одна в другую.

А вот в надписях, где все буквы заглавные, увеличение интервала между символами часто выглядит хорошо.

В этом примере слово “mozzarella” написано рукописным шрифтом со стандартным расстоянием между буквами, а подзаголовок “the superior cheese” выведено заглавными буквами, шрифтом без засечек и с увеличенным кернингом.

5.  Не используйте заезженные шрифты

Использовать в дизайне заезженные, набившие оскомину шрифты — большой дизайнерский грех. Это может отвлечь от самого дизайна, вызвать недоверие. Да и зачем использовать то, что уже всем надоело, когда так много свежих и качественных вариантов?

Некоторые из заезженных шрифтов: Comic Sans, Impact, Arial, Bradley Hand, and Papyrus.

Хорошие примеры сочетаний

Давайте посмотрим несколько неплохих примеров сочетания шрифтов. В этих примерах наглядно продемонстрированы примеры, о которых мы говорили выше.

Pinyon Script и Josefin Sans

Эти два шрифта хорошо смотрятся вместе благодаря плавности и текучести рукописного шрифта и простоты шрифта без засечек с увеличенным кернингом.

Рукописный шрифт привлекает внимание, а шрифт без засечек дополняет его, описывая более объемную, уточняющую информацию.

pinyon example

Playfair Display и Rosario

Солидный и крупный шрифт Playfair Display в заголовке и тонкий, лаконичным Rosario в подзаголовке создают отличную пару в этой ситуации.

Гарнитуры не отвлекают внимание друг от друга и хорошо работают вместе.

Pirou и Aleo

А вот пример, в котором использовано два шрифта, но один из них — в двух вариациях.

Игривый Pirou выделяет слово “Gatsby”. А простой Aleo отлично его дополняет.

Еще более интересным это сочетание выглядит из-за того, что заголовок и подзаголовок написаны заглавными буквами, а основной текст — обычным способом.

Здесь также четко подана иерархия. Читатель сразу понимает какой текст самый важный, какой второстепенный и какой описывает детали.

Автор статьи webfx.com

Перевод — Дежурка

Смотрите также:




Коментарии запрещены.