Типографика на сайте: шрифты, читаемость, кириллица и латиница
Текст занимает большую часть площади сайта. Хорошая типографика делает сайт понятнее — и это самый дешёвый способ улучшить восприятие.
Главное ограничение: поддержка языков
Многоязычный сайт в Узбекистане требует шрифта с кириллицей и латиницей, причём латиница должна корректно отображать o', g', sh, ch и апострофы в узбекских словах.
Проверять нужно не по названию, а по факту: наберите строку с узбекскими и русскими словами в обоих начертаниях и посмотрите на результат. Часто выясняется, что кириллица в шрифте есть, но нарисована небрежно и выглядит чужеродно рядом с латиницей.
Отдельный подводный камень — апостроф. В узбекской латинице используется модификатор, который в некоторых шрифтах отсутствует и подменяется прямой кавычкой. На заголовках это заметно.
Сколько шрифтов нужно
Двух достаточно: один для заголовков, один для текста. Можно обойтись и одним с разными начертаниями — это почти всегда выглядит опрятнее, чем три разные гарнитуры.
Каждый дополнительный шрифт — это ещё несколько сотен килобайт загрузки. На мобильном интернете это напрямую влияет на скорость появления текста.
Размеры и интерлиньяж
Основной текст на мобильном — не меньше 16 пикселей. Меньший размер заставляет пользователя увеличивать масштаб, а часть аудитории просто уходит.
Межстрочный интервал для длинного текста — около 1.5. Плотно набранный текст выглядит компактно на макете и утомляет при чтении с телефона.
Ширина строки — примерно 60–80 символов. Текст на всю ширину широкого экрана читается плохо: глаз теряет начало следующей строки.
Иерархия
Достаточно трёх-четырёх уровней: заголовок страницы, заголовок раздела, подзаголовок, основной текст. Разница между уровнями должна быть очевидной — если два уровня отличаются на два пикселя, иерархии нет.
Выделяйте важное одним способом за раз. Жирный, курсивный и цветной текст одновременно перестают выделять что-либо, потому что глазу не за что зацепиться.
Технические детали загрузки
Подключайте только используемые начертания. Шрифт, загруженный во всех толщинах «на будущее», добавляет вес каждой странице без пользы.
Настройте отображение текста так, чтобы он был виден системным шрифтом до загрузки фирменного. Иначе на медленном соединении посетитель несколько секунд смотрит на пустой экран вместо текста.