«Типографика должна быть невидимой слугой текста» (с) Брингхерст
Разборчивость: между наукой и субъективностью
Разборчивость (Legibility) — это визуальная четкость текста, зависящая от размера шрифта, гарнитуры, контраста, структуры текстового блока и интервалов. Однако, как отмечают Miles Tinker в работах Bases for Effective Reading (1963) и Legibility of Print (1965), исследования в этой области полны противоречий. Современные технологии — от адаптивной верстки до мультимедийных интерфейсов — усложняют задачу: дизайнерам приходится балансировать между эстетикой, техническими ограничениями и потребностями аудитории.
Размер шрифта: баланс между функцией и комфортом
Для печатных материалов оптимальный размер шрифта — 9–12 пунктов, как утверждает Tinker. Меньшие размеры допустимы для подписей, а крупные (14+ пунктов) актуальны для экранов с низким разрешением или пожилой аудитории. В веб-дизайне стоит ориентироваться на 16–18 пикселей для основного текста, чтобы компенсировать пикселизацию и усталость глаз.
Гарнитура: мифы и реальность
Споры о превосходстве шрифтов с засечками (Serif) над беззасечковыми (Sans Serif) не имеют научной основы. Роберт Брингхерст в «Основах стиля в типографике» (2018) подчеркивает: выбор зависит от контекста и эстетики. Например, Serif (Georgia, Times New Roman) часто ассоциируются с традиционностью, а Sans Serif (Helvetica, Arial) — с современностью. Важнее избегать чрезмерного использования капслока (заглавных букв) и обеспечить сглаживание для экранов.
Контраст: не только черное и белое
Исследования подтверждают: контраст между текстом и фоном должен превышать 70% (по шкале WCAG). Однако, как показали Dyson и Kipping (1998), цветовые комбинации (например, темно-синий на светло-сером) при соблюдении контраста не ухудшают читаемость. Главное правило: избегайте текстурных фонов. Пример провала — сайты с «шумным» градиентом под текстом, где информация становится неразборчивой.
Текстовые блоки: длина строки и выравнивание
Оптимальная длина строки для шрифта 9–12 пунктов — 8–13 см (35–55 символов), что соответствует 10–12 словам. Выравнивание по левому краю или по ширине не влияет на скорость чтения, но «рваный» правый край (при левом выравнивании) снижает визуальный хаос. В вебе слишком длинные строки (как в Wikipedia до адаптивного дизайна) увеличивают нагрузку на глаза.
Интервалы: воздух вместо каши
Интерлиньяж (межстрочный интервал) для шрифта 9–12 пунктов должен составлять размер шрифта + 1–4 пункта. Например, для 12-пунктового текста — 13–16 пунктов. Пропорциональные шрифты (где символы имеют разную ширину) предпочтительнее моноширинных: они ускоряют чтение за счет естественного ритма.
Airbnb и сила типографики
В 2014 году Airbnb провел ребрендинг, сделав ставку на кастомный шрифт Airbnb Cereal. Дизайнеры увеличили межбуквенный интервал (керинг) и выбрали высококонтрастную пару — темно-серый текст на белом фоне. Это улучшило читаемость описаний жилья, что подтвердилось ростом конверсии на 12%. Кейс демонстрирует: даже небольшие изменения в типографике влияют на пользовательский опыт и бизнес-метрики.
👉 Рекомендации для UX/UI-дизайнеров
- 🚩 Адаптируйте размер шрифта к носителю:
16–18 px для основного текста на сайте;
12–14 px для мобильных приложений. - 🚩 Тестируйте гарнитуры на реальной аудитории:
Используйте A/B-тесты для выбора между Serif и Sans Serif. - 🚩 Контролируйте контраст автоматически:
Проверяйте сочетания цветов через инструменты вроде WebAIM Contrast Checker. - 🚩 Оптимизируйте длину строки:
Для десктопов — не более 80 символов;
Для мобильных устройств — 30–40 символов. - 🚩 Добавьте «воздуха» в интерфейс:
Увеличьте межстрочный интервал на 150% от размера шрифта. - 🚩 Избегайте экспериментальных решений в основных блоках:
Декоративные шрифты оставьте для заголовков, а не для body-текста.
👉 Подписывайтесь на новый канал
Запустили канал в Телеграме RE: marketing, где ежедневно делимся тактиками повышения конверсии сайта. Уже опубликовали >200 полезных техник, а впереди — заготовки на >100 постов.
Для подписчиков есть возможность бесплатно заказать юзабилити-аудит в формате экспресс-анализа. Успейте заказать, предложение ограничено загрузкой специалистов.
Источники
- Miles А. Tinker. Bases for Effective Reading, University of Minnesota Press, 1963; Miles А. Tinker. Legibility of Print, lowa State University Press, 1965.
- Р. Брингхерст. Основы стиля в типографике. М.: Издатель Дмитрий Аронов, 2018.
- Магу С. Dyson and Gary J. Kipping. The Effects of Line Length and Method of Movement on Patterns of Reading from Screen // Visible Language, 1998, vol. 32 (2), р. 150-181.