Новый формат обложек для сообществ ВКонтакте, дизайн и наполнение

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

Немного предыстории

1 апреля соцсеть  ВКонтакте начала глобальное тестирование так называемого нового дизайна. Тогда же была анонсирована настраиваемая «шапка». На РИФ+КИБ (http://2016.russianinternetforum.ru/) представители ВКонтакте рассказывали, что это  будет блок, который сможет стать для интернет-магазина  во ВКонтакте витриной, а в группе кинотеатра там можно будет разместить видеоролик. Шел месяц за месяцем. 17 августа ВКонтакте перевел всех пользователей на новый дизайн, а шапки все не было. Многие стали переоформлять свои сообщества под новый дизайн, и тут 31 октября 2016 года ВКонакте все-таки запустил шапки.

Что же в итоге мы имеем: теперь во всех сообществах — группах, пабликах, мероприятиях — можно установить широкое изображение:

Характеристики и размер обложки группы ВКонтакте:

• размер: 795х200 рх и 1590х400 рх для экранов повышенной четкости;
• формат: JPG,  GIF,  PNG;
• загрузка: из управления сообществом, нужны права администратора;
• рекомендации от ВК: размещайте важную информацию ближе к центру для мобильных устройств.

2 ноября 2016 года обложки стали видны и в мобильной версии ВК по адресу m.vk.

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

1. Кнопки CTA («написать сообщение», «подписаться», «вступить в группу» и так далее) выстроились в ряд под правым нижним краем обложки друг за другом.
2.  У сообществ появились миниатюры.
3.  Добавились вкладки: первой идет закрепленная запись (если она стоит в сообществе), далее следует вкладка «информация о сообществе» (теперь она доступна пользователям). В третьей вкладке расположено меню — для групп и мероприятий. В паблике данная вкладка отсутствует. Меню теперь также постоянно доступно для пользователей.

Оформление обложек ВКонтакте

Давайте разберем, какие данные нам нужно разместить на обложке:

1. Название бизнеса (или его направление).
2. Город, адрес (если проект региональный).
3. Телефон для быстрого заказа (с кодом города).
4. Уникальное торговое предложение (то, чем вы отличаетесь от других).
5. Призыв (соответствующий вашему конверсионному пути).

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

Например, на 2 части:

На первой части мы помещаем цепляющее фото, отражающее направление проекта, располагаем фото так, чтобы движение взгляда приводило пользователя ко второй части обложки, где располагаем УТП и выгоды от подписки. Добавляем призыв к действию.

Легче воспринимается обложка, поделенная на 3 части, связанные воедино стилистикой, каждая из которых составляет законченные блок:

Возможно, по аналогии с обложками Facebook, в мобильных приложениях будет виден лишь центр обложки. И именно туда я помещаю название компании или логотип, город, адрес и телефон. Слева размещаю УТП проекта или выгоды от подписки. Справа — интерес целевой аудитории проекта и/или призыв.

Как разместить обложку сообщества ВКонтакте

Теперь давайте разберемся, как же установить обложку в ваше сообщество.

• Зайдите в управление сообществом (нужны права администратора).
• Вы находитесь в настройках. Найдите пункт «обложка сообщества», нажмите «загрузить».
• В открывшемся окне нажмите «выбрать файл».

• Перейдите в папку с подготовленным заранее фото, выберите его.  Если фото выбрано в произвольном размере, то  оно будет кадрироваться в соотношении сторон  1:3,975.

• Нажмите «сохранить и продолжить».

Готово, ваша обложка было успешно установлена в группу.

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

Обратите внимание, что полноценный аватар, если он отображался до этого у вас в группе, при установке обложки исчезает из видимости. Его функция — стать миниатюрой, которая представляет вашу группу в списке всех групп пользователей (ее размер 200х200 рх) и присутствует на стене рядом с названием сообщества (ее размер 100х100 рх). Тут логичнее всего расположить логотип на контрастном фоне.

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

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

И, напоследок, несколько советов лично от меня:

• на обложке запрещается сторонняя реклама, не пренебрегайте этим правилом ВК, дабы не потерять функцию добавления обложек в ваше сообщество или не получить бан;
• при создании документа используйте режим sRGB  для правильного отображения цветов вашей обложки в web-пространстве;
• не используйте яркие цвета, градиенты, мелкие узоры, (помните, что ВКонтакте сжимает изображения, особенно страдают красный, оранжевый, чисто-белый);
• сохраняйте обложку через функцию «сохранить для WEB» в формате PNG, он наиболее устойчив к сжатию;
• для ускорения загрузки, можно перетаскивать обложку прямо из папки на окно загрузки обложки.

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

Всем удачных идей!

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