Как слить трафик с сайта в паблик? 79 примеров размещения социальных кнопок
 

Мы посмотрели: 402 сайта • 744 страницы • 1711 элементов за 32 часа

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

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

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

«Но у нас уже стоят кнопки. А толку нет».

Если кнопки не работают, то возможно, их просто никто не видит. Или вы не объясняете, для чего людям вступать в сообщества и расшаривать материалы. А иногда и не нужно ничего говорить. Достаточно нарисовать страшненького, но забавного монстра, который приглашает вступить в группу. Понимаете, в чём дело? Стоит попробовать разные методы вовлечения в соцсети, прежде чем опускать руки.

Давайте разберёмся, какие социальные иконки работают лучше всего? Как выбрать размер и цвет? Где разместить? Как написать призыв к вступлению в сообщества?

Посмотрите 79 примеров кнопок и виджетов социальных сетей на сайтах различных тематик.

Определите цвет

Используйте иконки и виджеты стандартных сине-голубых расцветок, пользователям они хорошо знакомы. Или нарисуйте свои собственные, оригинальные, но хорошо сочетающиеся с остальными элементами сайта.
На сайте мебельной фабрики «Лель» ссылки на сообщества в социальных сетях расположены на странице о компании. Тематическое оформление ссылок в виде мягких кубиков со зверюшками перекликается со сферой деятельности фабрики — производством детской мебели.
1

На сайте Центра карьеры «YesJob.ru» справа находится кнопка Фейсбука в фирменном красном цвете.
2

Настройте размер

Небольшие иконки легко вписать практически в любое место на сайте. Зато гигантские кнопки полностью захватывают внимание пользователей. Попробуйте поместить иконки соцсетей на яркую плашку во всю ширину страницы, чтобы никто не прошёл мимо.
В интернет-магазине «LoveBeats.ru» ссылка на группу ВКонтакте находится в крупном блоке во всю ширину экрана.
3

В нижней части сайта службы доставки продуктов «ВкусНаДом» находится огромная красная плашка со ссылками на группы в социальных сетях.
4

На странице контактов рекламного агентства «МcCann Moscow» есть крупная кнопка Фейсбука.
5

Выберите место

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

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

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

На сайте детского интерактивного музея «КидБург» ссылки на группы в социальных сетях расположены в ярко оформленном блоке посередине главной страницы.
6

В книжном интернет-магазине «Лабиринт» социальные кнопки расположены вверху страницы.
7

В промо-разделе «Тренируйся с чемпионами» на сайте «Adidas» соцкнопки находятся в нижней части страницы.
8

На сайте свадебного салона «Мэри Трюфель» социальные кнопки встречаются дважды: в середине и в подвале главной страницы.
9

10

На промо-странице издательства «Манн, Иванов, Фербер» есть два блока с соцкнопками: в середине страницы и в подвале.
11

12

На сайте «Высшей школы экономики» блок с социальными кнопками находится в правой части страницы.
13

На сайте телеканала «СТС» социальные кнопки находятся в самом верху страницы.
14

На сайте «Шоу сумасшедшего профессора Николя» ссылки на социальные сети есть на странице с контактами.
15

На сайте «Альфа-Банка» есть отдельная страница со ссылками на официальные представительства в соцсетях.
16

На промо-сайте «Mentos» есть отдельная страница с приглашением присоединиться к бренду в социальных сетях.
17

На сайте телеканала «СТС» компактно размещены виджеты трёх социальных сетей: их можно просмотреть внутри одного блока.
18

Виджет с пятью социальными сетями находится среди анонсов статей на главной странице сайта «Cosmopolitan».
19

На сайте некоммерческого просветительского проекта «Arzamas» социальные кнопки находятся справа.
20

В подвале сайта для молодых родителей «Pampers» выделен небольшой аккуратный блок с соцкнопками.
21

Отображайте по-разному

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

Блок с соцкнопками можно ещё и закрепить. Его всегда будет видно на экране при прокрутке страницы. Подумайте, насколько это уместно сделать на вашем сайте.

Социальные кнопки на сайте Константина Ашифина находятся в закреплённой плашке, которую постоянно видно при прокрутке. Здесь можно поставить лайк странице и рассказать о сайте друзьям.
22

Социальные кнопки с статьях на сайте «Медузы» появляются вверху в плавающем блоке, который всё время видно при прокрутке.
23

На проекте «Велосипедизация Санкт-Петербурга» есть яркая плашка со ссылкой на группу ВКонтакте во всю ширину страницы.
24

Добавьте эффекты

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

Блок с социальными кнопками на сайте «Медузы» разворачивается в верхней части страницы по нажатию на кнопку со стрелкой.
26

На сайте мебельной фабрики «Лель» блок с пятью социальными кнопками появляется по наведению на иконки ВКонтакте и Фейсбука вверху страницы.
27

Кнопки для расшаривания на промо-сайте «Cross production» появляются внизу страницы во всплывающем окошке.
28

Социальные кнопки на сайте типографии «Листовка-завтра.рф» располагаются внизу страницы. При наведении на каждой кнопке появляется розовая обводка.
29

На сайте «NN-Radio» блок с социальными виджетами разворачивается слева по нажатию на иконку с плюсом.
30

Покажите количество участников

Выведите число всех, кто состоит в ваших группах, на странице вашего сайта. Или хотя бы настройте социальный виджет так, чтобы было видно число участников в сообществах и, по возможности, их аватарки. В таком варианте виджет сработает как социальное доказательство — подтверждение того, что компании уже доверяют сотни или тысячи других людей.
На сайте сети фитнес-центров «Sportlife» блок со ссылками и количеством подписчиков в разных социальных сетях находится в подвале.
31

Призывайте вступать в группы

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

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

Брокер на рынке Форекс «Grand Capital» приглашает присоединиться к сообществам в социальных сетях и участвовать в конкурсах каждую неделю.
32

Новые посетители сайта «ВОС» видят всплывающее окошко с приглашением подписаться на сообщества в социальных сетях.
33

AdMe.ru выражает благодарность читателям и приглашает подписаться на группу ВКонтакте.
34

Приглашение подписаться на сообщество в Фейсбуке появляется на AdMe.ru во всплывающем окошке во время прокрутки страницы.
35

Телеканал «СТС» приглашает пользователей сайта голосовать во ВКонтакте за участников шоу «Два голоса». Ссылка с сайта ведёт на конкретный пост в группе.
36

Журнал «Главбух» призывает бухгалтеров дружить и общаться на профессиональные темы в социальных сетях. Призыв к вступлению в сообщества всё время видно во всплывающем окошке внизу слева.
37

Цветочный склад «Всё пучком» показывает всплывающее окошко новым посетителям сайта с призывом вступить в группу ВКонтакте и участвовать в еженедельных розыгрышах бесплатных букетов.
38

Некоммерческий просветительский проект «Arzamas» предлагает подписаться на сообщество ВКонтакте. Призыв размещён на яркой плашке, оформленной в стилистике сайта.

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

39

На сайте образовательного проекта для призывников «Armydocs» призывает подписаться на сообщества в социальных сетях и следить за новыми материалами.
40

Понятно опишите сообщество

Расскажите на языке целевой аудитории, что есть хорошего в ваших сообществах. Напишите, какой тип контента ждёт пользователей и чему он посвящён: статьи о рыбалке, рецепты к рождеству, фотографии подводных лодок, видеосъёмки дикой природы и так далее.
Бренд «Малютка» объясняет молодым мамам на понятном им языке, ради чего стоит вступить в группу в Одноклассниках, подписаться на Инстаграм и канал на Youtube.
41

Студия «Панкисофт» показывает, что в Фейсбуке можно почитать новости и обсудить статьи.
42

На сайте спортивных клубов «Sportlife» рассказано о том, что ждёт пользователей в сообществах в разных социальных сетях.
43

Рифма.ру приглашает читателей делиться стихами в социальных сетях.
44

Интернет-магазин «Колибри» сообщает клиентам, что в сообществах в социальных сетях можно узнавать о новостях, акциях и специальных предложениях.
45

Разместите кнопку «Поделиться»

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

Выберите место для кнопки «Поделиться»: рядом с заголовком, в середине или в конце страницы. Или повторите кнопки несколько раз.

В статьях на сайте ресторанного холдинга «Ginza Project» кнопки для расшаривания материала в соцсетях появляются по наведению на иконку с сердечком.
46

На сайте «Связного» рядом с заголовком акции есть компактный блок с соцкнопками и призывом делиться ссылкой с друзьями.
47

В конце каждой статьи на портале бизнес-новостей «Finparty» размещены кнопки для расшаривания материала в социальных сетях.
48

В конце статей на сайте «Давай сходим!» есть призыв делиться материалом, который понравился.
49

В блоге сети ресторанов «Две палочки» кнопки для расшаривания есть в начале и в конце каждой записи.
50

В статьях на проекте «Recycle» кнопки для шеринга с призывом «Поделиться» повторяются дважды: в начале и в конце.
51

В статьях на сайте «Мела» есть плавающие кнопки шеринга, которые видно при прокрутке страницы.
52

После скачивания бесплатного изображения на фотостоке «Pixabay» появляется всплывающее окошко с просьбой поддержать проект: купить чашку кофе или расшарить ссылку в социальных сетях.
53

Все узнают о доставке сладкой немытой моркови из интернет-магазина «Деликатеска.ру» благодаря кнопке «Рассказать друзьям».
54

В подвале сайта бонусного клуба «Много.ру» есть призыв поделиться ссылкой на сайт в социальных сетях.
55

«Cosmopolitan» призывает поделиться статьёй с друзьями.
56

Герой сайта «ЛабиринтУм» Человек Наук призывает поделиться понравившимся постом из блога с друзьями.
57

Интернет-магазин «Love Home Love» призывает пользователей рассказать о чудо-фартуках. По нажатию на призыв во всплывающем окошке появляются кнопки для шеринга во ВКонтакте и Фейсбуке.
58

Сервис доставки подарков «EnjoyMe Box» подсказывает свой фирменный хештег и призывает делиться информацией о сайте с друзьями.
59

Онлайн-кинотеатр Ivi.ru предлагает поделиться ссылкой на фильм с друзьями.
60

Призывайте расшаривать

Напишите, почему нужно поделиться ссылкой на сайт в социальных сетях. Объясните это в двух-трёх словах, но как можно конкретнее.

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

Жители клубного посёлка «Европа» могут расшарить ссылку на сайт в социальных сетях и спросить друзей, хотят ли они приехать в гости.
61

AdMe.ru говорит «спасибо» пользователям за входновение и мурашки и предлагает делиться материалами в Фейсбуке и ВКонтакте.
62

«Финолог» посчитал, сколько на самом деле стоит рабочее время сотрудников за месяц работы. И призывает поделиться шокирующей информацией с друзьями.
63

Проект «Давай сходим!» предлагает делиться новостями о предстоящих концертах.
64

Призыв чекиниться и приглашать друзей в социальных сетях замаскирован под одно из правил поведения в Парке Горького. Использовать хештег парка — обязательно.
65

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

Поощряйте

Тем, кто расшарит материалы вашего сайта в социальных сетях, пришлите виртуальный подарок. Что-то бесплатное, но полезное, например, сборник рецептов или руководство по расчёту калорийности питания.
«Финолог» пришлёт методичку о мотивации персонала всем, кто расшарит ссылку на сайт в социальных сетях.
67

Онлайн-университет «Нетология» подарит месяц обучения за каждого пользователя, который перейдёт на сайт по расшаренной в соцсетях партнёрской ссылке и оплатит доступ к курсам.
68

Играйте

Подготовьте увлекательный тест на проверку знаний в той или иной области. Придумайте весёлые звания тем, кто даст разное количество правильных ответов. И призывайте поделиться результатами в социальных сетях.
На проекте «Чехов жив» участники проходят тест и получают различные звания, которыми можно поделиться в социальных сетях.
69

Компания «Антияма» предлагает жителям Краснодара фотографировать ямы на дорогах города, выкладывать фото на сайт и делиться ссылкой с друзьями в социальных сетях. Фирма бесплатно залатает яму, фотография которой наберёт больше всего голосов. Так «Антияма» привлекает трафик из социальных сетей и продвигает свою основную коммерческую деятельность по устранению повреждений на дорогах.
70

«2ГИС» предлагает выбрать подарок из списка, рассказать о нём в социальных сетях и не удалять пост до конца конкурса. Победители конкурса определяются случайным образом.
71

72

Для того чтобы проголосовать за участников виртуальных битв на сайте «Драка Собака», нужно опубликовать пост о голосовании в социальной сети.
73

Образовательный проект «Arzamas» предлагает пройти тест на знание представителей русской культуры и поделиться результатами в социальных сетях.
74

На совместном проекте Vc.ru и Яндекс.Кассы можно протестировать свои способности к управлению интернет-магазином. В конце теста пользователей ждёт призыв поделиться результатом в социальных сетях.
75

На спецпроекте «Супер-женщины» телеканала «FOXlife» легко создать инфографику о повседневных женских делах и поделиться своими достижениями с друзьями в социальных сетях.
76

На проекте «Дед Мороз Aviasales» можно выиграть путешествие, если поделиться ссылкой с друзьями.
77

Можно выиграть путешествие в Гонконг от «Aviasales», если поделиться ссылкой в социальной сети.
78

Используйте «социальный замок»

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

Установите на сайт плагин «Social Locker» или подобный ему, который скрывает часть контента. Сначала пользователь лайкает или репостит нужный вам контент в соцсети. А затем автоматически получает доступ к обещанному бонусу.

На образовательном проекте для призывников «Armydocs» часть контента доступна только подписчикам сообществ в социальных сетях.
79

Коллегам тоже нужно это прочитать:

Не пропусти следующий выпуск Гудсайта