Как оформить текст так, чтобы его прочитали?

Роман Худоногов, сооснователь и директор продукта в 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% жителей РФ переболел острыми кишечными инфекциями. 
• Цифры и факты в основной колонке текста. Один из самых действенных приемов — это дать срез по цифрам в истории, которую вы рассказываете.