Подбор шрифтов в графическом дизайне

Леонид Родинский

Копирайтер
21 August в 16:47

Типографика – наука об оформлении текстов – сродни речи. Она может быть чистой, разборчивой или не очень, грамотной или наоборот, комфортной, спокойной и ещё много-много причин, по которым голос одного человека воспринимается с доверием, а другого внушает неприязнь. Пускай даже и подсознательную.

Отношения

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

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

Начальные параметры

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

  • Удобочитаемость – самое субъективное понятие, нуждающееся в дополнительных пояснениях.
    • Во-первых, комфорт, зависящий от привычек аудитории – например, славянская и азиатская группы приучены к различному зрительному восприятию ширины глифов (элементов письма). Иными словами, мы не обращаем внимания на то, что «ш» или «щ» шире, нежели другие буквы, а корейцу это буквально острый нож прямо в глаз.
    • Во-вторых, читабельность. Понятие, как правило, относится к одному слову – если каждое из них легко воспринимается, значит и в общей массе царит порядок.
    • В-третьих, удобочитаемость. Это уже комплексное явление, включающее и грамотность материала, и ширину строки, интервалы, структурирование… Для интернета важен ещё один критерий – мультиплатформенность. На различных устройствах с меняющимся разрешением и размером экрана, текст изменяет свои качества. Удобочитаемость при этом может быть сильно нарушена.

  • Ширина шрифта. Различаются узкие, нормальные и широкие варианты. Последний часто встречается в заголовках, а первый в сносках и пояснениях. Отдельно рассматривается моноширинная группа, где все литеры имеют одинаковый размер.
  • К предшествующему критерию относится и ёмкость – объёмная или убористая.
  • Контраст и различимость. Ещё два стоящих рядом понятия, но обладающие индивидуальными характеристиками. Различимость применима к узнаваемости букв и позволяет интуитивно не перепутать «а» и «о» в стилизованных рукописных наборах, столь почитаемых многими дизайнерами. Контраст – это из области оформительских приёмов при помощи авторских гарнитур. В стандартной кириллице, по умолчанию присутствующей в большинстве приложений, она всегда нормальная или высокая.
  • Прямое и курсивное начертание. Часто встречается в оформлении материала, когда необходимо выделить фрагмент текста.
  • Светлое (нормальное), жирное и полужирное насыщение, относящееся к пропорции между внутренним просветом букв и толщиной штриха.

Заключительный, самый простой раздел – это размер (кегль).

Оформительские качества

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

  • Sans-Serif – ровные, без засечек и брусков. Отлично подходят для оформления заголовков, подзаголовков, лозунгов и других акцентированных эпизодов текста. Могут иметь острые или скруглённые соединения штрихов и такой же эффект окончания линий. Тонкие гарнитуры хорошо смотрятся в контенте, придавая ему элегантность и лёгкость.
  • Serif – шрифты с засечками. Традиционный вид букв и для полиграфии, и для веб-сайтов. Придает строгость, небольшую жёсткость, удачно трансформируется в зависимости от вида и толщины окончания штриха.
  • Script – группа стилизованных рукописных гарнитур. В ней присутствуют образцы, которые можно без всякой натяжки именовать эталоном каллиграфии. Такие шрифты удачно ложатся и на брендовые элементы фирменного стиля, и на создание авторских фрагментов оформления. Крайне редко встречаются в виде основного шрифта для текста из-за своей низкой читабельности.

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

Короткие рекомендации

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

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

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

Помните об этом!

Наши работы

  • Доработка сайта компании Ферропорт-Сервис
    Задача: 

    Сделать сайт более удобным для пользователей

    Что мы сделали: 

    Полностью переделали структуру 

    ​Улучшили юзабилити

    Переработали каталог продуктов

    Результат: 

    Удобный и функционирующий сайт

  • океан - морепродукты
    Задача: 

    разработать привлекательный дизайн для упаковки замороженных морепродуктов компании «Океан». 

    Что мы сделали: 

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

    Результат: 

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

  • Счастливая корова - превью
    Задача: 

    Создать креативный дизайн упаковки молока «Счастливая корова»

    Что мы сделали: 

    Разработали концепцию бренда

    Создали оригинальный дизайн упаковки продукции

    Результат: 

    Свежий и стильный дизайн упаковки стал фаоктором продвижения продукции клиента на рынке, что положительно отразилось на уровне продаж

  • Задача: 

    Создать стильное оформление сообществ в социальных сетях для турагентства Travel Club

    Что мы сделали: 

    Разработали единый стиль оформления для всех соцсетей

    Создали стильное и продающее оформление

    Результат: 

    Сообщества клиента получили привлекательное оформление

    Бренд стал узнаваемым в соцсетях благодаря дизайну сообществ в фирменном стиле

  • Урожайный год - превью
    Задача: 

    Разработать концепцию бренда и дизайн упаковки для линейки продукции «Урожайный год» 

    Что мы сделали: 

    Разработали концепцию дизайна

    Создали кративный дизайн для упаковки каждого вида продуктов

    Результат: 

    Продукция клиента представлена в стильной и продающей упаковке

    Продажи продукции клиента пошли вверх

  • Кейс создание фирменного стиля и разработка логотипа для сайта teramax
    Задача: 

    Разработать фирменный стиль сайта

    Что мы сделали: 

    Разработали авторские художественные элементы

    ​Создали шрифтовую гамму

    ​Разработали "природный" логотип

    Результат: 

    Фирменный стиль с природным уклоном, подчеркивающим основной концепт будущего сайта

Наша команда

  • Вадим Скопинцев
    Генеральный директор

    Сделаем лучшее решение для привлечения клиентов из интернета, сделаем продажи!

  • Дмитрий Карпинский
    Директор по пропаганде

    Экспонента, бизнес должен и будет расти по экспоненте! Продавать, будете продавать!

  • Евгений Белоусов
    Директор по продажам

    Предложу варианты решения ваших проблем- вам останется лишь выбрать!

  • Павел Шульга
    Старший специалист по контекстной рекламе

    Грамотно используем Ваш рекламный бюджет. Выйдем на максимум заявок!

  • Евгения Лю-Ти-Фу
    Руководитель PR направления

    Ваш имидж в наших руках. Если вас нет в Интернете, то вас нет в бизнесе!

  • Диана Зайцева
    UX/UI дизайнер. Руководитель разработки

    «Протачиваем» Ваш ресурс для получения им продающих свойств. Захватываем клиентов для Вас!

  • Леонид Белкин
    Менеджер проектов

    Сделаем Ваш сайт продающим. Конверсия будет расти!

  • Дмитрий Трацевский
    Руководитель разработки

    Разработанные нами сайты работают как часы!

  • Татьяна Николаева
    Менеджер проектов, переводчик

    Пишем только уникальные и интересные тексты на русском и английском. Вам понравится!

  • Кирилл Миченус
    Разработчик

    Разработаем классный, продающий сайт. Внедрим интересные идеи!!

  • Марина Петренко
    Контент-менеджер

    Раскрываем все положительные стороны Вашего бизнеса для увеличения целевой аудитории!

  • Виктор Токмачев
    Менеджер по работе с иностранными клиентами

    Наши идеи подходят всем - иностранные клиенты охвачены!

  • Татьяна Ромакина
    Копирайтер

    Создадим уникальные продающие статьи. Лучший контент для Вашего сайта!

  • Леонид Родинский
    Копирайтер

    Написать уникальные тексты и заголовки – этого мало. Наполняем сайты неповторимым содержанием!

  • Анастасия Бондарева
    Копирайтер

    Правильно написанный рекламный текст способен творить чудеса! Удивительно, но слова могут продавать! И мы Вам это докажем!

  • Вячеслав Киосе
    Копирайтер

    Текст – это не просто слова. Посетители Вашего сайта получат информацию с внятным и понятным смыслом.

  • Стань одним Из нАс
    Трудоустройство

Клиенты

Наши услуги

САМОЕ ИНТЕРЕСНОЕ НА СТРАНИЦЕ
“ЗЕКСЛЕР” В Facebook и ВКОНТАКТЕ