Существует целый огромный мир шрифтов, и поиск подходящего для вашего конкретного сценария может быть ошеломляющим. Гарнитура, также известная как семейство шрифтов, может задать общий тон и индивидуальность вашего сайта или приложения, а также повысить (или уменьшить) читабельность.
Давайте сначала начнем с определения некоторых общих характеристик шрифтов:
- Базовая линия: воображаемая линия, на которой располагаются буквы.
- X-height: высота строчных букв шрифта, не включая надстрочные и нисходящие элементы.
- Foot: часть буквы, которая опирается на базовую линию (часто встречается в шрифтах с засечками).
- Обводка: одна линия, прямая или изогнутая, образующая часть буквы.
Эти определения будут полезны при описании классификаций шрифтов. При поиске шрифтов для использования в проектах решите, какая классификация шрифтов будет выглядеть лучше всего.
Существует несколько классификаций шрифтов, но то, что вы часто видите на веб-сайтах и в приложениях, относится к следующим категориям:
- Serif: шрифты, в которых в конце штрихов символов используются ножки, а штрихи букв часто различаются по ширине.
- Без засечек (по-французски «без засечек») : шрифты без ножек, которые часто имеют более тонкие штрихи букв и большую высоту по оси x .
- Slab-serif: шрифты, которые выглядят без засечек, но имеют толстые блочные засечки, которые соответствуют общему штриху буквы.
- Шрифт: шрифты, украшенные завитушками, напоминающими почерк.
- Дисплей: шрифты, которые выделяются декоративными элементами и предназначены для использования в больших размерах .
- Моноширинный: шрифты, в которых все или большинство символов занимают одно и то же горизонтальное пространство (тогда как в большинстве шрифтов буквы, такие как W , намного шире, чем буквы, такие как J ).
Имея в виду эти классификации, вы можете начать сужать варианты при поиске шрифтов, которые лучше всего подходят для вашего веб-сайта или приложения. Но даже в этом случае выбор шрифта часто похож на игру в угадайку: вы выбираете шрифт, применяете его к своему дизайну, решаете, что это не то, что вам нужно, или что он конфликтует с другими аспектами дизайна, а затем возвращаетесь, чтобы выбрать другой шрифт. Промыть и повторить.
Вы можете упростить этот процесс, начав с рекомендаций, описанных ниже.
Ищите шрифты, поддерживающие несколько языков
Быстрый способ сузить список — сосредоточиться на шрифтах, поддерживающих несколько языков. Это особенно важно, если вы обслуживаете международных пользователей. Однако, даже если ваш сайт поддерживает один язык, пользователи могут переводить его с помощью стороннего программного обеспечения, поэтому в любом случае рекомендуется выбирать шрифт, поддерживающий несколько языков.
Проверьте, как ваш контент будет выглядеть на разных языках, переведя страницу или приложение. Обратите внимание, как ваш шрифт выглядит с разными символами и как меняется макет.
Знание того, как ваш шрифт выглядит на разных языках, может повлиять на то, как вы оформляете страницу и как ваши пользователи воспринимают ваш продукт или услугу.
Оцените сходство между персонажами
Некоторые шрифты, особенно без засечек, минималистичны и имеют нечеткие различия между символами. Проверьте, насколько хорошо ваш шрифт-кандидат различает цифру 1 , прописную I и строчную L.
Это правда, что пользователи часто могут понять, что означает символ, в зависимости от контекста, поэтому во многих ситуациях отсутствие четких различий между символами может не повлиять на разборчивость вашего шрифта. Однако если ваш шрифт будет использоваться для отображения буквенно-цифровых данных (например, кодов подтверждения), сходство между разными символами может вызвать проблемы. Это особенно верно, если вы обслуживаете пользователей в финансовой, государственной или медицинской сферах, где преобладают номера счетов.
Смешайте декоративные шрифты с нейтральными
Начертательные и экранные шрифты придают индивидуальность вашему сайту или приложению и выделяют вас среди конкурентов. Однако не переусердствуйте с украшением . В этом случае меньше значит больше.
Зарезервируйте декоративные шрифты, которые имеют большую индивидуальность, для менее используемых элементов, таких как заголовки или иллюстрации. Декоративные шрифты плохо читаются при маленьком размере, и их никогда не следует использовать для основного текста.
Сочетайте декоративный шрифт с нейтральным шрифтом с засечками или без засечек. Если ваш декоративный шрифт имеет интенсивные завитки, он будет лучше всего смотреться в паре со шрифтом без засечек. Если вы предпочитаете сочетать его с засечками или плоскими засечками, убедитесь, что их засечки не настолько ярко выражены, чтобы конкурировать с декоративным шрифтом.
Используйте контрастную толщину шрифта, чтобы различать компоненты
Сочетание нескольких шрифтов в одном дизайне не всегда необходимо. Дизайн, в котором используется один шрифт с несколькими весами, может выглядеть профессионально и хорошо сбалансированным. Использование нескольких начертаний, стилей и размеров шрифтов поможет определить визуальную иерархию страницы , которая будет направлять взгляд пользователей по экрану.
Чем больше вариантов предоставляет шрифт, тем больше гибкости у вас будет в дизайне. При использовании в дизайне одного шрифта рассмотрите возможность поиска семейств шрифтов, включающих следующие параметры:
- Легкий
- Обычный
- Смелый
- Светлый курсив
- Курсив
- Жирный курсив
Назначьте разные роли при сопряжении шрифтов
Независимо от того, какой шрифт или комбинацию шрифтов вы выберете, не используйте их в дизайне бессистемно. У каждого шрифта или стиля должна быть четкая роль и цель.
Как и в приведенных выше примерах декоративного шрифта, вы можете назначить один шрифт для заголовков, а другой — для основного текста. Использование двух шрифтов для основного текста делает дизайн непоследовательным и неутонченным и может подорвать доверие к вашему бренду или компании.
Используйте дизайн-систему или руководство по стилю внешнего интерфейса, чтобы определить шаблоны для всего сайта или приложения, чтобы поддерживать согласованность и удовлетворять ожидания пользователей.
Вывод
Выбор типографики для дизайна может показаться ошеломляющим из-за перегруженности выбором. Имея так много вариантов на выбор, вы можете выбрать то, что наиболее удобно или доступно в данный момент. Эти рекомендации по типографике укрепят вашу уверенность в создании дизайна, который максимально удобен в использовании без ущерба для эстетики.
