Размеры для группы ВК-2024: от обложки до постов
Первые шаблоны для ВК групп я выпустила в конце 2022-го. Шаблоны пережили сотни правок и «примерок», прежде чем превратились в красивый и удобный продукт.
Самой сложной задачей оказалось – разобраться с размерами. Например, обложки для ВК групп в 2021, 2022 и 2023 годах имеют разные параметры. При этом, даже на официальных площадках часто висят устаревшие данные.
Пытаясь докопаться до истины, я прошла все стадии отчаяния :) И вот, когда мне казалось, что все позади, в 2024 году ВКонтакте опять начал менять дизайн 🤦♀️
Новые размеры для группы ВК в 2024 году
Размер обложки группы ВК
Главная обложка сообщества ВК, которая показывается на всех устройствах. Другие названия: шапка, компьютерная или десктопная обложка.
Актуальный размер в 2024 году – 1920x768px.
Поддерживаемые форматы – PNG и JPG.
Статичную обложку видят посетители вашей группы, когда заходят с компьютера. С телефона её видно в двух случаях:
- Если вы не установили мобильную обложку
- Когда вы разворачиваете экран телефона горизонтально
Особенности
В полной версии сайта верх обложки обрезается на 128px. Эта часть скрыта на компьютере и видна только на мобильных устройствах. Видимость эта относительная, потому что здесь располагаются иконки ВК группы и вашего телефона. Учитывайте это при создании обложки, чтобы в данной зоне не было стратегически важной информации.
Размеры мобильной обложки ВК-2024
Мобильная или живая обложка видна только с телефона. В качестве обложки может быть изображение и/или видео (до 5 штук). При просмотре они будут автоматически листаться друг за другом.
Общий размер живой обложки – 1920×1080 px.
Формат изображений: PNG и JPG.
Формат видео: MP4; видеокодек h.264; до 20МB; до 30сек.
Особенности
Когда человек заходит в группу ВК, он видит только часть обложки. Чтобы развернуть целиком, нужно кликнуть на неё. Но т.к. многие этого не делают, ориентироваться надо на видимую часть.
Какую? Вот тут и начинает квест :)
Мне встречалось масса схем, где всё было расписано буквально по пикселям, но они разбивались об одно «но» – из-за пропорций экрана на разных телефонах обложки выглядят по-разному.
Вот реальные скриншоты с двух телефонов (обратите внимание на разницу в положении фото и текста):
Далее я прилагаю схему, которая родилась у меня в процессе проб и ошибок. На истину не претендую, но у меня работает.
Вы ещё не убежали? Тогда продолжим :)
• 285px сверху и снизу – области, которая скрыты на всех телефонах.
• Самые непредсказуемые области – участки сверху и снизу, где находятся иконки телефона, название группы, кнопки и прочее. Они могут съедать от 220 до 330px. В этой зоне можно расположить картинки, сюда может заходить какая-то «безопасная» часть вашей фотографии, но текст лучше убрать.
• Самая надежная часть для контента, хорошо просматриваемая со всех телефонов – область, которая находится посередине обложки и составляет 690-700 px. Здесь можно смело размещать текст (не забудьте только про аватар).
• Да, и помним, что по бокам 100-115px могут обрезаться.
Если после сказанного выше у вас пропало всякое желание делать мобильную обложку, прекрасно вас понимаю )))
Размер обложки меню ВК
После того, как ВКонтакте изменил дизайн групп и многие информационные блоки были убраны с видных мест, меню приобрело стратегически важное значение. Если хотите, чтобы группа стала продающей, удобной и интуитивно понятной, без привлекательного меню не обойтись.
Размер обложки для меню ВК группы: 376x256px. Поддерживаемые форматы изображений: PNG, JPG, GIF.
Что важно учитывать при оформлении:
- количество обложек в меню – максимум 7 шт.
- видно из них три с половиной, остальное нужно листать
- если вы размещаете текст, он должен быть достаточно крупным, т.к. плашки меню небольшого размера
- установить обложки меню пока можно только с компьютера
Карточки товаров и услуг
Рекомендуемый размер обложки: 1000×1000 px. Можно взять больше, главное, чтобы изображение было квадратное. Для одного товара вы можете загрузить до 5 изображений. Формат JPG, GIF или PNG.
Обложка для подборки товаров ВК
Как товары, так и услуги в ВК можно объединить в подборки.
Размер обложки для подборки товаров: 1280х720px.
В мобильной версии обложка будет обрезаться. Видимая часть: 1060×720px
Размеры картинок для постов ВК
ВКонтакте для оформления постов в приоритете два формата изображений:
- квадратные 1:1
- прямоугольные 3:2
Квадратные 1:1
Минимальный размер квадратного изображения 510х510 px, но практика показывает, что качество картинки такого размера получается низкое. Хотите получить четкое изображение – используйте бóльший размер. Например, как у баннеров для товаров ВК – 1000х1000 px.
Прямоугольные 3:2
Если вы выбираете прямоугольное изображение, его размер должен быть минимум 510х765 px. Я рекомендую увеличивать этот размер вдвое и больше. Так вы получите картинку гораздо лучшего качества.
Что лучше: прямоугольное или квадратное изображение?
Я предпочитаю квадратные картинки для постов в ВК. Они более заметные, особенно когда листаешь ленту с телефона. Из них получаются идеальные «галереи», где все баннеры отображаются целиком, ничего не выпадает и не обрезается. Примеры такого оформления ↓↓↓
Размер обложки для видео в ВК
Размер обложки (или заставки) для видео ВКонтакте:
- Минимальный – 1280х720 px
- Рекомендуемый – 1920х1080 px
Рекомендуемые размеры самой видеозаписи имеют те же параметры. Если вам важно сохранить качество видео, загружайте записи размером не менее 1920×1080 рх. Максимальный объем файла – 5 ГБ.
Истории ВК: размеры фото и видео
Истории в ВК (кому-то привычнее сторис) имеют те же параметры, что и в других соцсетях, поэтому вы смело можете публиковать одну и ту же историю на всех площадках. Традиционно используются фото и видео вертикального формата.
Размер для фотографий — 1080х1920 px.
Форматы: PNG, JPG, GIF.
Размер видео:
- Минимальный – 720х1280 px
- Рекомендуемый – 1080х1920 px
Технические характеристики для видео:
- объем файла до 10 МБ
- длительность до 15 секунд
- видеокодек h.264
- аудиокодек AAC
Кстати, у меня на сайте есть подборка из 105 фото и видео фонов для сторис, которые можно скачать бесплатно!
Размер обложки для статьи ВК-2024
В 2024 году ВК изменил обложки статей. Если раньше центральную часть обложки занимали заголовок статьи, название сообщества и кнопка «Читать», то теперь всё выглядит как на картинке ниже: кнопка «Читать статью» переехала под изображение, а текст и название сообщества (или имя автора) расположилось в левом нижнем углу.
Рекомендаций по новым размерам я не нашла, могу уверенно сказать только за пропорции – 4:2. Например, 800х400px.
*Дизайн обложек автоматически изменился и у старых статей (как можно заметить, статья на баннере 2022 года) ↓
Размер обложки для внешней ссылки (сниппета)
Что такое сниппет? Когда вы добавляете к записи ВК ссылку на внешний ресурс, появляется специальный блок – сниппет. Он состоит из текста и картинки (оба они кликабельны).
Если вы НЕ добавляете к посту ВК никаких видео и изображений, сниппет будет отображаться в полную величину (смотри баннер ниже). Картинка подбирается по умолчанию из тех, что есть на ресурсе, куда ведет ссылка, но вы можете задать свою.
Размер обложки для сниппета – 537х240 рх. Чтобы получить более качественное изображение, рекомендуется увеличить размер вдвое.
P.S. Как я уже говорила ранее, статья регулярно обновляется. Если что-то существенно меняется в дизайне ВК, я переделываю шаблоны ВК и бесплатно рассылаю свежую версию всем ранее купившим. А куда деваться?!
P.P.S. Чтобы посмотреть все готовые шаблоны, приглашаю вас в свой уютный «Магазин шаблонов»
© Оксана Колесникова
Еще больше интересных статей:
- Как найти свои способы продвижения творческому предпринимателю
- Лучшие банки бесплатных фотографий
- Как правильно оформить чек-лист, гайд или PDF книгу
- Бесплатные дизайнерские шрифты: кириллица, попавшая в тренды
Спасибо)) Очень нужная информация!!
Спасибо большое за информацию, очень рада что нашла ваш ресурс на пинтерест)))
Красивый и четкий сайт. Салютую и жму руку!
Благодарность от всего сердца 🙏🤍🌷
Оксана, здравствуйте!🌸 Хочу тоже выразить вам огромную благодарность за такую подробную и четкую подачу материала.
Оооочень ценная информация, благодарю вас еще раз! 🙏🙏🙏
Ирина, благодарю :)
это лайк!
Действительно потрясающий материал и сайт и работы! Оксана, огромное человеческое спасибо Вам за такой анализ! Попросили сделать страничку и я вижу как в некоторых группах располагают карточки товаров(подборки), но не могу понять КАК эти карточки так загрузить! Нигде нет такой информации. И с размерами — беда… После Вашей статьи хоть это стало понятно)))… Подскажите пожалуйста, в каких опциях ВК можно грузить таким образом, как на скрине или другим (как у Вас в примерах) образом эти карточки…
Татьяна, здравствуйте! Все ответы на технические вопросы, как и что загрузить в группе, я нахожу в самом ВК. Откройте ВК Видео, введите вопрос в строке поиска и вуаля… :)
Вертикальные баннеры — это скорее всего приветственный виджет, его надо отдельно устанавливать в группу. Инструкцию можно найти тем же способом.
Какой потрясающий материал! Оксана, благодарю Вас за Ваш труд и щедрость) Собрали все нужное в одном месте, понятно объяснили еще и как красиво оформили, БРАВО)
Людмила, спасибо за такую высокую оценку! :)
Спасибо, Оксана! Благодаря таким, как вы, есть чёткая и актуальная информация для адаптивного макета, собранная вместе на одной странице. Понятно, доходчиво.
Ещё раз спасибо!
Екатерина, спасибо за добрые слова :)
Очень и очень большое человеческое спасибо! Хоть что-то стало понятно))) А то уже нервов не хватает на эти размеры!
Оххх, нервов и правда не хватает ))) Анна, рада, что немного помогла разобраться…
Оксана, большое Вам спасибо, очень выручили! Замечательная статья и крутое оформление.
Дарья, большое пожалуйста )))
Вопрос по обложке к альбому фото? Сделала по шаблону с интернета 1200х800, в моб версии пишут 200 снизу скроется — ок. Макет готов. Мне заказчица присылает вообще квадратные картинки, где ниче не влезло? Нужно два формата делать прямоугольные и квадрат?? Каике размеры нужно сделать на обложки альбомов, чтобы везде все норм было????
Елена, если разберусь с этим вопросом, дополню статью. Пока я сталкиваюсь с таким же несоответствием.