Оформляем сообщество в новом дизайне ВК

Molodoy

Регистрация
25.07.16
Сообщения
10
Симпатии
0
#1
С момента перевода всех на новый дизайн, многие так и не смогли разобраться, какие же размеры для картинок при оформлении сообщества наиболее оптимальны. Так что сегодня мы будем разбираться и делать для Вас своеобразный гайд, который будет полезен как для администраторов сообществ, так и для тех, кто арбитражит в ВК. Итак, поехали.




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



При клике на аватар с размером 200х500px всё тоже было как-то грустно:



"Надо масштабировать!", -- подумал я и просто увеличил картинки вдвое. В этот раз получилось очень даже прилично:



Аватар 400х1000px уже смотрелся совершенно по-другому:


Где-то проскакивала инфа, что ВК рекомендует ширину картинки 1280px, поэтому я решил попробовать максимально приблизиться к этому значению. Умножив исходный размер на 2.5 я получил ширину 1275px и не прогадал, т.к. картинка стала открываться на максимум. Это именно то, что я пытался найти!


Аватар 500х1250px ничем не отличался от прошлого варианта. Однако именно такой размер надо использовать, если мы работаем по сетке и делаем слитные закреп и аватар.



Вот только есть один косяк в новом дизайне -- это щель между меню и аватаром. И не просто щель, а дыра. Дырииииище. С этим, к сожалению, ничего не поделать.




2. Закидываем в самый верх слой с готовым дизайном, либо пилим дизайн внутри шаблона;
3. Когда всё готово, удаляем слой "основа" и жмём ctrl+shift+e (склеиваем все слои)
4. Жмём букву М (включает инструмент "прямоугольное выделение") и выделяем нужный нам участок по сетке:



5. Жмём ctrl+c (скопировать выделенный участок), ctrl+n (создать новое изображение (там уже сразу будет предложен размер скопированного участка, поэтому не запариваемся и жмём enter)), ctrl+v (вставляем скопированный фрагмент), ctrl+alt+shift+s(сохранить для Web) и выставляем значения из принтскрина (в дальнейшем это делать не придется, т.к. эти параметры будут предлагаться "по умолчанию"):



6. Теперь проделываем те же самые махинации с аватаром:


Готово! Вы превосходны





В-третьих, жмём "добавить фото" и НЕ загружаем его, а просто перетаскиваем в это окошко:



С загрузкой аватара делаем тоже самое:



Я не знаю, какого ёжика нужно делать именно так, но этот способ рекомендует техподдержка вконтакте.

P.S. Шаблон встанет ровно в том случае, если в паблике есть какой-то статус. Без него съедет вёрстка.
Юзайте горячие клавиши, которые я использую в статье. Всего за день можно это дело довести до автоматизма, а время экономят и облегчают жизнь эти штуки очень даже заметно.


Как бы не было грустно, но на сегодня всё.