Найти тему
Юрий Угаров

Как подобрать шрифт для текста?

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

— Окей, как же правильно подобрать эти шрифты, чтобы получилось как надо?

Для начала, немного теории:)

-2

Есть очень много классификаций шрифтов и в них чёрт ногу сломит. Хрен разберёшсья.

Но есть самая простая классификация, знать которую достаточно.

Она классифицирует шрифты приблизительно так:

  • Есть Антиква — это шрифты с засечками.
Засечки — это такие маленькие чёрточки на кончиках букв.
Засечки — это такие маленькие чёрточки на кончиках букв.

  • Есть Гротеск — это шрифты без засечек.
Как видишь, тут засечек нет — всё ровно)
Как видишь, тут засечек нет — всё ровно)

  • Ну и всё прочее… — это всякие там рукописные шрифты (которые имитируют почерк или каллиграфию), МОНОширинные (как в печатных машинках или в редакторе кода), символьные (значки, символы, смайлы) и акцидентные — это любые декоративные шрифты для оформления крупных надписей, заголовков и логотипов.
Запомни!
Антиква — шрифт с засечками, гротеск — без засечек.
Теперь ты можешь использовать эти слова в диалоге с дизайнерами и казаться умнее :D

Итак, как подобрать шрифт для текста?

Для длинного текста — используй шрифт с засечками (антикву)

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

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

Среди антикв хорошим выбором будет Georgia или Garamond (классическая антиква, которая идет в комплекте с Microsoft Office), а также Iowan Old Style (один из шрифтов Mac OS), Charter (хорошо подходит для печати в маленьком размере) и PT Serif.

Для короткого текста — используй шрифт без засечек (гротеск)

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

Грубо говоря, используй гротеск для всего, что не является длинным текстом — не ошибёшься :)

Из гротесков могу порекомендовать Roboto, Montserrant, Gilroy, Verdana, Helvetica Neue и Helvetica. Ещё я частенько использую San Francisco — фирменный шрифт Apple, который можно скачать на их официальном сайте (в систему он не предустановлен, что странно 😑

А где брать шрифты?

Самое простое — использовать предустановленные в операционную систему шрифты.

Но вряд ли ты сможешь ограничиться ими. По этому…

Скачивай бесплатные шрифты :)

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

Пиратские шрифты я вообще не рекомендую использовать. Если, конечно, ты не хочешь прилететь на штраф до 5 мил. ₽ за отсутствие лицензии шрифта…

Так где же их искать?

Клондайк шрифтов с бесплатной лицензией — это Google Fonts. Там более чем достаточно кириллических шрифтов семейств (а каждое семейство включает в себя несколько начертаний).

Вот так выглядит сайт Google Fonts
Вот так выглядит сайт Google Fonts

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

Шрифтовая пара — это шрифт заголовка + шрифт текста.
Популярные шрифтовые пары для Roboto. Можешь брать пары прямо с сайта — не ошибёшься)
Популярные шрифтовые пары для Roboto. Можешь брать пары прямо с сайта — не ошибёшься)

Помимо Google Fonts имеет смысл поглядывать интернет-магазины шрифтов (например MyFonts) на предмет акций и прочих халяв. Зачастую, у популярных шрифтов есть парочка бесплатных начертаний.

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

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

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

А если хочется чего-то особенного?

Тогда покупай шрифт.

Купить шрифт можно в интернет-магазинах шрифтов(тот же MyFonts) или на сайтах производителей (Например: Parachute, Commerical Type, Grilli Type и другие. Из отечественных: «Паратайп», Студию Лебедева, Type Today и Brownfox).

Стоимость шрифтов порядка 3 000 ₽ за одно начертание. Но можно сэкономить, купив всю шрифтовую семью разом — оптом дешевле 😅

Но это ещё не всё!

-7

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

Например, возьмем всем известный шрифт Comic Sans. Он отлично подходит для комиксов (где я его частенько использую) — там он уместен, потому что и был придуман для этого.
Но будет очень странно набирать им текст для сайта по юридическим услугам.
И не стоит использовать на вывеске магазина товаров для новорождённых готику, а для кафе японской кухни вряди подойдёт славянский шрифт.

Типографика решает!

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

  • Размер
  • Начертание (например, жирное или курсивное)
  • Расстояние между строчками (интерлиньяж)
  • Расстояние между буквами (трекинг и кернинг)
  • Отступы и поля
  • Использование типографских символов (например, длинные тире и кавычки «елочки»)
  • Цвет, композиция, визуальная иерархия, наличие других графических элементов….