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

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

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

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

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

Инструкция для ленивых

Базовые правила

Правило 1. Выбранная вами гарнитура должна решать поставленную задачу.

Определите важность гарнитуры как графического элемента в вашей работе. Это часть общей композиции? Её основа? Незаметный путеводитель? Необходимое условие? способ акцентировать внимание? Выберем антикву? Гротеск? Дисплейный вариант?

Правило 2. Чаще всего, вы хотите, что бы текст можно было прочитать. Не забывайте, что читаемость меняется в зависимости от носителя информации.

Правило 2.1. Внешнее должно быть больше внутреннего. При этом использование золотого сечения и/или других приколов для определения нужного размера — не гарантируют качество конечного результата.

Правило 3. Используйте максимум три гарнитуры в одной работе. Лучше две.

Правило 4. Если вы используете больше одной гарнитуры, они должны контрастировать друг с другом. В этом смысл использования большей одной гарнитуры.

Типа инструкция

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

1. Спланируйте иерархию вашего текста

Во-первых, убедитесь, что вы хорошо разбираетесь в содержании и типографской иерархии, которую требует ваша дизайнерская работа. После тщательного анализа вы можете на пример понять, что вам нужно пять шрифтов (не гарнитур), чтобы покрыть различные заголовки, подзаголовки и выноски. Может ли ваш шрифт обеспечить достаточно разнообразия с помощью полужирного шрифта, курсива и заглавных букв? Или вам нужны два шрифта, чтобы выделить больше в иерархии? Три? Накидывайте план своей работы и созидайте. Не действуйте по обстоятельствам.

Рассмотрим примеры плохой и хорошей иерархии.

2. Посмотрите как это сделали другие дизайнеры

Дизайнеры до вас уже придумали способы использования рассматриваемых вами гарнитур, так что вам не нужно изобретать велосипед. Посмотрите вокруг и внимательно подумайте, что уже сделали другие. Например, на сайте Fonts in Use представлены варианты оформления, сделанные профессиональными дизайнерами из различных отраслей. Не бойтесь «похожести». Часто «скучный» и «знакомый» - ваши лучшие друзья, когда дело доходит до выбора гарнитуры. Есть веские причины, по которым некоторые шрифты часто используются для определенных целей - они просто очень хорошо работают.

3. Экспериментируйте стильно и просто

Вот пара советов для сборки вашей шрифтовой лаборатории

• Создайте типографический стайлгайд. Вы сможете быстро и легко тестировать свои палитры. Сайты типа Скетч и Web Font Specimen вам в помощь.
• Научится правильно составлять стайлгайды можно тут тык
• Спросите мнения коллег по цеху и непосвящённых людей, может вы что-то упустили.

4. Используйте логику, но не очевидность.

Да, мы все можем использовать футуру в теме «будущее» или «космос», а комик санс в работе для детей(пожалуйста нет), а папирус в теме «прошлое».

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

Про логику забывать тоже не стоит, на пример использование гарнитуры Trajan в работе по теме Древней Греции было бы небольшой глупостью, ведь Троян это Римский император и этот шрифт появился только в Древнем Риме. Вопрос: а какой шрифт вы использовали для обложки книги о Древней Греции? заставит вас смутится. Изучите историю ваших гарнитур, проверьте адекватность ваших решений.

6. Подумайте над семейством гарнитур

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

7. Используйте классические комбинации.

Если у вас творческий кризис или горящие мертвые линии — используйте готовые и проверенные варианты. Если вы выберете нейтральную комбинацию с засечками и без засечек, вы можете немного потерять в индивидуальности, но, по крайней мере, целостность вашего дизайна и месседжа не пострадает. Когда вы в последний раз использовали Open Sans и Roboto и жалели об этом? Признайте: вы никогда не добьетесь гармонии между Stout Deco и Bodoni. Вместо этого обратитесь к уважаемым ресурсам, связанным с типографикой. Посмотрите, с чем согласны профессиональные дизайнеры. Вероятно, у вас уже есть своя работающая классика. Возможно, те же самые сочетания являются самодостаточными и имеют высокое качество. Вы предадите их, прежде чем они предадут вас.

8. Ограничивайте свою палитру

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

В этом примере мы объединили Roboto с Georgia, первоначально разработанного Мэтью Картером в 1993 году. Что-то старое и что-то новое, вы можете пройти долгий путь со своим собственным стилем:

Типа инструкция для НЕ ленивых

Основное шитшоу начинается!

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

Разборчивость

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

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

• Выбирайте гарнитуры с обычными буквами. Буквенные формы, состоящие из уникальных форм, художественных деформаций, чрезмерного орнамента или других новаторских элементов дизайна, заставляют читателя сначала обрабатывать то, что он видит, а не просто воспринимать сообщение. Внешний вид всегда продаётся по цене его разборчивости.
• Выбирайте гарнитуры с большим интервалом. Сосредоточенное отслеживание строчки, заставляет глаз заполнять визуальные пробелы между различными формами, составляющими разные формы букв, тем самым замедляя время, необходимое как для распознавания форм букв, так и структур слов и предложений. Большое расстояние позволяет глазам двигаться настолько быстро, насколько позволяют когнитивные навыки читателя.
• Выбирайте гарнитуры с большей высотой по x относительно других гарнитур. Низкая x снижает разборчивость некоторых букв. Апертура или опененги с похожими строчными буквами, такими как «c» и «e», выделяются с большей легкостью при большой высоте по x. Обратите внимание: высота по x не должна быть «высокой» относительно самой себя(автор надеется, что вы поняли этот бред). Размер, толщину и ширину шрифта следует выбирать только в соответствии с высотой шрифта по x. Конечно, на первый взгляд один шрифт с большей высотой по x может показаться более разборчивым, чем другой, но последний просто установлен слишком маленьким (или слишком жирный или слишком сжатый). Кроме того, большая высота по оси x помогает только нескольким буквам, таким как e, s, a (с двухэтажной формой). Другие символы (с нижними точками, диакритическими знаками) страдают от большей высоты по оси x.

Читаемость

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

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

Советы по удобочитаемости:

• Выберите гарнитуры, которые были разработаны для той цели, для которой вы их используете (дисплейные шрифты для заголовков, гарнитуры основного текста для основного текста и т. д.). Выбор шрифта, предназначенного для привлечения внимания, например заголовков или плакатов, означает, что он не будет хорошо работать в качестве гарнитуры основного текста, когда будет много текста. И наоборот, шрифт, предназначенный для долгого чтения, теряет свою значимость, пропорционально его увеличению.
• Выровняйте текст «по левому краю» для удобного интервала между словами в вебе. «Принудительное выравнивание» текста или выравнивание без дефисов всегда создает уродливые строчки и неудобные интервалы, из-за которых читатель теряет естественный поток текста, поскольку глазу приходится совершать различные прыжки, чтобы закончить слова и предложения.
• Убедитесь, что высота вашей строки больше, чем размер шрифта для многострочного текста. Глазу сложно проследить за строкой текста и оставаться «на правильном пути», если строки над и под ней слишком близки к ней. Наши глаза легко сбиваются с толку, особенно при переходе от конца одной строки текста к другой. Сколько раз вы дважды читали одну и ту же строку текста на больших интервалах? Не заставляйте своих читателей работать больше, чем они должны.

Так, самые ощутимые вещи мы разобрали, едем в логику и красоту.

Замысел Гарнитуры

Очень полезно учитывать замысел шрифта. Многие популярные шрифты имеют подробные описания и обзоры, поэтому непростительно не знать хоть что-то о своем выборе. Если шрифт был разработан для вывесок, как Cooper Black, он, вероятно, не подойдет для основного текста книги. Это может быть очевидным примером, но не упускайте тонкости в своем собственном выборе. Опять же, вам нужно всего несколько секунд, чтобы что-то найти, или открыть приличную книгу по типографике, чтобы получить некоторые основные факты, и вы будете мудрее. Еще хорошим решением было бы продолжать следить за обновлениями в нашей группе!

Эстетика

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

В этом примере мы создали две комбинации шрифтов. Первый, Original Surfer и Gabriola, создает эстетику, больше подходящую для детского музея, чем для банка. Вторая комбинация состоит из Clarendon и Bembo, что соответствует теме, как хорошо сшитый костюм топ менеджера.

Совет по оценке эстетики:

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

Настроение

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

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

Совет для понимания настроения:

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

Небольшая подсказка.

Ваш личный выбор

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

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

Подсказка о личном выборе:

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

Несколько технических соображений

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

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

Чтобы дополнить этот список, вы можете подумать, есть ли у гарнитуры полный набор лигатур. Отсутствующие лигатуры могут выглядеть непривлекательно при больших размерах. Поддельные заглавные буквы обычно выглядят странно, потому что ширина штриха не компенсируется. Короче говоря, лучше выбрать максимально полный шрифт. А если вы выберете бесплатные гарнитуры, вы обнаружите, что у них часто отсутствуют эти важные «дополнения». Убедитесь, что бесплатные гарнитуры имеют именно те функции, которые вам нужны для вашего дизайна, и что они лицензированы для работы, которую вы делаете.

Подходы и советы коллег по цеху.

Кэмерон Молл. UX Дизайнер

1. Пользуется готовыми палитрами.
2. Подбирает новый шрифт только когда на это есть время.
3. Уделяет большое внимание размерам и соотношениям гарнитур.
4. Часто тестирует сочетания верхнего и нижнего регистра.
5. Как только выбирает гарнитуры, придерживается решения до конца.

Джон Бродли. Писатель

1. Проявляйте уважение к контенту, досконально изучите тз и ваши решения.
2. Попробуйте прочитать то, что вы сделали. Тестируйте свои решения.
3. Определите вашу аудиторию.
4. Распечатайте вашу работу и посмотрите еще раз.
5. Помните — типография это искусство и оно не может быть объективным.

Дэн Майер. Графический дизайнер.

1. Воспринимайте ваш проект как потенциальную пару, а ваш шрифт, как одежду для свидания. Оденьтесь соответственно атмосфере встречи.
2. Зайдите дальше с аналогией одежды, выделяйте семьи шрифтов, составляйте каталоги и палитры. Изучите все тонкости что бы всегда делать правильный выбор.
3. Не будьте слабаком. Делайте заметный контраст, красивую картинку. Не соглашайтесь на полумеры, принимайте сильные решения.
4. Тише едешь — дальше будешь. Не забывайте, вам может хватить всего несколько хороших решений для блестящей карьеры и успеха в вашем деле!

Заключение и последний совет.

Забудьте все, что вы сейчас прочитали!

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

Спасибо за ваше внимание, давайте продолжим этот великолепный путь.