22
Авг

Единственное руководство по сочетанию шрифтов для DIY-дизайна

источникdesignforfounders.com
авторHeidi Pungartnik

Говорят, типографика — 95% графического дизайна. Она может разрушить любую идеальную цветовую гамму, макет или бережно собранный сайт. Она может заставить людей прекратить читать текст. Ведь они подумают: «подождите, на этой странице чего-то не хватает». У типографики есть власть сделать логотип узнаваемым, даже если он применяется со старой Helvetica Bold.

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

Как выбрать шрифт

Сначала поговорим о выборе шрифтов в общих чертах.

По контенту

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

Будет ли это заголовок? Будет ли он дополнением к шрифту? Некоторые шрифты нельзя использовать для текстовых блоков, например:

По характеру

Некоторые шрифты, как Helvetica, довольно непримечательны — своим дизайном они ничего не передают: ни сообщение, ни историю. С другой стороны, есть шрифты с большим характером, например, Kaushan Script. Не забудьте устроить шрифту тест-драйв и подумайте, как его характер соотносится с вашим брендом и аудиторией. Если вы продаёте свадебные платья, моноширинный шрифт не будет хорошей идеей. Если ваш бизнес не ремонтирует старые печатные машинки, такой шрифт не подойдёт.

Брать ли платный шрифт?

Почему вам вдруг захотелось купить семейство шрифтов по астрономической цене в $400, когда есть такое разнообразие бесплатных?

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

Проверьте глифы

Если вы проживаете в англосаксонской стране, вам это может быть безразличным, но я всё равно должен это упомянуть. Перед покупкой или выбором шрифта всегда проверяйте его на наличие всех необходимых вам букв. В прошлый раз я забыл проверить словенский поднабор букв и купил неправильный шрифт. Мне пришлось печатать букву «Č» во всех шрифтах гарнитуры, которые не включали её. Богиня типографики, будь ко мне милостива!

Я только что понял, что купил шрифт без «Č» #JUSTSLOVENEPROBLEMS

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

По «обстановке»

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

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

Наконец-то мы добрались до комбинирования шрифтов. Начинающим и самостоятельным дизайнерам я бы порекомендовал использовать только 2 шрифта одновременно, просто потому что подобрать 2 шрифта проще, чем 3.

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

  • заголовков и подзаголовков;
  • основного текста;
  • текста функционального дизайна (кнопки, примечания, метаданные)

1. Контраст

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

Неудивительно, что этот принцип очень полезен в подборе шрифтов. Если шрифты слишком похожи, то в паттерне будет недостаточно контраста. Паттерн не сработает. Как на этом примере:

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

2. Словолитни

Для неподготовленного зрителя сложно понять, есть ли в комбинации шрифтов достаточный контраст. Если вам с трудом даётся поиск разных шрифтов, попробуйте использовать два, изготовленных на одной словолитне (компании, создающие шрифты). Обычно, в этих шрифтах будет достаточно похожих черт, и они не будут

выглядеть неуместно.

Или вы можете взять семейство шрифтов и выбрать в нём два разных шрифта. Как эти два — Roboto Black and Light:

3. X-height

И ещё один совет для успешного сочетания шрифтов — сравнивать их по высоте строчных знаков. Это высота буквы «x» — она отличается от шрифта к шрифту, и часто шрифты с одинаковой x-высотой отлично подойдут друг другу.

Заключение

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

комментариикомментарии по теме