О том, как важен правильный выбор
Литеры нищего бродяги из рукописи Einkaeign 1 — Stafabók; Ísland, 1928
Для начала — исторический анекдот. Узнав, что на Снорри готовится покушение, его друзья отправили ему записку с предупреждением, но он проигнорировал её, потому что она была написана «хромыми рунами», и позже был зарублен заговорщиками в подвале своего дома. В «Саге о Стурлунгах» говорится:
«Снорри Стурлусон получил письмо от Одда Свеинбьярнарсона. Там были „Литеры нищего бродяги“, и не смогли они их прочесть, хотя и казалось им, что значат они что-то особенное».
Типографика пронизывает нашу жизнь, формируя визуальную и информационную среду. Но можем ли мы охватить весь масштаб и многообразие её влияния? Здесь на помощь приходит предложенная философом Тимоти Мортоном концепция гиперобъектов — сущностей, настолько массивных и распределённых в пространстве-времени, что они ускользают от прямого восприятия. Глобальное потепление, пластиковое загрязнение, интернет, государство, культура — примеры гиперобъектов, чьё присутствие пронизывает реальность.
Что если рассмотреть типографику как гиперобъект? Шрифты незаметно формируют нашу визуальную среду, влияют на мышление и поведение. От выбора гарнитуры на указателе может зависеть безопасность на трассе. От кегля в учебнике — утомляемость детей.
Но это всеприсутствие типографики делает её неуловимой. Мы воспринимаем текст, но не замечаем его визуальную форму. Шрифт растворяется в потоке информации, становится фоном жизни.
Типографика (да впрочем, и вообще письменность) обладает всеми качествами гиперобъекта. Она тотальна и неочевидна, близка и недоступна прямому схватыванию. Мы можем исследовать отдельные проявления «шрифтового» гиперобъекта. Но охватить его целиком, во всех хитросплетениях связей и влияний — задача непосильная.
Конечно, сравнение шрифта с глобальным потеплением может показаться спорным. Но эта метафора заставляет нас по-новому взглянуть на масштабы и последствия нашей работы. В мире, насыщенном визуальной информацией, типограф становится своего рода экологом, от чьих усилий зависит здоровье и устойчивость графической среды. И это налагает на нас огромную ответственность — за каждый выбор гарнитуры, за каждую строчку вёрстки, за каждую букву.
Особенности экранной типографики
Выбирайте шрифты, которые были специально разработаны или оптимизированы для экранного отображения. Они часто имеют упрощённые формы, более открытые внутрибуквенные просветы и утолщённые штрихи, что улучшает читаемость при мелких размерах. Хорошие примеры — Verdana, Georgia, Source Sans.
Если предполагается набор текста мелким кеглем, лучше избегать шрифтов с сильным контрастом штрихов, тонкими соединениями и сложными декоративными элементами (засечками, росчерками и т. д.). При масштабировании все эти тонкие графические нюансы могут теряться или искажаться. Поэтому для основного текста на экране более надёжны гротески и малоконтрастные антиквы.
Обращайте внимание на хинтинг шрифта — специальную инструкцию, которая «подсказывает» программам, как лучше отрисовывать знаки на пиксельной сетке экрана. Хорошо отхинтованный шрифт будет выглядеть чётче и разборчивее даже в мелком кегле. При подборе веб-шрифтов стоит тестировать их на реальных устройствах и выбирать тот, который обеспечивает оптимальную растеризацию в нужных размерах.
Ещё один фактор, влияющий на выбор шрифта, — особенности технологии рендеринга (субпиксельное сглаживание и др.) в разных ОС и браузерах. Поэтому желательно проверять, как выглядит ваш текст на основных целевых платформах. При необходимости может потребоваться использовать альтернативные CSS-свойства или добавить в код условия для разных устройств.
Рендеринг шрифтов может значительно различаться в зависимости от платформы и технологии:
Cleartype (Microsoft): Улучшает рендеринг шрифтов, размывая их по вертикали, но при этом они выглядят более чёткими на экранах с технологией Cleartype.
Core Text (Apple): Сохраняет больше деталей шрифта, что может сделать его более жирным на мелких кеглях.
Direct Write (Microsoft): Добавляет размытие по горизонтали для большей резкости.
Различимость
Закрытая аппертура некоторых неогротесков может серьёзно снижать различимость знаков, особенно в неблагоприятных условиях — при малых размерах, низком разрешении, расфокусировке или плохой контрастности. На приведённом примере хорошо видно, как обрезанные, закрытые формы цифр «2», «5», «8» в размытом состоянии становятся практически неотличимы друг от друга. Цифра «8» почти сливается с «3», «6» и «9». Это может приводить к ошибкам прочтения важной числовой информации.
Закрытые неогротески вроде Helvetica стремятся «замкнуть» контур знака, минимизировать внутрибуквенные просветы. В чётких очертаниях это создаёт ощущение цельности и лаконичности рисунка. Но при ухудшении условий восприятия недостаток «воздуха» внутри знаков оборачивается потерей узнаваемости форм.
Гуманистические гротески с более открытыми формами в этом смысле оказываются практичнее. Благодаря увеличенным просветам внутри букв и цифр силуэт знаков остаётся распознаваемым даже в сложных ситуациях. Характерные детали начертания дольше «читаются» при размытии или малом размере.
Так что при выборе неогротеска для текста, особенно мелкого кегля, всегда стоит тщательно изучать нюансы рисунка каждого знака. Общий минималистичный стиль не должен достигаться за счёт потери индивидуальности и различимости форм. Хорошо, когда внутри гарнитуры уже заложены альтернативные варианты начертаний критических знаков. Например, некоторые современные неогротески предлагают на выбор несколько рисунков «проблемных» букв и цифр — с более открытыми и закрытыми формами. Таким образом дизайнер может выбрать нужную степень разборчивости, исходя из размера и способа воспроизведения текста.
В случае с Гельветикой, к сожалению, приходится мириться с её врождённым «дефектом» различимости либо использовать другой шрифт. Хотя своеобразие её цифр давно стало частью фирменного стиля многих известных брендов и само по себе является сильным графическим приёмом.
В некоторых неогротесках трудно отличить «1», «I» и «l» — особенно для интерфейсов лучше выбирать такие, где эти глифы отчётливо разнятся.
Некоторые гротески, как мы видим на примере Helvetica, имеют практически идентичное начертание этих знаков, что может приводить к путанице и ошибкам при чтении.
Поэтому при выборе гротеска для UI-дизайна следует обращать внимание на следующие моменты:
1. Цифра «1» должна чётко отличаться от букв по своей форме. Хорошо, если у неё есть характерные засечки сверху и снизу, как в FF Meta или FF Unit. 2. Иногда строчная «l» имеет характерный изгиб или закругление, отсутствующие у «I» и «1». Этот приём используется в Lucida Grande и других гуманистических гротесках. 3. В некоторых шрифтах, особенно моноширинных вроде Consolas, символ «1» сознательно делают шире, чтобы он не сливался с буквами по ширине. 4. Существуют и более радикальные дизайнерские решения проблемы, например загнутый хвостик у «l» в PT Sans.
Комплектность (glyph repertoire)
На упаковке «Чокопая» — текст на десяти языках
Комплектность определяет, для набора на каких языках подходит шрифт, какие специальные символы в нем есть.
Минимум для веб-шрифта сегодня — базовая латиница и кириллица. Многоязычные проекты могут требовать поддержки греческого, вьетнамского, панъевропейской латиницы. Бывает нужна расширенная пунктуация, старостильные цифры, математические знаки. Все эти нюансы нужно учитывать при выборе шрифта.
На типографических сайтах всегда можно посмотреть состав знаков и таблицы Unicode. Например, у Гарнитуры PT Sans кириллица включает все буквы алфавитов народов России. Такой шрифт подойдёт даже для многоязычной упаковки продуктов в нашей стране.
При этом стоит помнить, что далеко не каждый шрифт имеет полный комплект начертаний во всех требуемых алфавитах. Нередко даже у хороших гарнитур кириллица бывает только в прямом начертании, без курсивов и жирных.
Так что если ваш проект предполагает широкую языковую поддержку, особенно важно заранее определить необходимый состав знаков и начертаний, и исходя из этого подбирать подходящую гарнитуру или комбинацию шрифтов.
PT Sans
Отдельного упоминания достойна ПТ Санс — гарнитура широкого применения, состоящая из восьми начертаний. Нормальное и жирное начертания вместе с соответствующими курсивами образуют стандартный комплект для текстового набора. Кроме того, в гарнитуру входят узкие начертания двух насыщенностей для документов, требующих большей плотности набора, и расширенные начертания двух насыщенностей для мелкокегельного набора.
Дизайн шрифта сочетает умеренный консерватизм с современными тенденциями гуманистического гротеска и имеет улучшенный уровень удобочитаемости, что, помимо традиционного использования для деловой документации и печатных изданий различного профиля, делает его применимым для указателей, табличек, схем, экранов информационных киосков и других навигационных объектов городской среды.
Шрифты, помимо стандартного комплекта кириллических и латинских знаков, включают знаки титульных языков Российской Федерации и большинства языков соседних республик, базирующихся на кириллице и латинице.
Шрифт разработан и выпущен Паратайпом в 2009 году. Дизайн разработан Александрой Корольковой при участии Ольги Умпелевой и общем руководстве Владимира Ефимова. Идеально сочетается с антиквой PT Serif и моноширинным шрифтом PT Mono.
Выбираем антикву
Ренессансная антиква: вечно молодая классика
Несмотря на солидный возраст, ренессансная антиква и сегодня отлично справляется с текстовыми задачами. Конечно, на новостном сайте она будет не к месту, но в исторических изданиях, изысканных книгах с широкими полями или для создания особой атмосферы — почему бы и нет. А набранные прописными буквы с большой разрядкой и вовсе производят магическое впечатление, отсылая к римскому монументальному письму.
Барочная антиква: аристократизм и читаемость
Барочная антиква — идеальный выбор для книжной и журнальной вёрстки. Некоторые исторические детали могут показаться слишком вычурными, но в целом этот стиль прекрасно балансирует между изяществом, которое свойственно всему архаичному, — и читабельностью, которая обусловлена живыми, «человечными» формами глифов.
Переходная антиква: изящный историзм
Переходная антиква — это один из наиболее подходящих типов шрифта для книг и роскошных глянцевых журналов. Она выглядит наиболее привычно среди всех исторических антикв, что делает её более нейтральной в восприятии. В вебе переходная антиква отлично работает в заголовках, когда требуется изящество и минимальная историческая отсылка, а на экранах с высоким разрешением она также хорошо подходит для основного текста.
Классицистическая антиква: холодная элегантность
Сегодня главная сфера применения классицистической антиквы — мода, стиль и дизайн. Логотипы журналов вроде Vogue, Harper’s Bazaar, L’Officiel, Elle базируются именно на ней. Современные версии, как Bodoni PT, имеют разные начертания для текста и заголовков. С пониженным контрастом они неплохо читаются и в длинных текстах.
Малоконтрастные антиквы: шрифты, по которым мы учимся читать
Широкие и малоконтрастные, эти антиквы — первый выбор для детских книг. Гарнитуру Школьная (Schoolbook) так и вовсе официально применяют в учебниках. И, разумеется, такие антиквы отлично читаются на экране в длинных текстах и мелком кегле.
Советские антиквы: назад в будущее
Во-первых, лучшие из советских антикв до сих пор отлично справляются с набором. Во-вторых, на волне моды на ретро-стили начала XX века такие шрифты как Литературная смотрятся удивительно свежо и актуально. Самые колоритные представители семейства будут уместны в стилизованных дизайн-проектах.
Современная антиква: на все случаи жизни
Современная антиква универсальна. Она уместна везде, где нужен шрифт с засечками, но без явных исторических аллюзий. К тому же, невысокий контраст большинства современных антикв делает их вполне «экранопригодными», в том числе для веба.
Брусковые шрифты: ирония, винтаж и читаемость
Брусковые шрифты с явным историческим характером идеально работают в «ретро» дизайне — как в прямой стилизации под XIX век, так и в современных проектах с лёгким намёком на старину. Менее характерные брусковые шрифты удобны в длинных текстах (включая веб, опять же из-за низкого контраста).
Ленточные антиквы: да здравствует мыло душистое
Ленточные антиквы производят сложное и порою парадоксальное впечатление: в них есть и строгий аристократизм новостильных антикв, и дружелюбие гуманитических гротесков. Представляется этакий главврач в высокотехнологической клинике. Как мы уже говорили в предыдущей лекции, чистые, обтекаемые формы этих шрифтов часто ассоциируются с чем-то «гигиеничным», «стерильным», отсюда их востребованность в упаковке и рекламе косметики, моющих средств, медицинских товаров. Разумеется, сфера их применения гораздо шире.
Выбираем гротеск
Сегодня дизайнер может выбирать из сотен превосходных гротесков на любой вкус и задачу. Но чтобы этот выбор был осознанным, важно понимать «генетику» каждого шрифта, его происхождение и визуальные особенности. Вот несколько советов, которые могут в этом помочь:
1. Присмотритесь к контрасту штрихов. Минимальный контраст — признак геометрических и неогротесков. Более заметный, но плавный контраст отличает гуманистические гротески. Резкие перепады толщин свойственны старым и переходным гротескам. 2. Оцените наклон осей овалов. Строго вертикальный стресс говорит о влиянии «интернационального стиля». Наклонные оси — наследие старых гротесков и антиквы. Смешанный стресс может указывать на неогуманистические корни шрифта. 3. Обратите внимание на форму округлых и диагональных знаков. Предельно упрощённые, геометризованные буквы — явный признак геометрических гротесков. Более открытые и пластичные начертания тех же букв встречаются в гуманистических гротесках. 4. Посмотрите на концы и соединения штрихов. Чёткие срезы под прямым углом характерны для неогротесков. Скруглённые или каплевидные окончания — это приметы старого стиля и гуманистического подхода. 5. Учитывайте пропорции, насыщенность и ширину начертаний шрифта. Старые и гуманистические гротески, как правило, шире и мягче по рисунку. Для неогротесков характерна средняя ширина знаков и сбалансированный контраст.
Разумеется, все эти характеристики не универсальны. В современных гротесках границы между категориями часто размываются, порождая новые гибридные формы. Поэтому главный совет — накапливайте свою базу визуальных примеров и внимательно изучайте нюансы каждого шрифта.
Если же вы сомневаетесь, какой гротеск выбрать для проекта, вот несколько беспроигрышных вариантов:
Несколько беспроигрышных вариантов
Старые гротески
Для «хипстерского» ретро-стиля в духе 2010-х обратитесь к старым грубоватым гротескам типа Franklin Gothic, Monotype Grotesque, Akzidenz Grotesk. Не бойтесь сочетать их с другими шрифтами для контраста.
Геометрические гротески
Для передачи духа модернизма попробуйте геометрические гротески — Avenir, Avant Garde, Erbar Grotesk, Kabel, Futura. Они добавят графичности и экспрессии, но будьте осторожны с длинными текстами.
Новые гротески
Для коротких акциденций, заголовков, навигации отлично работают неогротески — Helvetica, Univers, Circe, Proxima Nova. Их нейтральный, универсальный стиль впишется почти в любой контекст. На самом деле, в любой непонятной ситуации выбирайте Гельветику.
Гуманистические гротески
Для сплошного текста, особенно в мелких кеглях, лучше подойдут гуманистические гротески вроде Frutiger, Verdana, PT Sans, OpenSans, Source Sans. Они обеспечат высокую удобочитаемость и органичный, дружелюбный вид.
The Great Typographic Trendkill
Следить за модой в типографике определённо полезно, особенно если вы работаете над краткосрочными проектами, которые должны выглядеть свежо и современно. Сайты фестивалей, событий, промо-кампаний — отличный пример, где уместно использовать модные и оригинальные шрифтовые решения.
Ведь главная задача таких проектов — привлечь внимание, удивить, запомниться. Необычное типографическое оформление само по себе становится частью месседжа, создаёт нужный эмоциональный настрой. Здесь дизайнер может позволить себе поэкспериментировать с формой, выйти за рамки привычных «безопасных» шрифтов.
При этом важно понимать, что тренды в типографике, как и в любой другой сфере дизайна, имеют свойство быстро набирать популярность, а затем также стремительно устаревать. То, что выглядит остромодным сегодня, через год-два может оказаться избитым штампом.
Поэтому к трендам нужно относиться не как к догме, а как к источнику вдохновения и свежих идей. Не стоит слепо копировать модные приёмы, важнее уловить общую логику и тенденции развития типографического стиля.
Рассматривая разные проекты, дизайнер может:
- увидеть новые сочетания шрифтов и цветов; - оценить как традиционные гарнитуры используются в современном контексте; - подметить интересные типографические эффекты (например, градиенты, наложения, искажения букв); - понять как типографика взаимодействует с другими элементами дизайна (иллюстрациями, фото, интерфейсом); - уловить связь графической формы и смыслового посыла, настроения проекта.
Все эти наблюдения могут натолкнуть на свежую мысль, стать отправной точкой для своих дизайнерских экспериментов. Даже если вы работаете над долгосрочным, «серьёзным» проектом, элементы трендовой типографики можно использовать точечно — в заголовках, акциденции, декоративных композициях. Это оживит и актуализирует визуальный язык, не нарушая общей функциональности.
Главное — всегда помнить, что во главе угла должна быть не мода, а удобство для читателя, ясность коммуникации и соответствие типографики общей концепции проекта. Поэтому к любым трендам нужно подходить избирательно, пропуская их через фильтр здравого смысла и своего дизайнерского чутья.
