Роман Худоногов, сооснователь и директор продукта в Setka Editor, поделился гайдом по оформлению текста. Из статьи вы узнаете, как сделать так, чтобы ваши тексты читали дольше 15 секунд.
Типографика
- В строку должно помещаться 35−95 символов, как мы уже знаем из «Википедии».
- Количество символов и размер шрифта определяют максимальную ширину строки.
- Удобный для чтения с экрана шрифт (кегль) — 18–19 пикселей.
- Межстрочное расстояние (интерлиньяж) должно быть таким, чтобы глазу было понятно, куда «перепрыгивать». Интерлиньяж соотносится с кеглем в пропорции 3 к 1, то есть если у вас кегль 20, то межстрочное расстояние — 26.
- Читатель должен четко понимать, когда закончился абзац. Чтобы рассчитать расстояние между абзацами, умножаем интерлиньяж на два.
- Еще стоит учитывать количество строк в абзаце. Идеально — пять строк.
- Шрифт должен быть контрастен к фону — иначе читать неудобно. Диапазон значений — от 1 до 21 (обычно указывается как 1:1 – 21:1). Чем больше значение, тем выше контраст.
- Расстояние между элементами должно быть не меньше трех межстрочных интервалов. Это позволяет читателю сориентироваться, где заканчивается одна часть повествования и начинается другая.
- Хорошо, если подзаголовки отличаются от заголовков по начертанию и размеру: так понятнее, где вложенный кусочек, а где — основная часть.
Структура текста
- Структура текста должна быть понятной, а в самом тексте должны быть расставлены акценты.
- Если у вас большая статья, сделайте содержание, чтобы читатель мог сам выбрать интересный раздел.
Иллюстрации
- Большие обложки привлекают внимание.
- Вас запоминают благодаря фирменным иллюстрациям.
- Фотография — то же самое, что иллюстрация.
- Стилизация изображения элементами брендинга.
- Полотна текста читать не интересно. Статьи с визуальными элементами, вставленными через каждые 75−100 слов, получают вдвое больше лайков и шеров.
Верстка страницы
- Несколько объектов в одном экране. Если между двумя абзацами текста нужно поставить две иллюстрации и вы ставите их одну под другой, читателю придется долго скролить. Ставьте обе иллюстрации параллельно — с помощью табличной верстки.
- Иллюстрация списков. Список из 10 пунктов приятнее рассматривать, если есть визуальные якоря.
- Карточки. Используйте текст в карточке: его проще найти на странице, и запомнить содержание.
- Релевантный сайдбар. В нем можно разместить подходящие товары или рекомендации на другие статьи.
- Цитаты в сайдбаре. Когда рассказываете историю, легче зацепить читателя, если показать кусок из интервью большим размером.
- Call-to-action в сайдбаре помогает решить performance-задачи.
- Цифры и факты в сайдбаре. Например, только 1% жителей РФ переболел острыми кишечными инфекциями.
- Цифры и факты в основной колонке текста. Один из самых действенных приемов — это дать срез по цифрам в истории, которую вы рассказываете.
