Буллет: как эффективно использовать списки в текстах на сайте

буллетызаголовокоформление сайта

Буллет или маркер списка — с английского языка переводится как «пуля», а bullet point — «пункт списка». Он структурирует информацию и разбивает сплошной текст на отдельные пункты, которые легче воспринимаются читателем. В этой статье мы разберемся, зачем использовать буллеты, как их оформлять и как правильно добавлять их в текст и на сайт.

Что такое буллет

Буллет — это графический символ, который отделяет предложения новыми пунктами. Он является частью маркированного или нумерованного списков. Буллет изображают в виде точки, числа, буквы, эмодзи, иконки или любого другого графического элемента.

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

Буллет — это довольно новое понятие, например, в русской типографике черный кружок упоминается в книге 1998 года «Справочник издателя и автора» Аркадия Мильчина, а в США первые «пули» появились в 1950 году.

Часто в тексте в качестве буллета можно встретить длинное тире «—», как на примере ниже. А из-за того, что маркер окрашен в красный цвет — список будто показывает отрицательные условия предложения.

Пример списка с длинным тире на сайте «Альфа-Банк»
Пример списка с длинным тире на сайте «Альфа-Банк»

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

Варианты информации, которую можно оформить в виде списков, то есть добавить буллет:

  • Перечисление товаров или услуг.
  • Описание характеристик или преимуществ продукта.
  • Обзор фактов о бренде или компании.
  • Перечисление целей, выводов и других важных моментов в тексте.
  • Добавление отзывов.

Здесь показан пример, как используют буллеты в статье про структуру лендинга. Сначала идет подзаголовок раздела, в котором собраны основные итоги материала. А ниже — важные мысли, которые выделены в список при помощи черных точек.

Пример того, как используется точка для списка в тексте
Пример того, как используется точка для списка в тексте

А ниже приведен пример списка на странице сайта — он расположен горизонтально, а буллеты представлены в виде иконок, под каждой из которых указано короткое название и описание функционала.

Пример, как использовать маркеры для списка в виде иконок на сайте
Пример, как использовать маркеры для списка в виде иконок на сайте

Зачем нужны буллеты в тексте

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

Bullet points помогают:

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

Рекомендуется к прочтению! Узнайте, как написать и оформить SEO-текст.

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

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

Виды маркеров списка

Значок списка может быть оформлен в виде числа или графического элемента. В этом разделе мы подробно разберем виды и отличия.

Списки разделяют на два вида:

  • Маркированный список, или Bullet List.
  • Нумерованный список, или Numbered List.

Маркированные списки

Это неупорядоченные списки элементов, для которых не важна последовательность. Все буллеты оформлены в едином стиле: точки, квадраты, картинки, иконки и так далее.

Ниже показан пример маркированного списка на сайте: буллеты в виде иконок-устройств, с которыми работает умная колонка с Алисой. Под каждым маркером указана расшифровка.

Пример как использовать буллет — символ в виде предметов и устройств для дома
Пример как использовать буллет — символ в виде предметов и устройств для дома

Нумерованные списки

Такой список представляет собой набор пунктов, имеющих определенную последовательность. Для их оформления используют числа.

Нумерованные списки можно встретить в рецептах, инструкциях, руководствах, документах и правилах.

На скриншоте показан пример нумерованного списка, в котором пошагово описывается процесс приготовления сырников. В оформлении используются числа с точкой: «1.», «2.» и так далее.

Пример нумерованного списка
Пример нумерованного списка

А ниже показан пример нумерованного списка с описанием действий того, как почистить базу email адресов. После всех пунктов добавлена CTA кнопка — таким образом, пользователь может сразу воспользоваться предложением и попробовать весь функционал.

Пример нумерованного списка на сайте
Пример нумерованного списка на сайте

Как оформить пункты списка

С началом разобрались — используем буллеты. Но как правильно оформить текстовую составляющую каждого пункта?

Вот несколько правил, как следует оформлять пункты списка:

  • Когда пункты списка являются продолжением незаконченного предложения и одним из вариантов его окончания — начинаем их со строчной буквы, а в конце ставим точку с запятой или запятую, если пункты короткие и простые — состоят из двух слов.
  • Если пункт в списке является самостоятельным предложением — начинаем его с заглавной буквы, а в конце добавляем точку.
  • В случае, когда пункт содержит множество слов, не объединенных в словосочетание или предложение — знак в конце не используем.

Уровни списка

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

Списки делят на два уровня:

  • Одноуровневые — варианты списков без вложений.

На примере ниже показан текст с одним уровнем. В оформлении используется единый стиль буллетов — стрелка.

Пример одноуровневого списка
Пример одноуровневого списка
  • Многоуровневые — списки с пунктами разных уровней.

На скриншоте показаны пункты из трех уровней вложенности. Для оформления используются числа и точки: первый уровень — «1.», второй — «1.1», третий — «».

Пример многоуровневого списка
Пример многоуровневого списка

Какой символ списка использовать: маркер или число

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

Нумерацию лучше использовать в таких случаях:

  • Когда последовательность пунктов в списке определена заранее, например, перечисление процессов в хронологическом порядке: «1» — начало, «2» — сразу после начала, «3» — следует за предыдущим пунктом и так далее.
  • В том случае, когда список имеет в названии цифру: к примеру, «Топ-10 рекламных роликов 2020 года».

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

Буквенные обозначения сейчас уже реже встречаются в статьях или на сайтах, но они остаются актуальными в тестах или анкетах.

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

О том, как правильно и эффективно использовать буллеты в списках, рассказывает дизайнер SendPulse — Алексей Примак.

Алексей Примак
Дизайнер SendPulse
  • Сокращайте длинные предложения. Придерживайтесь правила: в каждом пункте — одно-два предложения.
  • Следите за однородностью. Если вы начинаете с глаголов, как в этом списке, — остальные пункты оформите по такому же принципу.
  • Делайте симметричные перечисления на сайте. Количество текста должно быть одинакового размера для каждого пункта под маркером.
  • Придерживайтесь лимита в 10 пунктов — в других случаях список становится нечитабельным.
  • Выдерживайте средний размер буллета, он не должен быть большим и сильно выбиваться из списка.
  • Замените маркер иконкой, а еще список можно разделить на два столбца и оформить текст цветом или градиентом.
  • Избегайте цифр и показателей без объяснений — опишите выгоду и расскажите, почему на них стоит обратить внимание вашему читателю.
  • Выстраивайте предложения в порядке убывания важности, а в конце добавьте мощный CTA.

Примеры хорошего использования буллетов

В этом примере показано, как можно использовать интерактивное оформление списков: при нажатии на новый пункт открывается описание и преимущества. Важно отметить, что названия начинаются с одного и того же слова, а для маркеров используются вертикальные линии.

Пример хорошего оформления списка с интерактивным переключением

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

Пример разделения списка на два столбца и оформления текста градиентом
Пример разделения списка на два столбца и оформления текста градиентом

Ниже показан пример, как можно использовать цифры в заголовках пунктов. Компания рассказывает пользователям о качестве матраса и его полезных свойствах. Буллеты оформлены в виде иконок в едином стиле — сине-голубых тонах с акцентами желтого цвета: рейтинг, комфорт и правильное положение позвоночника.

Пример, как можно использовать цифры в списках
Пример, как можно использовать цифры в списках

Еще один пример интерактивного списка: с помощью стрелок с изображениями того, как ноутбук реагирует на повреждения, можно включить полное описание краш-теста.

Пример, как можно использовать интерактивное переключение пунктов списка на сайте

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

Пример списка в блоках на сайте

Здесь показан пример того, как можно оформить сайт в виде нумерованного списка: «50 причин для путешествий». В меню расположено 50 блоков, при выборе любого из них появляется название страны, популярное место для туристов и его краткое описание.

Пример оформления сайта нумерованным списком

Примеры плохого использования буллетов

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

Пример плохого оформления предложений в списке
Пример плохого оформления предложений в списке

Ниже — пример того, какую информацию не нужно выносить в список. Этот перечень легко можно трансформировать в одно короткое предложение.

Пример того, когда не нужно выносить информацию в список
Пример того, когда не нужно выносить информацию в список

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

Пример того, как не нужно сокращать информацию в списке
Пример того, как не нужно сокращать информацию в списке

Далее идет пример плохого расположения блоков списка: они скачут на экране, из-за чего пользователь не понимает, в каком порядке нужно читать — и даже буллеты не спасают ситуацию. Скорее всего, человек даже не прочитает информацию в блоках, а сразу перейдет к следующей странице.

Пример плохого оформления списка на сайте
Пример плохого оформления списка на сайте

Ниже показан пример, как не нужно делать отступы с маркерами списка. Старайтесь ставить их рядом с текстом, чтобы пользователь не искал начало пункта и не отрывался от чтения.

Плохой пример оформления нумерованного списка
Плохой пример оформления нумерованного списка

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

Пример, как не нужно составлять список — добавлять разрозненные разделы в один блок
Пример, как не нужно составлять список — добавлять разрозненные разделы в один блок

Заключение

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

  • Буллеты — это любые графические символы.
  • Поисковые сети положительно реагируют на нумерованные и маркированные списки.
  • Многоуровневые списки с большой вложенностью не используют в статьях и на сайтах.
  • Маркеры добавляют к спискам из 10 и менее пунктов, в иных случаях применяют числа.
  • Буллеты — это хороший инструмент для акцентирования внимания читателя на важных деталях.

Регистрируйтесь в SendPulse и пользуйтесь инструментами и шаблонами для оформления списков в email рассылках, web push, Viber и SMS оповещениях, а также чат-ботах в мессенджерах Facebook Messenger, ВКонтакте и Telegram!

[Всего: 5   Средний:  5/5]

15 000 email сообщений бесплатно каждый месяц