Помимо цветовой палитры, типографика веб-сайта является одним из наиболее важных факторов, влияющих на пользовательский опыт. Правильные шрифты улучшают дизайн и делают контент приятным для чтения. Неправильная типографика может испортить впечатление посетителя (и заставить его искать другой веб-сайт).
При выборе шрифтов для дизайна веб-сайта следует учитывать ряд факторов. Давайте сразу перейдем к делу.
Планирование
Прежде чем вы начнете разбираться в том, какие шрифты вы хотите использовать для веб-сайта, важно спланировать типографику. Вам необходимо иметь четкое представление о том, как будут использоваться выбранные вами гарнитуры.Сколько будет уровней заголовков? А как насчет метатекста для таких вещей, как подписи к статьям или подписи к фотографиям? Будут ли разные размеры основного текста для разных разделов сайта?
Составьте список того, что вам нужно, чтобы, когда вы начнете изучать шрифты, вы могли посмотреть, как они будут выглядеть в разных размерах и в разных стилях в зависимости от вашего фактического проекта, а не какого-то теоретического представления о том, что необходимо.
1. Тон и настроение
Одно из наиболее важных решений при планировании типографики для любого веб-сайта — это решить, какой тон и настроение сайта должны быть. Игривый или серьезный? Современный или традиционный?
Как только вы узнаете тон, который должен иметь проект, вы можете отказаться от множества вариантов шрифта. Вам не нужно использовать шрифт типа Baskerville для игривого, современного сайта. Точно так же, как вы бы не использовали Futura для сайта, который должен быть классическим.
Создайте список гарнитур, которые кажутся подходящими к тону вашего проекта, чтобы ссылаться на них по мере прохождения остальных соображений, приведенных ниже. Когда у вас есть более узкий список подходящих вариантов (в отличие от десятков тысяч доступных шрифтов), это ускоряет процесс окончательного выбора гарнитуры.
2. Читаемость
Люди часто путают разборчивость и удобочитаемость. Разборчивость — это то, насколько легко узнать каждую букву в гарнитуре. Однако читаемость — это то, насколько легко шрифт на самом деле читается (особенно в больших блоках текста), и зависит от ряда факторов.
Разборчивость шрифта определенно влияет на его читабельность. Но также влияют такие факторы, как размер шрифта, контрастность с фоном, вес шрифта и другие визуальные факторы.
Шрифт, который отлично читается при одном размере, может стать трудночитаемым при другом размере. Вот почему важно понять, как ваш контент будет использоваться в вашем реальном дизайне, прежде чем выбирать шрифт.
3. Масштаб
Не все шрифты хорошо смотрятся в любом размере. Некоторые шрифты, которые очень удобочитаемы и отлично смотрятся для основного текста, в конечном итоге утомляют при использовании для заголовков. Верно и обратное: отображаемые гарнитуры, которые отлично смотрятся в качестве заголовков, часто нечитаемы при использовании для основного текста.
Знание масштаба, в котором вы будете использовать гарнитуры в своем дизайне, позволяет принимать более обоснованные дизайнерские решения. Вот почему планирование типографики в самом начале проекта так важно для выбора правильных шрифтов.
4. Комбинирование гарнитур
Нет ничего, что говорило бы, что вам нужно использовать более одного шрифта (или семейства шрифтов) в вашем дизайне. Есть несколько отличных примеров веб-сайтов, использующих только один шрифт, например, сайт Stripeили сайт Акаи Б. Ито.
Тем не менее, использование более одного шрифта — отличный способ добавить визуального интереса и укрепить визуальную иерархию вашего сайта. При выборе гарнитур для совместного использования необходимо учитывать несколько моментов:
- Определите основной шрифт, который вы хотите использовать. Это может быть шрифт вашего основного текста или заголовков. Но вам понадобится отправная точка.
- Учитывайте контраст между гарнитурами, которые вы хотите комбинировать. Необходим достаточный контраст между гарнитурами, но это не значит, что вам нужны два совершенно разных шрифта. Фактически, слишком большой контраст может означать, что один шрифт подавляет другой.
- Основная форма каждого шрифта важна. Сочетание шрифтов с небольшими различиями в форме, как правило, плохая идея. Вы либо захотите комбинировать гарнитуры с одинаковыми базовыми формами (один из самых простых способов сравнения — посмотреть на форму буквы «О» в каждой — круглые, сжатые, широкие, квадратные и т.д.?) ) или с совершенно разными формами (например, сжатый шрифт и широкий шрифт).
- Обратите внимание на высоту каждого шрифта по оси x. Вам нужно комбинировать гарнитуры с одинаковой высотой x.
- Отличный вариант для новичков — выбрать гарнитуры из одного семейства, например Josefin Slab и Josefin Sans.
Комбинирование шрифтов — это отчасти искусство, а отчасти наука. Как только вы узнаете основные критерии, которые помогут создать прочную комбинацию, потребуется немало проб и ошибок, чтобы найти идеальные варианты.
5. Лицензирование
Лицензирование — одна из самых недооцененных частей при выборе веб-типографики. Если вы используете службу веб-шрифтов, такую как Google Fonts или Typekit, это обычно не проблема, поскольку предлагаемые ими гарнитуры лицензированы для использования в Интернете.
Но если вы используете шрифты из других источников, вам нужно быть уверенным, что они лицензированы для того типа проекта, в котором вы их будете использовать. Не все шрифты лицензированы для широкого использования. Некоторые из них недороги или бесплатны для личного использования, но для коммерческого использования требуются дорогостоящие лицензионные сборы.
Еще одна вещь, которую следует учитывать, — это если веб-сайт, который вы разрабатываете, является частью более крупного бренда, где шрифты нужно будет использовать в других маркетинговых материалах. Убедитесь, что лицензия разрешает и другие варианты использования.
Чтобы выбрать правильную типографику для проектов вашего веб-сайта, нужно поэкспериментировать и попробовать разные варианты, пока вы не найдете тот, который подходит. Типографика может сильно повлиять на то, как посетители воспринимают веб-сайт. Правильная типографика создает приятный опыт, в то время как шрифт, который трудно читать, или который не соответствует тональности сайта, может негативно повлиять на UX. Стоит потратить время и ресурсы, чтобы найти то, что вам подходит.
0 комментариев