Awebdesign's Blog

ЧУВСТВА И БУКВЫ. ЧАСТЬ I ГАРНИТУРА И СМЫСЛ СООБЩЕНИЯ

Posted in Как правильно сочетать шрифты by awebdesign on 22.09.2014

(Автор — Александра Рагозина — Арт-директор в McCann Erickson Kazakhstan)

200

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

Шрифт – это интонация письменности

2

Благодаря уникальности каждого шрифта мы задаем эмоциональный тон нашим посланиям.

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

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

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

Узнавайте про своего адресата как можно больше, можете узнать много интересного, например, корпоративный шрифт компании Daimler AG – Corporate A, четкий, прорисованный, полный аристократичной сдержанности антиквенный шрифт, что говорит о том, что ребята высоко ценят свое прошлое, гордятся им и ни за что не отделяют настоящее и прошлого.

3

Резюме или коммерческое предложение в компанию

4

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

Их излюбленные шрифты: Times, Times New Roman, Garamond, Bodoni, Helvetica.

Однако молодые, амбициозные компании, создающие технические, информационные новинки, фармацевтический бизнес и бизнес, основанный на научно-исследовательской, медицинской базе, структуры Wellness любят тонкие, легкие гротески как Verdana, Arial, Modern, Univers, Neue Helvetica, New Gothic, ITC Legacy Sans, Kabel, и иногда изящные, четко прорисованные антиквенные шрифты как Didot, Americana.

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

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

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

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

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

Благодарственное письмо

«Спасибо» просит живого, ровного, прямого шрифта. Такой шрифт должен быть полон воздуха, лежать свободно и открыто. Воздушные «О», открытые «c», «a», «e» и четкая конструкция каждой буквы доносят до читателя чувство радости, оптимизма и искренности.

5

6

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

Это отталкивает людей, мы ищем взаимности, достойной искренней благодарности, поэтому выберите открытый чистый шрифт, кегель 12 -14 пунктов, и ваши слова будут приняты сердечно.
Geneva, Gotham, Myriad Light – одни из лучших шрифтов для выражение чувства благодарности.

Письмо о прекращении отношений

Вам надо решить, отказываетесь вы окончательно и бесповоротно, или вы кокетничаете и женственно маскируете «нет» под «да».

7

Для недвусмысленных вежливых отказов прекрасно подходит Times – однозначно, спокойно.

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

Hoefler Text – хорошая альтернатива Verdana в англоязычных посланиях.

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

8

Отказное письмо набранное Courier New – это отказ, равносильный фразе: «Бизнес – это бизнес», безапелляционный, в таком отказе нет места надежде, нет места другим словам.

Следует внимательно отнестись к выбору рукописных шрифтов в подобных письмах.

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

Письмо об уходе в отставку.

Люди уходят в отставку либо в дружеских отношениях с компанией и коллегами, либо с чувством обиды и разочарования, а бывает и так, работа – беспросветное адское наказание. Courier New- самый подходящий шрифт для расставания с адскими муками, это даже не прощание, это демонстрация разрыва, надменной холодности.

9

Так вот Times New Roman или Arial продемонстрируют спокойный уход, работа к несчастью, не приносила особой радости, возможно и обида имеет место, тем не менее, подобное начертание очень выдержанное и нейтральное.

Везунчикам, уходящим по собственному желанию, в дружеских отношениях с коллегами и руководством подойдет Verdana — гротеск или New York – живая, светлая, непосредственная антиква. Такое письмо светится благодарностью и оптимизмом.

«Требование»

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

10

Письмо – требование, изложенное Courier в мелком кегле, укажет получателю на четкое намерение идти до конца, автор не шутит, не угрожает, однако жестко обозначает свою позицию, мнение адресата не беспокоит автора никоим образом. Учтите, что такое письмо произведет сильное впечатление.

Если, конечно, нет необходимости в столь жестком выражении своих намерений, Times New Roman, Helvetica, Myriad, Arial звучат серьезно, внятно, но без нажима. Эти шрифты, при всей своей гармоничности, стройности, несколько вялые в эмоциях, хотя, по мнению многих гуру шрифтов, незаметный шрифт – великий шрифт, тогда нам приходится сосредотачиваться на содержании.

Автор: Александра Рагозина, Арт- директор, McCann Almaty

Статья подготовлена по материалам Арик Сигман «Психология шрифта». Исследование компании «Lexmark International» http://www.publish.ru

Список литературы:

1. Роберт Брингхерст «Основы стиля в типографике»
2. Эрик Шпикерман «О шрифте»
3. Виллу Тотс «Современный шрифт»
4. Арик Сигман «Психология шрифта». Исследование компании «Lexmark International»
5. Нестеренко С.П. «Гарнитура шрифта как фактор регуляции восприятия текста»
6. Криштопрайтис В.В. «Шрифт как визуальное средство коммуникации»
7. Алексей Черкаль «Психология восприятия шрифта»
8. http://www.publish.ru
9. http://www.kak.ru
9. http://www.linotype.com
10. http://www.paratype.ru
11. http://www.prodtp.ru

Реклама

Buami — место, где начинается вдохновение

Net Echt

Дизайнеры Arjan Groot и Florian Mewes получили золото на ED-Award (European Design) за серию постеров Net Echt («Похоже на жизнь») для амстердамских музеев.
дизайн постеров Net Echt
Графический дизарйн, полиграфия

Шрифтовик Christian Robert-Tissot

Как правильно подбирать шрифты

(Перевод Виктории Шидловской статьи Best Practices of Combining Typefaces из журнала Smashing Magazine)

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

Итак, все шрифты делятся на те, что с засечками (serif) и без засечек (sans serif, от французского sans — без). Шрифты без засечек по-русски принято называть рублеными.

И оказалось, что по европейской традиции шрифты с засечками делятся на 4 класса:

Пример старостильного шрифта - Garamond

Old style или Humanist (Старый стиль) – шрифт появился в 1465 г., характеризуется диагональным акцентом (это означает, что самая тонкая часть шрифта находится под углом, а не точно посередине сверху или снизу), небольшой разницей между толстыми и тонкими линиями шрифта, а также отличной читабельностью.

Старо-стильные шрифты делятся на категории Venetian и Aldine (также называют Garalde). Примеры шрифтов класса Old style Adobe Jenson (Venetian), Janson, Garamond, Bembo, Goudy Old Style, и Palatino (все Aldine или Garalde).

Пример шрифта класса Transitional - Times New Roman

Пример шрифта класса Transitional - Times New Roman

Transitional или Baroque (Переходный или Барочный) – впервые появился в середине 18-го века. Эти шрифты наиболее широко распространены, среди них Times New Roman (1932) и Baskerville (1757). Этот класс шрифтов с засечками находится между старостильными и современными (modern), отсюда и название Transitional. Разница между тонкими и толстыми линиями шрифта более отчетливая, чем в старом стиле, но не такая драматичная, как в современном.

Пример шрифта класса Modern - Bodoni

Modern или Didone (Современный) – появился в конце 18-го века. Характеризуется экстремальным контрастом между тонкими и толстыми линиями знака. Современный шрифт имеет вертикальный акцент (тонкие линии точно посередине вверху и внизу), тонкие красивые засечки. Шрифт тонкий, но вертикальные линии очень толстые. Большинство шрифтов класса Modern менее читабельные, чем Old style и Transitional. Примеры шрифта — Bodoni, Didot, и Computer Modern.

Пример шрифта класса Slab serif - Rockwell

Slab serif или Egyptian (Брусковый) – обычно имеет совсем незначительную, если вообще имеет, разницу между тонкой и толстой частью знака. Slab serif обладают «толстым», квадратным видом и иногда имеют фиксированную ширину, что означает, что все знаки и пробелы между словами имеют одинаковую ширину (как typewriter). Иногда такие шрифты называют рубленными с засечками, так как они имеют вид шрифтов без засечек. Slab serif появился примерно в 1800 году. Примеры шрифтов — Clarendon, Rockwell и Courier.

Ну а теперь перейдем к теме статьи — как правильно подбирать и сочетать шрифты при создании макета.

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

Сочетайте шрифты с засечками со шрифтами без засечек (sans serif и serif)

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

На рисунке внизу — типичная текстовая раскладка. На примере слева в заголовке использован Trade Gothic Bold No.2, а в тексте — Bell Gothic. Оба шрифта – рубленые. Однако, у них очень разные «личности». Хорошее правило при создании макета, не привлекать излишнее внимание читателя к виду шрифта. Trade Gothic предполагает серьезность, а Bell Gothic, наоборот – динамику и экспрессивность.

Как правильно подбирать шрифты

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

Теперь рассмотрим пример справа. Мы заменили Bell Gothic шрифтом Sabon. Sabon, как шрифт с засечками, очень хорошо работает с Trade Gothic. Они оба нацелены на ясность и читабельность благодаря хорошей высоте знаков (x-height, грубо говоря, это высота строчной буквы x в шрифте, она определяет расстояние между базовой линией и верхней) . Таким образом, у обоих шрифтов одна и та же цель, потому они и составляют отличную пару.

Избегайте шрифтов из одного класса

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

На примере внизу, слева, в заголовке использован шрифт Clarendon Bold, который относится к классу Slab serif. В теле статьи использован Officina Serif который также относится к slab serif. Шрифты класса Slab serif отличаются ярко выраженным характером, им нравится доминировать на странице. Использование двух шрифтов класса slab serif в одном месте может вызвать ненужное напряжение.

Как правильно сочетать шрифты

А теперь обратите внимание на правую сторону примера. Clarendon Bold в заголовке поставлен рядом с более нейтральным New Baskerville. New Baskerville относится к универсальному классу Transitional serif с широкими знаками, которые хорошо сочетаются с жирным Clarendon.

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

Присвойте шрифтам разные роли

Один из простых способов подбора шрифтов, это составление ролевой дизайнерской схемы для каждого шрифта. В примере ниже мы использовали Akzidenz Grotesk Bold прописными для имени автора статьи. Для заголовка — Rockwell Bold. Вводный абзац и основной текст статьи в одном шрифте – Bembo, но разного размера. И, наконец, подзаголовок — Akzidenz Grotesk Medium.

Присвойте шрифтам разные роли

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

В общей сложности мы использовали 4 шрифта из 3-х гарнитур, все они привели к связанному, сплоченному дизайну, так как у каждого шрифта своя роль, четко определенная в типографической иерархии. Так что если сомневаетесь – распределите роли!

Контрастная жирность шрифтов

Самый лучший способ испоганить макет – не отделить текстовые элементы друг от друга по их иерархии. Кроме использования разных размеров, убедитесь, что ваши шрифты разного веса (жирности), чтобы дать читателю «путеводитель» по вашему дизайну.

На примере слева у нас разные размеры шрифта, но недостаточный контраст по толщине. Myriad Light рядом с Minion Bold «пропадает» и теряет визуальный авторитет. Как бы то ни было, но глаз читателя должен в первую очередь выделять заголовок, а не превью.

Сочетайте шрифты разной жирности

Справа мы использовали Myriad Black над Minion нормальной толщины. Возможно, заголовок тяжеловат, но по крайней мере, у читателя не возникает сомнений по поводу того, что читать первым.

Создайте на странице различную тональность текста

В типографии тональность достигается различными способами – толщиной, размером, шириной строк, кернингом и пр. Самый простой способ «увидеть» тональность – смотреть на макет не прямо, а боковым зрением. Посмотрите на пример внизу, направив взгляд немного справа или слева от картинки, так, чтобы вы уже не могли читать текст, но могли видеть его общий тон.

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

Используйте разную шрифтовую насыщенность

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

Не смешивайте настроения шрифтов

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

На примере слева мы соединили Franklin Gothic Bold и Souvenir. Общее впечатление от Franklin Gothic – мужество, сила, стойкость, но с налетом элегантности. Он не ублажающий взор, но очень функциональный. А Souvenir – игривый, легкомысленный, немного равнодушный, но очень симпатичный. Эти два шрифта рядом, как бифитер перед Букингемом и маленькая девочка, которая пытается его рассмешить. Такое смешение плохо работает. Разное настроение шрифтов привлекает внимание к самим шрифтам, а не содержанию, что свидетельствует о слабом дизайне.

Не смешивайте разные по настроению шрифты

Справа в пару к Souvenir мы поставили более подходящего соседа. У Futura Bold много лиц, но он очень хорошо сочетается с Souvenir по многим причинам. Во-первых, у обоих шрифтов высокие x-height. Оба шрифта обладают округлостью форм и незначительной, но тем не менее заметной закрученностью концов. Ни один из них не доминирует над другим. Оба работают на создание веселого, приподнятого настроения. Напряжения между ними нет.

Сочетайте яркое с нейтральным

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

На примере слева Dax Bold стоит рядом с Bernhard Modern. Плохой выбор хотя бы по двум соображениям.

Сочетайте яркое с нейтральным

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

Взглянем на более удачный выбор. В правой колонке Dax Bold поставили рядом с Caslon. Caslon относится к классу Old style (Старый стиль), но был модернизирован и смягчен для лучшей сочетаемости с другими шрифтами. В данном контексте он выглядит удовлетворительно рядом с Dax. Заметьте, как в первую очередь мы видим личность Dax в заголовке, и как Caslon отступает назад и приглашает нас к чтению. В этом примере Caslon является нейтральным выбором для поддержки более яркого Dax.

Избегайте несоизмеримых сочетаний

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

Слева мы поставили Antique Olive Nord – чрезвычайно жирный шрифт, — рядом с Garamond Narrow. Контрастный перебор очевиден. В большинстве подобных случаев, такой контраст идет дальше обычного привлечения внимания и вызывает ощущение неуклюжести. Следовательно, он не доносит до читателя смысла текста.

Избегайте слишком большого контраста

Справа в заголовок мы поставили Antique Olive Nord. Garamond Narrow мог бы быть заменен на тот же Garamond в варианте book weight, но более хороший выбор — после некоторых колебаний — это Chaparral. У Chaparral более высокая x-height, чем у Garamond, и в общем у него более современный и нейтральный вид рядом с характерным Antique Olive Bold.

Будьте проще – не используйте более двух шрифтов

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

На примере внизу мы составили четкую типографскую иерархию, добились разнообразия, получили интересную разбивку по тональности текста и его возрастающую читабельность. Все это было сделано с помощью всего двух шрифтов. Хотя, строго говоря, у нас здесь пять шрифтов: три Helvetica Neue и два Garamond.

Используйте два шрифта

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

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

Используйте различные размеры шрифта

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

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

Используйте разные размеры шрифта

Справа мы использовали те же два шрифта, но другого размера. TheMix Italic был значительно увеличен, в то время как New Century Schoolbook уменьшен до более нормального, хоть и все еще читабельного, размера.

Использование различных шрифтовых размеров помогает четко распределить иерархию и увеличить тоновое разнообразие в типографии.

%d такие блоггеры, как: