Как оформить текст для интернет-магазина: основные правила и подходы

Структура текста

Просматривая текст в первый раз, читатель прежде всего хочет определить, насколько полезна для него изложенная информация, особенно если речь идёт о лонгриде. Структурированное повествование с содержательными подзаголовками разных уровней, списки и ритмика предложений помогают удержать внимание читателя. 

Заголовки

Использование подзаголовков обязательно для всех текстов. Если речь о небольшом тексте, примерно на 3 000 символов, достаточно подзаголовков уровня H2-H3. У лонгридов будет ещё более дробная и упорядоченная структуре. 

Заголовок должен:

• отображать суть текста;

• привлекать внимание — содержательностью или интригой;

• выделяться визуально;

• контрастировать с основным текстом: если для самого текста используется шрифт без засечек, то для заголовков стоит подобрать шрифт с засечками. Для подбора шрифтовых пар существуют специальные сервисы, например, Mixfont, Fontpair и другие.

Также важна иерархичность заголовков. Это значит, что после заголовка уровня H2 должен обязательно идти заголовок H3. Аналогично и в других случаях. Заголовок уровня H1 должен использоваться только один раз — в названии текста.

Точка в конце заголовка не ставится, восклицательный и вопросительный знаки разрешены.

Списки

При наличии большого количества информации структурировать её помогают списки. Их можно оформлять как нумерованные (если важна последовательность действий), так маркированные (во всех остальных случаях). Нумерованные списки могут включать от двух пунктов. Для маркированных минимальное количество элементов — три. 

Каждый элемент нумерованного списка начинается с большой буквы и заканчивается точкой.

Пункты маркированного списка пишутся с маленькой буквы и завершаются точкой с запятой. Точка ставится только после последнего пункта.

Текст не следует завершать списком: чтобы избежать ощущение недосказанности, необходимо сделать вывод из вышесказанного.

Абзацы, предложения и длина строки

Абзацы не должны быть слишком длинными. Максимальная длина абзаца — 5-7 строк. В этот объём нужно уложить законченную мысль. Если абзац получается слишком длинным, лучше разбавить текст инфографикой или другой иллюстрацией. 

Относительно длины предложений четких правил нет. Однако стоит помнить о ритме текста: чтобы создать легкий читабельный ритм, следует чередовать длинные предложения с предложениями средней длины и короткими. При этом лучше избегать громоздких конструкций с множеством придаточных.

Максимальная длина строки для веб-ресурса — 90-95 символов. Такой размер позволяет пользователям быстро прочесть материал, не прокручивая страницу влево-вправо.

Иллюстрации

Иллюстрации помогают оживить текст и привлекают дополнительное внимание. Материалы с изображениями собирают в два раза больше лайков и репостов. 

Иллюстрации в статье должны быть:

• оптимального размера (в среднем 1000х1000 пикселей);

• релевантными статье, в которой размещены;

• не содержащими надписей и водяных знаков;

• имеющими под картинкой комментарий-пояснение.

Что касается стоковые фотографий, их можно использовать, разумно избегая замыленных сюжетов. Также можно обратиться к нейросетям. Если в текст необходимо вставить инфографику или таблицу, подойдут сервисы Visme, Canva, Creately.

Чтобы ваш ресурс был узнаваемым и запоминающимся, иллюстрации должны быть выполнены в едином стиле. 

Также к некоторым статьям уместно прикреплять тематические видеоролики с YouTube или других хостингов.

Ссылки в тексте

Если в тексте присутствуют ссылки, они должны быть заметны читателю с первого взгляда. Для этого их можно:

• выделить курсивом или синим цветом;

• подчеркнуть;

• преобразовать курсор при наведении на ссылку;

• использовать атрибут Title, благодаря которому пользователь видит всплывающую подсказку при наведении на ссылку.

Для оформления ссылок в тексте лучше использовать анкор — релевантное слово (в идеале ключевой запрос), под которым будет спрятана ссылка.

Дизайн текста

Шрифт

Выбранные для сайта пары шрифтов должны соответствовать настроению вашего бренда. Например, шрифт Comic Sans максимально уместен для детского магазина и совсем не подойдёт для сайта юридической тематики. 

Комфортный размер основного текста зависит от выбранного шрифта. Например, стандартный Google Roboto, согласно рекомендациям, не должен быть меньше 16 пунктов. Минимально допустимое значение — 12 пунктов для любого шрифта в основном тексте, для сносок — 10.

Максимально приемлемое количество шрифтов на один текст — три. Но лучше ограничиться одной шрифтовой парой. 

Чтобы облегчить себе выбор шрифтов для сайта, можно воспользоваться Fontpair.

Расположение текста

Высокая плотность текста утомляет читателя. Поэтому не следует забывать о межстрочном интервале. Размер межстрочного интервала рассчитывается в зависимости от размера основного шрифта — в соотношении 4/3. При шрифте 15 межстрочный интервал составит 20 единиц.

Текст следует выравнивать по левому краю. Такое форматирование увеличивает скорость чтения и способствует лучшему запоминанию. По центру можно выравнивать отдельные отрывки текста, на которых вы хотите акцентировать внимание читателя. Выравнивание по ширине страницы почти не используется. Тексты, выровненные по ширине, читатель воспринимает хуже и обрабатывает на 11 % медленнее.

Фон

Цвет фона и шрифта на сайте должны контрастировать так, чтобы чтение не утомляло. Наилучший вариант — светлый фон и основной текст чёрного мягкого оттенка.

Подобрать наиболее гармоничное цветовое сочетание можно с помощью таких сервисов, как Colorscheme.ru, Palettegenerator.com и других.

Заключение

Визуальное оформление текста очень важно для его восприятия читателем. Оформляя текстовый материал, уделите внимание заголовкам, спискам, длине абзацев и предложений. Также помните об иллюстративном материале — фотографиях, инфографике и таблицах. Расположение текста, шрифт и фон играют не менее важную роль.

От комбинации перечисленных нюансов будет зависеть, насколько ваш текст читабелен и каков его заинтересовывающий потенциал.