Кастомные шрифты в вебе

Комментарий написан для издания Цукерберг Позвонит

Александр Лашков: Стоит ли использовать в проекте бесплатные шрифты?

Я бы разделил вопрос на две части: стоит ли использовать кастомные шрифты и если да — имеет ли смысл платить за них. Мы в Mail.Ru Group активно занимаемся обновлением продуктов и хорошая типографика, естественно, важна в этом процессе. Сейчас ситуация благоприятная — все больше хороших кириллических шрифтов для самых разных задач, а благодаря сервисам типа Google Web Fonts и Typekit их подключение технологически сравнительно несложно.

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

  • Главная задача типографики в нашем случае — обеспечивать комфорт чтения и сканирования информации. Поэтому проверяйте рендеринг в браузере — на реальной верстке, а не в Photoshop. Хотя в его версии Creative Cloud появился приближенный к системному рендеринг, все равно в итоговой реализации возможны как минимум отхождения. А в худшем случае — абсолютная нечитабельность. Я собираю коллекцию таких примеров (картинка ниже), можете попробовать угадать сервис. Проверяйте в Windows 7, Windows 8 и Mac OS.
  • В продолжение — для сервиса с большой посещаемостью необходимо помнить о Windows XP и иметь механизм деградации до Core Fonts for the Web для нее. Хотя все проф.сообщество ненавидит ОС и ее официальная поддержка официально прекращена, там до сих пор сидит приличное количество пользователей. В системе очень сложная ситуация со сглаживанием шрифтов (зависит от комбинации сервис-пака и браузера) и если вы посмотрите на кастомный шрифт в IE6 пару минут, то глаза медленно вытекут.
  • Следите за размером подгружаемых шрифтов. Чем больше начертаний вы используете, тем тяжелее этот обвес для пользователя — оставляйте только действительно нужные. Помните, что у него может быть дорогой трафик и медленная скорость. Также можно оптимизировать сам шрифтовой файл, убрав оттуда ненужные вам символы типа иероглифов и арабской вязи. Хотя тут надо быть осторожным — многие производители шрифтов запрещают это в лицензии, поскольку есть риск поломать его тонкие настройки.
  • Кастомный шрифт можно использовать для заголовков и выделений, а также для основного текста. Для обывателя основной эффект достигается акциденциями, для задач дизайна они также дают наиболее видимый эффект, при этом проблем с их рендерингом меньше за счет меньших объемов и большего кегля. Почти весь геморрой с рендерингом — как в раз в основном тексте и проблемы в нем хуже всего влияют на читабельность. Возможно, вам будет достаточно ограничиться заголовками.
Проблемы в рендеринге шрифтов скриншоты сняты в Chrome для Windows 8

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

С платными на практике все непросто. К сожалению, лицензионная политика сервисов аренды типа MyFonts или Fonts.com абсолютно крохоборская для больших компаний. С нас берут деньги за ежемесячное количество показов, причем за масштаб экономию вы не получите. Так что за год проект с многомиллионной аудиторией может заплатить десятки тысяч долларов за использование шрифта — не очень разумное вложение денег. В некоторых ситуациях выходит, что разработать свой шрифт — дешевле аренды существующего! На круглом столе тематической конференции “Серебро набора 2013” я задал вопрос на эту тему и получил в ответ, мол, “раз вы такие большие — поделитесь!”. Не особо конструктивно.

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

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

Что касается Mail.Ru Group, то в прошлом году начали активно появляться продукты, использующие кастомную типографику. В 2014 это станет системным — ожидается много обновлений и сервисы постепенно выстраиваются вокруг нескольких шрифтовых решений. Ограничений и нюансов при большом масштабе много, так что будет чем поделиться — в виде развернутой статьи или презентации.

Leave a Reply

Your email address will not be published. Required fields are marked *