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

Автор статьи: Мария Муратова
Руководитель команды по созданию сайтов и UX/UI-дизайнер. Специализируется на веб-дизайне и проектировании интерфейсов платформы.

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

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

Энергичная, уверенная подача
Попробуйте шрифты с выразительными формами и плотным начертанием.
При этом не существует одного «свадебного» или «семейного» шрифта. Даже внутри одного жанра у фотографов разный подход. Поэтому примеряйте шрифт к своим работам и текстам: соответствует ли он тому, как вы снимаете и общаетесь с клиентами?
Какие бывают шрифты
Чтобы выбирать было проще, рассмотрим три группы шрифтов. Запоминать названия необязательно — важнее научиться замечать разницу в форме букв.
БЕЗ ЗАСЕЧЕК
У них нет засечек — маленьких штрихов на концах букв. Такие шрифты ещё называют гротесками.
Среди них много простых, спокойных вариантов, которые удобно использовать для описания услуг, рассказа о себе и других текстов. Но есть и очень выразительные: узкие, широкие, округлые, с плотными тяжёлыми буквами.
Поэтому шрифт без засечек не обязательно нейтральный. Один будет почти незаметным рядом с фотографиями, другой станет главным акцентом страницы.



С ЗАСЕЧКАМИ
Такие шрифты называют антиквами. Небольшие штрихи на концах букв часто напоминают нам книжное или журнальное оформление.
Но и здесь характер бывает разным. Плавные формы могут выглядеть мягко и тепло. Тонкие линии в сочетании с толстыми — создавать более изящное или драматичное впечатление. Крупные заметные засечки — добавлять выразительности.
Смотрите на конкретный шрифт: само наличие засечек ещё не делает его романтичным или строгим.



РУКОПИСНЫЕ
Они напоминают письмо от руки и могут добавить ощущение личного обращения. Один выглядит как аккуратная подпись, другой — как быстрая заметка.
Такой шрифт можно попробовать для короткой фразы или отдельного акцента. Для длинных описаний он не подойдёт.



Как выбрать размер текста
Важно, чтобы заголовки заметно отличались от основного текста. Тогда человек сможет быстро просмотреть страницу и найти стоимость, условия или запись на съёмку.
Для первого варианта можно попробовать такие размеры:
- заголовок — около 40–48 пикселей
- подзаголовок — около 24–32 пикселей
- основной текст — около 16–18 пикселей
Это отправная точка, а не строгие значения. При одинаковом размере один шрифт выглядит крупнее другого из-за формы букв. Для мобильной версии, скорее всего, понадобится настроить размер чуть меньше.
Оценивайте результат на своих текстах. Если заголовок не помещается в 2–3 строки, попробуйте сократить фразу или немного уменьшить размер.
На первом экране размер заголовка стоит оценивать вместе с фотографией: текст должен хорошо читаться и не закрывать важные детали кадра. Подробнее об этом — в уроке про дизайн сайта (чек-лист) [добавить ссылку].
Сравните, как меняется впечатление от страницы с одним и тем же наполнением, но с разным размером и написанием заголовков.

Шрифт в небольшом размере и прописными буквами выглядит сдержанно

Шрифт в крупном размере и заглавными буквами выглядит уверенно и выразительно
Даже без смены шрифта впечатление меняется: второй вариант может звучать громче и увереннее. Заглавные буквы хорошо работают в коротких заголовках и подписях. Но длинную фразу, которая занимает несколько строк, так читать трудно. Если вам нравится этот приём, начните с коротких названий разделов. Посмотрите, соответствует ли такая подача вашему стилю и не становится ли страница слишком громкой.
Как понять, что два шрифта сочетаются
СМОТРИТЕ НА КОНТЕНТ ЦЕЛИКОМ
Поместите заголовок, абзац и фотографию рядом. Два шрифта могут нравиться по отдельности, но спорить за внимание вместе с контентом.
Для сравнения возьмите фотографии, которые планируете оставить на сайте.
ОБРАТИТЕ ВНИМАНИЕ НА ФОРМУ И ТОЛЩИНУ БУКВ
Если заголовок тонкий и лёгкий, слишком плотный основной текст может выглядеть так, будто весь абзац выделили жирным. Взгляд будет сначала цепляться за него, а заголовок потеряется.
Попробуйте выбрать более тонкий вариант для основного текста или немного увеличить заголовок. При этом текст должен оставаться хорошо различимым.
РАЗДЕЛИТЕ ЗАДАЧИ ЗАГОЛОВКА И ОСНОВНОГО ТЕКСТА
Заголовок помогает быстро понять, о чём раздел, и задаёт настроение. Здесь можно позволить себе больше выразительности. У основного текста другая задача: понятно рассказать об условиях съёмки, подготовке, стоимости. Его должно быть удобно читать целыми абзацами.
Хорошая отправная точка
Выразительный шрифт для заголовков и нейтральный для основного текста.
Мы подобрали для вас несколько пар под разное настроение
Одного шрифта тоже достаточно
Для сайта обычно достаточно одного-двух шрифтов. Старайтесь использовать не больше трёх, оставляя третий только для коротких акцентов.
Необязательно искать пару. Можно использовать один шрифт для всего сайта, а заголовки выделить размером или толщиной букв.
Например, заголовок сделать крупным и полужирным, а основной текст — обычным. Получится цельное оформление без сложных сочетаний.
Главное — выбрать шрифт, который хорошо работает в обеих ролях. Очень узкие или необычные буквы могут эффектно смотреться в коротком заголовке, но утомлять в абзаце.
Выбирайте сочетание, в котором узнаёте себя
Для начала возьмите одну готовую страницу сайта. Попробуйте два-три сочетания, сохраняя содержание одинаковым. Так будет видно, как именно шрифты меняют впечатление.
Посмотрите, помогают ли они передать ваш характер:
- Подходит ли лёгкий заголовок к мягким фотографиям?
- Поддерживают ли плотные буквы энергию съёмки?
- Остаётся ли текст удобным для чтения?
Удачный выбор складывается из двух вещей: шрифты отражают вас как фотографа и помогают клиенту без усилий узнать о вашей работе.
На Wfolio шрифты меняются в настройках дизайна. Можно взять сочетание из этой статьи или попробовать несколько своих пар прямо на готовой странице — фотографии и тексты переделывать не придётся.
Зарегистрируйтесь на Wfolio и попробуйте подобрать шрифты для своего сайта.

Прямой эфир с Артуром Погосяном

Право на плохой кадр

Кантен де Брие

Структура сайта фотографа

РАБОТА С ФОТОСТУДИЯМИ

Первая платная съёмка

Как клиент выбирает фотографа

Прямой эфир с Игорем Цаплиным

Новые способы оформления сайта

Прямой эфир с Сергеем Беликовым

ЮРИДИЧЕСКАЯ ПРОВЕРКА САЙТА

Герб Ритц

Прямой эфир про продвижение сайта в поиске

АВТОРСКИЕ ПРАВА НА AI–КОНТЕНТ










