Тизер к статье для соцсетей: оформление, текст, картинка

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

Соцсети дают большой охват

Глобальные и российские социальные сети каждый год увеличивают охват. В одной только Вконтакте ежемесячная аудитория в 2016 году составила 82 млн человек (отчет mail.ru в PDF). Фейсбук чуть меньше — около 15 млн каждый месяц по прогнозу Audience и отчету Айраны Монгуш на VideoDays.

Вместе с охватом растет конкуренция. По данным Brand Analitics, количество пишущих авторов, которые регулярно публикуют посты, увеличивается. В мае 2017 по разным социальным сетям статистика выглядела так:

  • Во Вконтакте: 25,7 млн активных авторов, 310 млн сообщений
  • В Instagram: 7,1 млн авторов, 71 млн сообщений
  • В Facebook: 1,9 млн авторов и 53,4 млн сообщений
  • В российском: Twitter 1,2 млн авторов и 78 млн твитов

Пробить этот инфошум и донести информацию помогают грамотно оформленные тизеры для социальных сетей.

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

Информацию пользователю показывают при помощи умных лент. Каждому посту присваивают рейтинг. На ранжирование по популярности влияет:

  1. Как часто пост лайкают и шерят другие пользователи

  2. Ваши активности по схожим публикациям (любите подборки с книгами, будете чаще их видеть)

  3. Лайкнули вы похожий пост до прочтения или после, что ценится выше

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

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

Параметры иллюстраций и длина текста

Тизеры в разных соцсетях выглядят по-разному. Вот пример из Фейсбука:

Составляющие тизера на Фейсбук

Тизер статьи в Фейсбуке с основными элементами

Во Вконтакте нет описания статьи под заголовком, а картинка подтягивается другого размера — 537×240 пикселей вместо 1200×630, как у Фейсбука. Подробно о размерах иллюстраций можно прочитать в статье Анны Черной. Что касается текста, поддержка Вконтакте рекомендует уложиться в 280 символов, чтобы текст не обрезался. В Фейсбуке все сложнее — вопрос в поддержку на эту тему висит неотвеченным уже год. На практике лучше не выходить за 300–350 символов, хотя часто в описании до ката умещаются 400–480 символов.

Так ввыглядит тизер во Вконтакте

Тизер статьи во Вконтакте

Твиттер сам ограничивает размер поста до 140 символов, 26 из которых уходят на ссылку, так что лучше её сокращать.

Тизер для Твиттера ораничен

Тизер статьи в Твиттере

Чтобы сделать тизер более привлекательным, можно оформить его в виде Twitter-card. Женя Крюкова подробно объясняет, как это сделать. Тогда репост вашей статьи будет выглядеть так:

Используйте Twitter-card, чтобы сделать тизеры в Твиттере более привлекательными

В Инстаграме нельзя прикрепить ссылку к иллюстрации. Ссылку можно добавить только в описание профиля, так что придется каждый раз обновлять его, если хотите продвигать записи на своем сайте. Из-за этого постить и оформлять статьи в Инстаграме придется вручную. Размер иллюстрации для поста — 1080×1080 пикселей. Длина текста — до 2200 символов в описании и около 100 в превью в ленте.

В Инстаграм тизеры оформляют без ссылок

Способ оформить тизер статьи в Инстаграме

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

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

Так выглядит анонс статьи на канале в Телеграме

Вид записи на канале в Телеграме

В Одноклассниках внешний вид тизера мало чем отличается от Фейсбука или Вконтакте.

В Одноклассниках тизеры мало отличаются от Фейсбука и Вконтакте

Тизер статьи в Одноклассниках

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

Протокол Open Graph подсказывает, что показать в тизере

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

Тизер, по которому не хочется кликнуть

Такой формат никого не привлекает

Чтобы соцсеть не запуталась, ей нужна подсказка. Такой себе указатель «брать контент здесь». Для этого существует протокол Open Graph. Разработанный, чтобы подружить сайты с Facebook, он работает для большинства социальных сетей. Его смысл в том, чтобы прописать в HTML-коде страницы специальные теги. Эти теги подсказывают соцсетям, какой текст и иллюстрацию отображать в тизере.

Используйте подсказки поддержки для оформления тизера

Скрин и официальное мнение из поддержки Вконтакте

Обязательные элементы:

  • og:type — тип страницы, её содержимое

  • og:title — заголовок статьи

  • og:url — ссылка на статью, которая присваивается изображению и заголовку

  • og:image — изображение, которое надо показать

  • og:description — описание под заголовком

Дополнительные свойства:

  • og:site_name — название сайта

  • og:locale — язык

  • og:audio или og:video — информация об аудио или видео на странице

Используйте эти теги для тизеров

Обязательные теги для тизера

Пакет og-тегов для статьи на иллюстрации выше выглядел бы так:

<meta property="og:type" content="article">
<meta property="og:title" content="Чеклист по подбору семантического ядра">
<meta property="og:url" content="http://www.cossa.ru/trends/179652/&quot;&gt;
<meta property="og:description" name="description" content="О чём знать заказчику и помнить исполнителю. Рассказывает Екатерина Ходюшина, руководитель SEO-группы Rookee.">
<meta property="og:image" content="http://www.cossa.ru/upload/iblock/e6b/core748.jpg«&gt;

Подробнее о свойствах и дополнительных качествах протокола Open Graph

Сделать разметку для всех основных социальных сетей вручную можно при помощи сервиса Алексея Симоненко.

Сервис автоматически генерирует код

Сервис для генерации тегов Open Graph, который автоматически генерирует код и для Twitter-card

Вставлять разметку надо между тегами <head> и </head>. Если страница одна, много времени не уйдет. Когда вы используете какую-либо CMS (Content Management System) — систему управления контентом, страницы формируются динамически. Тогда удобнее использовать плагин — надстройку, которая автоматически добавит теги. Плагины для:

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

Текст для тизера

Текст для поста состоит из трех частей:

  • Заголовка
  • Описания, которое вы указали в og:description, и подтянула соцсеть
  • Описания, которое пишет пользователь при репосте или вы при первоначальном посеве

По исследованию HubSpot идеальная длина заголовка для шера в Facebook — 12–14 слов. Для шера в Twitter — 8–12 слов. Чтобы не переживать, что какая-то из соцсетей обрежет слишком длинный заголовок, в этой же статье на HubSpot рекомендуют не разгоняться больше 60–70 знаков.

Как сделать привлекательный заголовок? В статье Дениса Савельева сразу 10 критериев классности, которые можно использовать, создавая заголовок:

  • Выгода для аудитории

  • Цифры и конкретика

  • Персонализация целевой аудитории

В заголовке тизера указывайте, кому будет интересна статья

Сразу понятно, для кого статья

  • Позиционирование (для чайников, например)
  • Противоречия, хайп, недосказанность

  • Диалог с читателем, глаголы повелительного наклонения

  • Краткость

  • SEO и наличие релевантного ключа

  • Комбинация из 2–3 описанных методов

  • Развернутый подзаголовок

Делайте информативные подзаголовки в тизерах

В подзаголовке раскрыт важный момент

Транзитивные заголовки. Они сразу раскрывают суть статьи. Если переделать предыдущий, получится «Минсвязи: С 1 января в России будет действовать государственная криптовалюта мегакоин. Обменный курс 10 рублей». Когда все ясно, дальше переходить на сайт меньше мотивации.

Желтые заголовки. Те, что играют на любопытстве и главных эмоциях — любовь, зависть, секс. Наш заголовок выглядел бы так «Министр связи сказал, что Путин запускает криптовалюту, от которой американцы обделаются». Это желтый заголовок. На них хорошо кликают, но ресурсу с хорошей репутацией следует дважды подумать, прежде чем их использовать слишком часто.

Что писать в описании и подзаголовке

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

Не дублируйте описание, чтобы использовать небольшое количество текста с толком. Иначе вы обрезаете пространство «для маневра».

Не дублируйте информацию в тизере

Два раза одна и та же информация

Хайп и провокация. Аккуратнее с этим — на кону репутация, но бороться за внимание надо. Чем тоньше, тем лучше.

Провокация привлекает внимание

Все знают как заканчивается строчка или легко догадаются

Список, а потом его усиление. Списки и подборки с N полезных программ, статей, сервисов или способов нарезать арбуз всегда привлекают внимание. Они сработают еще лучше, если дать конкретный якорь внимания — «номер 5 просто улет» или «от номера 7 мы были в восторге». Сразу станет интересно, что там за чудеса.

Старайтесь заинтересовать читателя

Уточнение по поводу номера всегда привлекает внимание

Юмор или явный стеб, когда издание или эксперт говорят с видимой иронией или насмешкой.

Если юмор уместен и небанален — это хорошо для тизера

Пост Максима Ильяхова в Телеграме

Серьезные издания тоже делают ироничные тизеры

Юмор от Cossa

Ошибки и их решение. Хорошая статья решает чью-то боль. То есть по сути исправляет какую-то ранее допущенную ошибку. Если вы пишете про настройку рекламной кампании, в описании можно упомянуть 10 ошибок начинающего (или опытного) таргетолога. Мы все боимся делать ошибки, а потому с особым рвением читаем, как их избежать.

На тизеры о решении ошибок охотнее кликают

В сочетании с личным опытом, ошибки «работают» еще лучше

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

Слова-магниты увеличивают интерес пользователей к тизеру

Бесплатные советы Chip.Travel

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

Описывайте в тизере пользу для читателей

Подпись к статье в блоге Texterra сразу рассказывает, что узнает читатель

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

Смайлики. Эмоджи увеличивают конверсию в открытие электронных писем, а бренды стали в 7 раз чаще использовать смайлики в общении с аудиторией. В статьях на HubSpot и в блоге Нила Пателя опубликованы примеры рекламных кампаний, основанных на использовании смайликов. Кто-то из серьезных редакторов может быть против, но эмоджи привлекают больше внимания. Главное — не переборщить с ними в тексте.

Смайлики помогут выделить тизер в ленте

Обилие смайликов мешает читать текст, не увлекайтесь

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

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

Хэштеги могут привлечь пользователей к ранним публикациям

Хэштег поможет найти предыдущие выпуски

Чтобы заставить хэштеги лучше работать во Вконтакте, прочитайте статью на Spark.ru. Или исчерпывающий материал на HubSpot.

Общие рекомендации по тексту описания:

  • Обращайтесь к аудитории

  • Пишите без воды

  • Не бойтесь хайпа и провокаций, экспериментируйте

  • Соблюдайте длину текста до 300 символов

  • Ставьте дополнительную ссылку на статью в описание

  • Следите за тегами Open Graph

  • Используйте смайлики

  • Используйте хэштеги

Иллюстрация

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

Соцсети кэшируют страницу на сайте — запоминают содержимое. Если вы сначала опубликуете одну картинку, а потом замените на другую, отобразится все равно первая. Это заставляет понервничать во время отладки иллюстраций. Чтобы сбросить кэш, используйте VK pages.clearCache, Facebook Open Graph Object Debugger.

Нанесите надпись прямо на картинку. Так главная мысль будет заметнее в ленте.

Текст на картинке тизера привлечет внимание

Очень заметный заголовок, хорошо работает в ленте Твиттера

Проведите неожиданную параллель.

Необычная иллюстрация вызывает интерес

Скорая помощь в трудную минуту

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

На картинку тизера можно поместить емкую цитату из текста

Основная информация мгновенно считывается с большой картинки

Короткий чеклист хорошего тизера

  1. Убедитесь, что на страницах используются теги протокола Open Graph

  2. Для Твиттера используйте теги, формирующие Twitter-cards

  3. Используйте плагины для автоматической разметки OG в CMS

  4. Следите, чтобы контент соответствовал требованиям соцсети

  5. Делайте короткие заголовки

  6. Используйте подзаголовки

  7. Обращайтесь к аудитории

  8. Раскрывайте больше полезного в описаниях

  9. Не бойтесь шутить — соцсети для этого отлично подходят

  10. Убедитесь, что выбрали небанальную иллюстрацию