Як оформити групу в контакті. Як оформити групу в контакті із закріпленим верхнім меню під новий дизайн вк.

Ми випустили нову книгу «Контент-маркетинг у соціальних мережах: Як засісти в голову передплатників та закохати їх у свій бренд».

Група в ВК – це ваше обличчя, тому оформлення групи Вконтакті потребує особливої ​​уваги. Звичайно, можна замовити оформлення групи Вконтакте у фахівців. У цьому випадку вартість залежатиме від обсягу роботи та специфіки. У середньому комплексне оформлення групи в контакті з версткою меню та іншими слугами коштує від 1000 рублів і вище. Якщо вас цікавить оформлення групи Вконтакте самостійно, ця стаття для вас. Насамперед позначимо, що це абсолютно реально.

Розміри елементів

Нижче наведено пам'ятку з розмірами оформлення групи ВК, вірніше за її основні елементи.

Розберемо кожен елемент окремо:

Оформляємо шапку

Оформлення групи ВК неможливо без шапки. Відповідь на питання, як оформити групу в контакті, обов'язково повинна починатися з шапки. Найчастіше в шапці розміщують оголошення, навігаційне меню та найцікавіші пости. Найкраще зробити шапку у вигляді обкладинки. Оформлення групи в ВК за новим дизайном дозволяє додавати великі та привабливі обкладинки. Для цього тиснемо "Завантажити" навпроти "Обкладинки спільноти", як показано на малюнку:

Ось кілька варіантів, що можна розмістити у шапці:

Аватар

Думаєте, як гарно оформити групу у контакті? Тоді не ігноруйте кропітку роботу над аватаром. Це ефективний маркетинговий інструмент, при правильному використанні якого можна досягти бажаного результату.

Хороша мініатюра аватара відповідає наступним критеріям:

1. Текст у ньому великий і видно повністю, його легко читати.
2. Зображення та текст зрозумілі, не намагайтеся впхнути в аватар занадто багато.
3. Краще використовувати оригінальне зображення, зроблене вами, а не завантажене.
4. Використовуйте яскраві фарби, щоб вигідно виділятися на тлі інших зображень, вміло використовуйте контраст.
5. Ефектно виглядають аватари, виконані в стилі мінімалізм: мінімум тексту та непотрібних деталей, максимум краси та простоти.
6. Увімкніть фантазію, щоб залучити та зацікавити користувача - чорний квадрат, значок палаючого повідомлення тощо.

А ось кілька варіантів для розміщення інформації в мініатюрі: анонси, переваги, контакти, низькі ціни, акції, конкурси, що проводяться і так далі.

Вимоги до аватара:

1. Якість. Для цього використовуйте зображення в 2-3 рази більше ніж потрібний розмір.
2. Єдиний стиль. Всі елементи повинні поєднуватися за колірною гамою та загальним стилем.
3. Різноманітність. Краще якщо мініатюра та сам аватар будуть різними зображеннями.

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

Віджети

Це обов'язкова частина оформлення групи у ВК. За допомогою них користувачу зручно виконувати корисні для вас дії: підписатися, взяти участь у конкурсі, зробити замовлення, написати коментар тощо.

Зображення до постів

Найкраще, коли пости супроводжуються зображеннями у єдиному стилі. Це надає групі оригінальності та креативності. Ось чудові приклади:

Як видно з прикладу, компанії створюють унікальні шаблони оформлення групи ВК, а вірніше зображень до її постів, а потім просто доповнює/змінює їх. Зробити подібний шаблон досить просто, ось кілька прийомів:

Для створення якісних та привабливих картинок, які допоможуть зробити гарне оформлення групи Кконтакте, рекомендується використовувати Фотошоп. Якщо ви володієте цією програмою, скористайтесь одним із спрощених аналогів програми: Fotor.com або Canva.com.

Редагуємо статті

Як оформити групу ВК? Відредагувати статті в ній за допомогою редактора, знайти його можна за таким значком:

Про те, як працювати з редактором статей у ВК, ми писали в іншій статті.

Вікі-розмітка

Як правильно оформити групу у ВК, використовуючи вікі-розмітку? Це найважча і водночас найцікавіша частина. Вікі-розмітка є спеціалізованою мовою для роботи з текстами на сайтах, що полегшує доступ до функціоналу мови HTML. При оформленні контакту в групі wiki-розмітка використовується для форматування текстового матеріалу, додавання зображень до нього, розробки навігаційного меню. У цьому використовується спеціалізований ВК редактор.

Розберемо, як створити вікі-сторінку: відкриваємо, браузер і вставляємо в рядок адреси: http://vk.com/pages?oid=-111 &p=Створювана_сторінка, де «111» - ID групи, а «Створювана_сторінка» - назва статті зі словами, написаними через нижнє підкреслення. Часто ми перемикатимемося в режим коду, так що відразу подивимося, як це робити:

Текст форматується в редакторі, який простий і зрозумілий, схожий на ворд. Але в ньому немає опції зміни шрифтів, замість них застосовуються теги: H1, H2, H3, жирне виділення та курсив.

При необхідності, в текст можна вставити посилання через шаблон: [Посилання на статтю | текст посилання].

Для вставки картинки натискаємо на іконку фотоапарата, зручніше зробити це в режимі коду, що дозволить прописати відразу вказати бажані розміри і розмістити зображення посередині.

Є й складніші версії:

Тут спочатку у Фотошопі робиться картинка, яка далі ділиться на частини за допомогою «Розкройки», потім готові зображення вставляються у вікі-пост і кріпляться до них посилання.

Важливо закріпити розроблене меню у шапці сторінки: спочатку робимо меню у вікі-розмітці, а потім зберігаємо його посилання. Після цього вставляємо це посилання в пост, як показано:

Тепер робимо зображення для меню та додаємо їх до посту, прибираємо посилання із спеціального поля для тексту та тиснемо «Надіслати».

Залишилося лише закріпити піст.

Замість ув'язнення

Декілька порад як оформити групу Вконтакте:

1. Коли ви розробляєте дизайн (не має значення, чи використовуєте ви старий варіант або думаєте як оформити групу Вконтакте в новому дизайні), завжди думайте, як це виглядатиме в мобільній версії, чи все зрозуміло та зручно.
2. Не бійтеся експериментувати та розробляти рішення, які не використовують конкуренти. Це лише плюс.
3. Абсолютно рівне та симетричне меню іноді виглядає нудно, тому не зациклюйтесь на ідеальних формах.

Сподіваємося, цей матеріал як зробити оформлення групи у Вконтакті буде корисним. Вдячних вам передплатників!

Якісне оформлення групи ВК - це упаковка для товару, який ви хочете продати. Адже погодьтеся, що річ у неохайній упаковці нікому не хочеться купувати. Так само і з дизайном: якщо хочете, щоб у вашу групу тягнулися люди і скористалися вашими послугами, варто подбати про оформлення.
Якщо дизайн гурту буде красивим і якісним, то люди охоче вступатимуть у вашу спільноту. А як правильно та якісно створити дизайн групи та зробити ваш бренд впізнаваним, розповімо у цій статті.

Навіщо потрібний єдиний дизайн групи ВК?

Наразі для ведення розважального порталу не обов'язково створювати сайт. Часто досить створити якісно оформлену групу ВК. Функції ВКонтакті дають більші можливості просувати свій бренд або набирати аудиторію. І щоб кількість користувачів зростала, потрібно зробити дизайн групи ВК унікальним, незабутнім і приємним для очей вашого відвідувача або потенційного клієнта.

Якісно оформлений дизайн групи ВК допоможе не лише залучити більше народу, а й змусить повернутися до вас, щоби погортати стрічку новин. Якщо оформлення буде безладним: наприклад, аватарка одного стилю, обкладинка іншого, а зображення в постах оформлені не схоже ні на те, ні на інше, - досягти успіху буде важко. Пам'ятайте, що людину зустрічають по одязі - а групу з оформлення. Потрапивши до вас у групу, передплатник у першу чергу увагу на дизайн групи. Тому так важливо створити правильний дизайн групи ВК. Читайте також, як купити готову групу чи паблік ВК.

Як розробити дизайн групи ВК

Як розробити дизайн групи вк, якщо не знаєте, з чого почати? Розберемо за пунктами, як розробити та створити якісне оформлення групи вк:

1. Для початку визначтеся з тематикою вашої групи та цільовою аудиторією. Вам потрібно побачити готовий дизайн очима потенційного передплатника.
2. Вивчіть своїх конкурентів. Адже вони вже чимось привабили користувачів, вони вже пройшли цей етап. Вивчивши їхній контент, ви можете зрозуміти, що варто доопрацювати для покращення результатів.
3. Знайдіть свої сильні сторони залучення аудиторії. Наприклад, частота публікації постів, різноманітність тем, гумор, конкурси.
4. Тільки після того, як ви повністю визначилися з концепцією своєї групи, починайте створення дизайну. Найпильнішу увагу приділіть аватарці, обкладинці та оформленню постів у вашій групі.

Ці нескладні поради допоможуть вам створити яскраве та незабутнє оформлення групи. А тепер розглянемо конкретніше деталі оформлення групи. Про те, як вигадати назву групи ВК, читайте тут.

Аватар у дизайні групи ВК

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

Якщо ви хочете зробити простий аватар, наприклад, що містить тільки логотип компанії або бренду, можна створити зображення розміром 200х200 пікселів. Це мінімальний розмір аватара, який можна вибирати як мініатюру. Щоб не губилася якість, краще зробити аватар розміром 400х400 пікселів.

Щоб уникнути втрати деталізації зображення, робіть їх великих розмірів, але зберігайте співвідношення сторін 1:2,5. Наприклад, 200х500 чи 400х1000.

Яким має бути аватар? Давайте розберемо докладніше для початку якої має бути його мініатюра:

1. При створенні відразу зверніть увагу на розмір тексту, адже на мініатюрі він повинен бути добре читаємо – щоб користувач не шукав лупи, намагаючись прочитати, що там написано.
2. Уникайте обрізаного тексту. Буде краще, якщо на мініатюрі можна прочитати про що група і як вона називається.
3. Відразу вирішіть, що буде на мініатюрі. Зображення має бути зрозумілим та чіпляти користувача.
4. Для якіснішого дизайну та оформлення групи ВКонтакте краще придумати та створити своє зображення, а не шукати вже готове в інтернеті. Стоковий матеріал навряд чи викликає довіру або зацікавить користувача.
5. Для того, щоб виділитися з натовпу, потрібно створити яскраву мініатюру. Не робіть її надто нудною: людина при пошуку просто може пропустити вашу групу, якщо не помітить вашу аватарку.
6. Не завантажуйте мініатюру зайвими елементами. Один із варіантів – відтворити її в техніці мінімалізм. Зараз це модно, а вона виглядає більш привабливо.
7. Якщо ваше завдання – просто залучити користувачів до своєї групи, варто трохи пофантазувати та придумати у своїй аватарці щось незвичайне. Наприклад, зараз багато аватарів із піктограмою повідомлення. Начебто просто, а увагу привертає.

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

Обкладинка в оформленні групи ВК

Наступне, на що варто звернути увагу, - це обкладинка, яка знаходиться на самому початку сторінки. Її максимальний розмір – 1590х400 пікселів. Щоб вона була хорошої якості, так само, як і з аватаркою, слід зробити її більшого розміру, зберігаючи пропорції. ВКонтакте стисне її до потрібного розміру, але від цього не постраждає чіткість. Наприклад: 1590х400, 3180х800, 4770х1200.

Для того, щоб ваша обкладинка добре виглядала і на мобільних пристроях, її потрібно адаптувати. По ширині в мобільній версії показується все в межах 1196 пікселів, заввишки 317 пікселів.
Розмітка звичайної обкладинки та оптимальний розмір для мобільної версії:

По 197 пікселів з кожної зі сторін у мобільній версії просто не показується. Наступні 140 пікселів займають системні кнопки “Назад” та “Налаштування”. У 83 пікселях зверху знаходиться ваш оператор, кількість заряду, час та інше.

Це щодо розмірів. За змістом діють самі принципи, як і з вибором аватарки. Найкраще спрацює щось креативне та привертаючу увагу. Обкладинка має відповідати тематиці групи.

Зображення для посту у групі

Нещодавно ширина стрічки новин ВКонтакте стала фіксованою. Тобто ВК тепер не розтягує зображення і ви не втрачаєте деталі, які хочете показати користувачам. Мінімальний розмір зображення, який краще прикріплювати до посту – 510х510 пікселів, але бажано робити його вдвічі більше. Це потрібно, щоб якість і чіткість зображення не втратилися.

Квадратний розмір картинки повністю займає місце у стрічці, у той час як прямокутне зображення виглядатиме не так красиво і не буде належним чином привертати увагу. Деталі картинки в альбомній орієнтації виглядають дрібно, і користувач буде складно розглянути її. Для більшої зацікавленості інформацією в пості, найкраще робити квадратні зображення розміром 1020х1020, 1530х1530 та 2040х2040.

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

1. При збереженні у Фотошопі необхідно вибрати ЗБЕРІГТИ ДЛЯ WEB у форматі JPEG.

2. У налаштуваннях при збереженні знайти та поставити галочку навпроти пункту sRGB. Зберегти зображення.

Зображення для постів з посиланнями

Якщо у вас є сторонній сайт, то у групі ВК ви, швидше за все, викладатимете пости з посиланнями.
Коли ви вставите посилання в пост, воно відобразиться зображенням, в нижній частині якого буде коротка назва вмісту та адреса головної сторінки вашого сайту. Але, щоб зробити посилання привабливішим, потрібно подбати про його оформлення. У цьому немає нічого складного, якщо знати розмір зображення. Оптимальний розмір для анонсу вашої статті 537х240, але для кращої якості підійде 1074х480 або 1611х720.

Зображення для статті, написаної в редакторі

Якщо ви вирішили написати статтю в редакторі, потрібно зробити зображення, яке привабить користувача і змусить його відкрити та прочитати цю статтю. Підібравши зображення або вигадавши своє, потрібно знати його розміри. Мінімальний розмір 510х286 пікселів, але як завжди, краще робити зображення більше, щоб не втрачалася якість, як ми писали вище.

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

Обкладинка для фотоальбому

У вашій групі, швидше за все, буде кілька фотоальбомів, що містять зображення згідно з тематикою вашої групи. Щоб ваші альбоми виглядали красиво, краще вибрати для кожного з них своє зображення, що притягує погляд. Розмір обкладинки вашого фотоальбому буде 1200х800 пікселів. У цьому випадку його більше не можна робити, оскільки альбом відображається в маленькому форматі. Але в мобільній версії нижня частина обкладинки буде меншою на 200 пікселів. Враховуйте це під час створення зображення.

попередній перегляд для відео

Якщо ви вирішили прикріпити відео до посту у вашій групі, для цього потрібно зробити якісне зображення для прев'ю. Прев'ю має зацікавити користувача подивитися відео у вашій групі. Розмір зображення досить легко запам'ятати, в основному він дорівнює розміру відео. Тобто 1280х720 чи 1920х1080 пікселів.

Зображення для Вікі-сторінок

Не всю інформацію вдається передати на постах групи. Для цього можна використати Вікі сторінки. З її допомогою можна зробити гарне меню, яке виглядатиме як звичайне зображення, але при натисканні на будь-яку область відкриється потрібна сторінка. Також у ній більше функцій, яких немає у звичайних постах. Таким чином, ви можете якісніше донести передплатникам ту чи іншу інформацію.

Але оформлення вікі-сторінки також має свої нюанси. Робоча область становить 607 пікселів, і якщо ви завантажите зображення більшого розміру, ВКонтакте стисне її до розмірів 400 пікселів завширшки. Для того щоб змінити розмір зображення, потрібно просто натиснути на нього і ввести ширину - 607 пікселів. Висота зображення автоматично зміниться.

Тільки від вас залежить зацікавленість користувача до вашої групи. Гарно оформлені групи з якісним контентом завжди привертають увагу і дозволяють їх творцям добре заробити, тому не варто шкодувати час і сили на якісне оформлення. Не бійтеся почати, навіть якщо поки ви слабо знаєтеся на темі, спробуйте - і в процесі роботи ви самі побачите свої помилки і виправте їх.

Почати заробляти

Адміністраторам спільнот Вконтакті будуть корисні поради щодо оформлення групи, щоб залучити більше передплатників. При оформленні не забувайте, що в розпорядженні адміністратора є не тільки елементи дизайну (аватар або банер), але й безліч функціональних параметрів, які формують зовнішній вигляд групи.

Важливо!Постарайтеся виділити хоча б кілька годин і вивчіть усі параметри, доступні адміністратору спільноти. Повноцінне знання функціоналу обов'язково дасть свої плоди, і в майбутньому Ви зможете майстерно підлаштовуватися під нові тренди.

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

Порада стане корисною для тих, хто ще навіть не створив групу та вигадує назву. Хоча створені групи з невеликою кількістю передплатників можуть у будь-який момент змінити назву на панелі керування спільнотою в розділі «Основна інформація».

Коли перед засновником спільноти стоїть вибір назви, краще не поспішати. Є випадки, коли назва очевидна (ім'я компанії, назва заходу та інше), а для інших простір фантазії може відкрити нескінченну кількість варіантів. При складанні назви враховуйте важливі моменти:

Не закидайте наповнень контактної інформації та по можливості впишіть до неї максимальну кількість даних. Контактну інформацію можна умовно розділити на «Контакти» та «Посилання».

"Контакти" містять швидкі посилання на адміністрацію групи. В описі кожного контакту зазвичай прописують короткий опис члена адміністрації, тому не залишайте його поза увагою – зовнішній вигляд «Контактів» також впливає на загальне оформлення групи.

Візьміть на замітку!Ви можете створити спеціальну робочу сторінку користувача та додати його до списку контактів вашої групи. Назвіть його так само, як і групу, тоді він стане фірмовим талісманом групи, якому зможуть написати користувачі, щоб дізнатися про додаткову інформацію про групу або товари, що продаються в ній.

Рада підійде тим, у кого було створено не групу, а публічну сторінку, яка продає будь-які товари. Вконтакте можливе створення трьох видів спільнот: група, публічна сторінка та захід.

Три види спільнот - група, публічна сторінка та захід

Публічна сторінка має важливу особливість оформлення – зверху красується великий банер, що замінює аватар групи.

Подумайте про створення банера-трансформера, що оновлюється. Помістіть картинки свіжих товарів на такому банері, а потім змінюйте їх у редакторі зображень після кожної поставки. Це перше, що буде впадати у вічі відвідувачам і потенційно збільшить продажі.

Розробте шаблон для постів своєї групи. Найкрасивіше виглядають спільноти, в яких усі записи оформлені в єдиному стилі, який запам'ятовуватиметься учасникам під час прокручування стрічки новин.

На замітку!Прикріплюйте до записів зображення з логотипом своєї групи, сформуйте хитромудру сітку тегів. Можна навіть створити постійні рубрики у стилі «Новини тижня» або «Хвилина гумору».

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

Ця думка пронизує всю статтю, і для досягнення успіху можна запам'ятати лише її! У всьому намагайтеся дотримуватись єдиного дизайну. Це може стосуватися і стилю написання текстів, і оформлення зображень, і створення блоку з товарами групи.

Ось ще кілька порад зі створення краси в групі Вконтакте:

Відео — Дизайн групи Вконтакте

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

5 кроків, як оформити групу у Контакті

Обкладинка

Обкладинка спільноти сьогодні – важливий інструмент оформлення групи у Контакті бренду та її просування. Завантажити її можна у розділі ”Управління спільнотою”, перейшовши у вкладку “Налаштування”. Висококласне горизонтальне зображення у самій шапці спільноти відіграє роль головного промо-банера компанії в соцмережі. Вона ставить настрій, інформує, підвищує імідж, закликає до цільових дій, продає одночасно.

1. Використовуйте ілюстрації високої якості

Обкладинка спільноти вконтакті має бути розміром 1590х400 пікселів, але краще завантажувати фото в 2-3 рази більше у форматі.png. Так пощастить уникнути неякісного відображення.

2. Адаптуйте зображення під різні пристрої

Пам'ятайте, що це зображення може відображатися по-різному з різних пристроїв – на мобільних краях обрізатимуться, тому краще всю найважливішу інформацію розміщувати ближче до центру.

3. Розмістіть слоган та УТП

Нехай вашу філософію і переваги клієнт бачить з першого екрану.

4. Відобразіть товар/послугу, процес чи результат його використання

Так потенційний замовник одразу дізнається, на чому ви спеціалізуєтесь і буде залучено до продукту.

5. Допоможіть клієнтам одразу зв'язатися з вами

Напишіть на банер телефон, e-mail, а також інші контакти компанії. Якщо для вашого бізнесу важливе територіальне розташування, наприклад, ви представляєте сферу громадського харчування або horeca, адреса теж буде не зайвою.

6. Анонсуйте події

Просуваєте концерти, очікується надходження нової колекції або вихід продукту, проводите фестиваль/конференцію/клієнтський день? Розкажіть про це всім, хто заходить до спільноти.

7. Презентуйте акції та знижки

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

8. Пропонуйте вчинити цільову дію

При завантаженні обкладинки спільноти в нижньому правому куті розміщуються горизонтально дві кнопки – Написати повідомлення та Вступити до групи. Вкажіть стрілкою на них, щоб привернути увагу аудиторії. Так якщо на банері показаний товар – можна запропонувати одразу замовити його у повідомленнях. А якщо на ньому дайджест останніх новин – передплатити, щоб завжди отримувати свіжу інформацію.

Завантажте аватар і виберіть мініатюру

Окремі бренди досі не беруть на озброєння обкладинку, віддаючи перевагу старому вигляду першого екрану групи, застосовуючи як так звану “шапку” поєднання аватара із закріпленим записом. При цьому одна картинка є продовженням іншої. Найбільш ефектно при цьому виглядає, коли фото закінчується на одному рівні з аватаркою.

При використанні максимального розміру аватара 200х500 пікселів розмір картинки у закріпленому записі необхідно зробити розміром 510х308 пікселів. Відмінний прийом, що залучає, - закріплення завантаженого через плеєр соцмережі відео, яке стилістично продовжує аватар.

Якщо ж ви застосовуєте як шапку – обкладинку, аватар тоді завжди відображатиметься у вигляді мініатюри.

Правила оформлення ВК мініатюри аватара спільноти

Мініатюра – це невелике кругле зображення, яке кадрується з великого аватара, і відображається у пошуку по групах, у списку спільнот кожного користувача та зліва під обкладинкою, якщо така є. Ось кілька порад щодо її дизайну.

1. Мініатюра має бути зрозумілою аудиторії

Не варто розміщувати шматок дивної ілюстрації. Візуалізуйте те, що згодом ЦА асоціюватиметься з брендом, наприклад логотип, іконку товару/послуги, а може, головного маркетингового персонажа бренду.

2. Нехай у хід тільки якісні фотографії

Краще завантажити вихідник у 2-3 рази більше необхідного розміру, так про страшні піксельні "квадратики", які виставляють вас не в кращому світлі, можна буде забути.

3. Розробляйте власні ілюстрації

Стандартні стокові зображення виглядатимуть дешево та непрофесійно, а у користувачів стануть синонімом недовіри до бренду. Зробіть унікальні малюнки в єдиній концепції та кольорах, що решта дизайну.

4. Контрастні фону сторінки картинки – те, що потрібно

При оформленні ВК мініатюр так помітно, кругляшок виділиться в стрічці серед інших груп і не зіллється з фоном сторінки.

5. Розмістіть контакти або УТП компанії

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

6. Зробіть текст великим та читабельним

Краще не застосовувати шрифти із засічками чи курсив – вони надто “шумлять” під час перегляду з екранів ПК, мобільних пристроїв та смартфонів, засмічуючи вигляд. Простежте, щоб текст не виходив за межі кадрованої мініатюри. Це дозволить правильно та ефективно донести до користувача повідомлення.

7. Застосовуйте нестандартні форми

Наприклад, в круглий шаблон, що шукається, впишіть багатокутник або іншу геометричну фігуру на білому тлі. Створіть ефект непрочитаного повідомлення або графічну піктограму мережі.

Розробте меню

Меню – важливий елемент оформлення групи в Контакті, який полегшує навігацію користувачів по групі – людям зручніше знаходитиме потрібну їм інформацію. Кожен елемент та сторінка створюються спеціальною мовою програмування – Вікі-розміткою. За допомогою неї можна робити зображення клікабельними і верстати зручні сторінки всередині соцмережі так, якби це була сторінка сайту.

Можна використовувати як меню відкритого типу, і закритого. У першому випадку користувач відразу бачить розділи, які входять до нього, у другому – їм передує картинка прев'ю з написом “Меню”. Меню також може візуально стати продовженням аватара, якщо ви застосовуєте старий варіант оформлення спільноти.

Розробте вітрину товарів

Розміщуючи товари у вітрині спільноти, пам'ятайте, що користувачам завжди видно перші 3 об'єкти. Помістіть у них найпопулярніші та найзамовленіші, завантажуючи презентаційне зображення в єдиному стилі. Опублікуйте тут однакові іконки чи фотографії самих продуктів. У товари можна розмістити послуги. У дизайні покажіть процес надання послуги чи її результат. Розмір такого зображення буде квадратним - 400х400 пікселів.

Оформлення постів

1. Використовуйте доступні розміри зображень на повну силу

Максимальна ширина картинки у стрічці – 510 пікселів. Найбільш ефектно виглядають квадратні зображення 510х510 пікселів та прямокутні – 510х300 пікселів.

2. Розробте індивідуальний стиль постів

Щоб пости виглядали індивідуально, придумайте єдиний стиль, шрифт та кольорову гаму.

3. Розташуйте короткий текст на зображенні

Наприклад, можна розділити зображення на 2 частини – текстову та графічну або написати текст, затемнивши фон. Щоб текст було видно без затемненого фону, напишіть його на підкладці (контрастний графічний блок однорідного кольору) або додайте тінь до напису. Добре виглядають фотографії із рамкою.

4. Зробіть кілька шаблонів для різних цілей

Наприклад, для цитат застосовуйте один шаблон презентації візуальної інформації, анонсу матеріалів із сайту – інший, а конкурсів третій.

Використовуйте ці стовідсоткові прийоми, і ваша компанія буде представлена ​​Вконтакте якнайкраще, а клієнтам буде зручно взаємодіяти з нею. Але не забувайте, що в усьому потрібна міра! Перегляньте ще більше свіжих ідей для оформлення спільноти ВК на сторінці послуг агентства Тесла Таргет.

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

Здрастуйте, мої шановні читачі. Давайте сьогодні я розповім, як зробити гарне меню для групи ВКонтактета абсолютно безкоштовно. До речі навчившись створювати такі теми, можна трохи заробити на цьому -))). Вже жоден комерційний сайт не працює без створення своєї спільноти у соціальних мережах, особливо ВК, що гарантовано допомагає привести нових клієнтів, а також розкрутити свій бізнес.

Але якщо Ваша спільнота буде непривабливою і як у всіх, хто захоче там залишитися? Я думаю ніхто! Тож давайте прикрасимо свої групи якісним дизайном і навчимося робити це дуже швидко. Перед тим як почати створювати графіку та наше майбутнє меню необхідно встановити програму фотошоп на свій комп'ютер для подальшого нарізання картинок. Багато хто запитає, навіщо взагалі потрібно нарізати картинки. Тут справа в тому, що для кожного посилання меню ми повинні створити окрему смужку із загального банера.

Існує на сьогодні кілька видів меню, що створюється:

• Відкрите із активними пунктами;
• Закрите у вигляді закріпленого запису;
• З окремими картинками або загальною суміжною картинкою банера та меню.

Суть створення обох варіантів одна й та сама. Тільки основна відмінність у додаткових елементах та типах запису і про це докладніше буде у цій статті.

Для роботи з меню нам допоможе wiki-розмітка, яка вбудована сьогодні у текстовий редактор ВКонтакте. Від звичайного вона відрізняється тим, що для неї використовуватимуться стандартні команди для виведення тієї чи іншої картинки та вставки посилань на потрібні елементи. Сама wiki-розмітка дає можливість вставити код для відображення зображень, відео та інших елементів.

Закрите меню групи ВК

У даному випадку ми спостерігатимемо ліворуч від основної аватарки групи гіперпосилання у вигляді напису «меню групи» при натисканні на яке у нас буде відкриватися наше меню з активними пунктами та зображеннями.

Вигляд меню буде наступним:

Відкрите меню групи (закріплений матеріал)

Суть полягає у створенні вже відкритих пунктів меню, які відображатимуться в описі самої групи, де зазвичай і відображається за всіма умовами. В опис буде закріплено нашу картинку, яку ми підготуємо заздалегідь та зв'яжемо її зі сторінкою, на якій у нас будуть активні пункти. Дане меню стало дуже популярним останнім часом і користується попитом у замовників. Виглядає вони так:

Як зробити гарне меню для групи ВКонтакте: покрокова інструкція

Отже, в першу чергу нам необхідно буде створити головну аватарку групи, яку ми розмістимо праворуч і заглушку нашого меню у вигляді банера.

• Для аватарки 200х332 пікселя;
• Для основного банера меню 395х282 пікселі.

Як ви могли помітити висота зображень відрізняється і це зроблено для того, щоб картинки не з'їжджали по висоті і були на одному рівні так як висота назви спільноти та статус займають близько 50 px і саме цю величину нам необхідно буде прибрати з висоти меню.

Щоб було зрозуміло, якщо висота головної аватарки групи 332, то від неї віднімаємо 50 і отримуємо висоту основного меню рівну 282. Якщо ж розміри не мають значення, то висоту можна буде виставляти довільну.

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

Тепер займемося створенням загальної композиції. Можна звичайно просто вставити картинку замість аватарки і в опис, але не будемо дилетантами і покажу як зробити професійно, щоб це була одна повноцінна картинка, що переходить одна в іншу.

Створимо нове полотно у фотошопі розмірами 600х350 пікселів, яке ми будемо використовувати як трафарет, вирізавши в ньому отвори для наших картинок. Для роботи нам необхідно перевести розміри всіх елементів і лінійок у пікселі і робиться це наступним шляхом: «Редагувати-установка-основне» і тут уже виставляємо пікселі.

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

Використовуючи ліву кнопку миші, як ви виділяєте область, необхідно виділити блоки потрібних нам розмірів і після кожного виділення натискаємо кнопку видалити «Delete» і вибираємо 50% сірого. Такі дії призведуть до того, що блоки будуть потрібних розмірів і виділені кольором, відмінним від основного фону.

Повинно вийти таке:

А тепер просто вибираємо гумку і функцією «чарівний гумка» тиснемо на кожен сірий блок і отримаємо трафарет з вирізами. Наступним кроком ми вибираємо наше основне зображення і підкладаємо під фон і отримаємо готові картинки на який можна буде написати текст з назвою чи меню інші рекламні елементи.

Чудово. Після того як ви помістили картинку нашого дизайну, нам залишається вибрати «зберегти для Web» і на виході ми отримуємо 2 наші картинки. Тепер ідемо знову до нашої групи і можемо заливати головну аватарку (вертикальну). Банер для меню ми будемо використовувати трохи пізніше під час роботи з кодом wiki-розмітки.

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

Отже, переходимо знову у фотошоп і створюємо нове полотно з розмірами 400х300 пікселів. Після чого вибираємо у розділі: файл-помістити та вибираємо картинку для фону меню.

На малюнку розміщуємо кнопки нашого майбутнього меню і нарізаємо картинку як ми робили вище шляхом виділення потрібних блоків. Після цього також вибираємо «зберегти для web» і отримуємо папку з нашими нарізками. У моєму випадку вийшло 4 картинки в окремій папці.

Тепер нам необхідно завантажити з фотошопу картинки в окремий альбом і приховати від сторонніх очей. Після завантаження кожна картинка отримає свою нову назву та унікальний id.

Зверніть увагу, що у вас має бути:

• Відкриті матеріали як «обмежені»;
• Включено обговорення;
• Папка з фотографіями відкрита для всіх.

Тепер залишається налаштувати нашу сторінку де і відображатиметься на менюшка. Для цього переходимо на головну сторінку спільноти та обираємо свіжі матеріали та редагувати та називаємо «НАШЕ МЕНЮ».

Далі нам необхідно вставити картинки, які ми отримали при нарізці у фотошопі. Хтось використовує коди розмітки, але щоб не мудрувати голову пропоную просто вибрати вставку картинки натиснувши на іконку фотоапарата і по черзі завантажити один за одним.

Працюючи в текстовому редакторі якщо після завантаження картинок, ми натиснемо на іконку у вигляді дужок у правому верхньому кутку, то повинні побачити такий код:

Порада:Важливим моментом після завантаження зображень є видалення відступів. Вирішується це вставкою "nopadding" перед розмірами зображень.

Для пояснення нижче розписано, що звідки береться, але враховуючи, що все буде вставлено автоматично і не потрібно мудрувати, і відкривати як деякі пишуть кожну картинку і брати id, то просто завантажуємо та зберігаємо.

[]
де xxxxx - id вашої картинки
yyyyy – ширина в пікселях (не більше 388)

Повинно в результаті вийти ось так:

Наразі наші картинки зібрані в окремий банер. А для того, щоб додати кожному пункту посилання, просто натискаємо при відключеній розмітці на картинку і в розділі посилання вставляємо скопійований url.

І ось ми підійшли до найважливішого та останнього пункту створення нашого меню вконтакті. Тепер нам необхідно зберегти нашу сторінку з картинками та скопіювати її адресу. У моєму випадку він виглядає так:

https://vk.com/page-116682062_51411604?act=edit&hid=183950676§ion=edit

Пам'ятаєте ми на початку статті робили заглушку меню, яке буде продовженням нашої головної аватарки і під неї якраз і робили трафарет. Ось саме зараз нам і знадобиться.

Переходимо на головну сторінку і робимо таке:

Крок №1.

Вставляємо адресу станиці в текстове поле для нового запису на стіні, після чого вона перетворюється на посилання.

Крок №2.

До запису прикріплюємо зображення нашої заглушки для меню та натискаємо надіслати.

Крок №3.

Тепер після публікації запису натискаємо на час створення в нижній лівій частині запису та вибираємо "ЗАКРІПИТИ".

Чудово! На цьому закінчуємо. Тепер ви вмієте створювати класні меню та можете заробляти на цьому непогані гроші. Раджу все робити у такому порядку:

• Вигадуємо структуру та замовляємо дизайн зображень меню;
• Робимо припасування розмірів і нарізку всіх зображень;
• Вставляємо в альбоми картинки;
• Редагуємо у редакторі всі нарізки та публікуємо на головні сторінки групи.

В результаті роботи ми отримаємо таке меню.

А ось саме меню при натисканні воно вискакуватиме з активними посиланнями. Варто пограти з розмірами та підігнати під свій екран, але не забуваємо і про відображення у мобільних пристроях.

ВАЖЛИВО: Після зміни дизайну ВК у 2016 році внесено нові зміни при створенні зображень та вимоги до картинок про які.

Завантажити шаблон меню групи ВК + усі вихідники уроку

Сподіваюся, матеріал був корисний, і ви з легкістю тепер зрозуміли, як зробити гарне меню для групи ВКонтакте. Підписуйтесь на оновлення блогу та до швидких зустрічей у нових постах. Якщо залишилися питання, пишіть їх у коментарях, і я обов'язково допоможу Вам.

Прикладаю відеоролик для закріплення прочитаного -))).