Заповеди дизайнера: составление шрифтовых пар

Дизайн интерфейса зависит от гармоничного подбора шрифтов. Сингапурский веб-разработчик Зелл Лью придумал удобную систему, которая быстро получила одобрение почти семи сотен дизайнеров. Его таблица 3х3 подбирает шрифтовые пары без особых затруднений.

Для ее применения достаточно запомнить три основных правила.

1. Рубленный + шрифт с засечками 

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

Узнать их несложно. Рубленым называется шрифт без засечек. Такой, как знаменитая Helvetica:

Если засечки присутствуют, и они прямоугольной формы, то шрифт называют брусковым (или, иногда, египетским), как, например Museo Slab.

Прочие шрифты с засечками называются антиквами. Яркий их образец — Garamond.

Остальные подвиды для разработки интерфейсов подходят слабо, если подходят вообще. Моноширинные, в которых символы равны по ширине, чаще всего применяются в таблицах и кодах (пример — Menlo).

Рукописные шрифты, такие как Dancing Script, уместны в коротких заголовках, текстах приглашений и открыток.

Акцидентные же шрифты (сюда входят также декоративные и орнаментальные), хотя и могут обладать признаками рубленых, брусковых и антикв, применяются только в больших заголовках из-за главного принципа: чем больше размер их букв, тем красивее и отчетливее они смотрятся. Ярким примером служит Freight Display, который, несмотря на сходство с антиквами, при уменьшении размера приобретает «размытый» вид, а его тонкие штрихи практически исчезают:

Больше о классических разновидностях шрифтов, областях их применения и создаваемых ими настроениях — в статье «Понимать буквально».

2. Подобное к подобному

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

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

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

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

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

Стили брусковых шрифтов запомнить несложно — они повторяют стили рубленых гарнитур, определяются теми же признаками и в пару ставятся по принципу «подобное к подобному».

Пары с антиквами строятся по следующему принципу: гуманистические — старые, гротески — переходные, геометрические — новые. 

Стили антикв определяются особым параметром — контрастом штрихов, т.е. толщиной линий в одном символе. Заметнее всего она в буквах «е» и «о».

Этих стилей три:

1. Старая (или гуманистическая) —  слабый контраст штрихов — самая толстая и самая тонкая части практически одинаковы, а буквы всегда наклонены.
2. Переходная антиква — средний вариант: контраст штрихов заметно сильнее, чем у старого стиля, но слабоват для нового.
3. Новая антиква  — контраст штрихов силен, символы прямые и без наклона.
   
   

3. Подбираем родственные шрифты

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

Сочетание «рубленые + засечки» помогает создать контраст, а «родственность» повышает гармонию. 

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