Сначала небольшая история. На второй ступени школы бюро студенты выполняют два практических задания, связанных между собой.
В настоящем школьном задании подробно описано, чем занимается компания и с какими проблемами она столкнулась. А совет — без спойлеров.
В первом задании под руководством Максима Ильяхова нужно собрать страницу сайта некой компании, которая столкнулась с несправедливо негативным освещением своего продукта в СМИ. Задача: развенчать мифы и успокоить потенциальных клиентов.
В настоящем школьном задании подробно описано, чем занимается компания и с какими проблемами она столкнулась. А совет — без спойлеров.
Во втором задании под моим присмотром студенты собирают многоэтажную модульную страницу на основе того, что они сделали в первом задании.
Некоторые студенты в рамках первого задания пишут и верстают статьи — так, будто компания из задания решила написать пост в свой корпоративный блог. Статьи представляют собой длинный линейный текст, обогащённый подзаголовками, фотографиями, графиками и видеороликами.
При выполнении второго задания большинство студентов берут свои статьи и подкручивают вёрстку, наводят марафет в шрифтах, добавляют один‑два фактоида. А потом показывают результат мне и получают суровый ответ:
Это текстовая линейная страница, а не модульная. Это не по заданию.
Модульная страница состоит из отдельных блоков и этажей. Текстовая страница представляет собой поток для последовательного чтения:
Студенты говорят «Окей» и быстренько разбирают свою статью на разнообразные этажи: включают чередование ритма, разбивают текст на колонки, обильно увешивают страницу фактоидами, выносами и другими элементами, которые смогут помочь быстро разнообразить ритм. А потом показывают результат Ильяхову и получают ещё более суровый ответ:
Это адски перегруженный текст. Это невозможно читать.
✸✸✸
Эта история хорошо иллюстрирует главную мысль совета: нельзя просто так взять и сделать модульную страницу из текстовой. Нельзя просто разрезать связную статью на по‑разному оформленные кусочки. Чтобы лучше выразить мысль, доведу ситуацию до абсурда: представьте, что «Капитанскую дочку» Пушкина разрезали на модули и зачередовали. Разве её станет удобнее читать? Скорее, наоборот. Текст, предназначенный для последовательного чтения, должен оставаться линейным.
Чтобы превратить линейную страницу в модульную, её текст придётся переработать. Бывает, что достаточно изменить несколько строк и заголовков, а иногда приходится переписать весь текст и изменить формат подачи.
Разберём несколько примеров.
На промостранице компании «Шопфанс» молодая мама рассказывает, как она покупала и заказывала доставку детской одежды из Америки. Рассказ героини — связная история, но на промостранице он аккуратно разделён на независимые блоки, посвящённые разным аспектам: рассказу о себе, об устройстве процесса покупки, о получении посылки, о плюсах и минусах доставки. Независимые блоки хорошо встраиваются в чередующиеся по ритму этажи:
На промостранице Корпоративной школы главбуха рассказ об устройстве школы подан в виде пошаговой инструкции. Каждый шаг представлен в виде независимого блока:
А на промостранице Оксфорд‑теста линейные куски текста — рассказ о пользе теста и ответы на частые вопросы — наоборот не порезаны на части, а встроены между другими этажами страницы. Когда читатель до них добирается, чередование ритма и украшательства не мешает ему спокойно читать длинный текст:
Обратите внимание, как в последнем примере не связанные друг с другом блоки текста типа отзывов спокойно встают в две колонки.
P. S. Это был совет по средам о вёрстке и типографике в вебе. Хотите знать всё об интерлиньяжах, полях, отступах, кеглях, выравниваниях и модульных сетках? Присылайте вопросы.