Как верстать в Webflow? Стажировка в отдел креативной верстки в Redis.

[@rinatsirazetdinov7474]

Класс, спасибо ребята! Неужели кто то будет показывать как верстать нормальные макеты, а то на ютьюбе в основном макеты от которых глаз дёргается)

[@ЛомаченкоАртём-р1к]

Оооо, нашел чем заняться на зимних каникулах)

[@СашаГусева-п9ч]

Вы потрясающий учитель! Все супер понятно! Первое знакомство с вэбфлоу и без стресса. Спасибо!

[@yuriyzadorozhnyi3849]

Спасибо Вячеслав , очень интересно смотреть после изучения frontend , многое становится ясно теперь как все работает . Плюс еще и фигму изучим , очень познавательный канал .

[@anastasiapidgaina9319]

Вау, я в восторге. Буду ждать ещё таких видео!!!

[@Chihuahua-du5zx]

Отличная подача материала. Давайте ещё ребят!

[@user-io5.56]

Начинаю изучать Webflow, решил посмотреть ознакомительные видео. Благодарю, всё понятно.

[@Sergey2207]

как успехи?

[@askill2034]

Очень толково парень рассказывает

[@nickvectorart1201]

Очень качественное видео! Скажите ещё набираете людей?

[@elena.a.mosina]

Спасибо за видео! 😻

[@Lytvyniuk12]

Очень хорошие объяснения, спасибо!

[@НаталияКуликова-ф8э]

Отличное видео, одно из самых понятных гайдов по верстке в вебфлоу. Возник такой вопрос: я верно понимаю, что контейнеры используют в основном при верстке в пикселях, а при верстке в vw можно обойтись без них?

[@rediswebflow1005]

Да, все верно. Упрощают работу с обычной адаптивной версткой

[@artemkomar6686]

На самом деле хотелось бы увидеть полную разработку этого макета)

[@artemkomar6686]

Я понимаю, что тестовое - но всё же)

[@rediswebflow1005]

@@artemkomar6686 Когда расширим отдел и у нас появится время, то попробуем заняться обучающим контентом)

[@esilbek]

Вячеслав, очень классная обучающая лекция. У меня имеется только один вопросик, почему в этом примере были использованны только dif blocks, а не sections?

[@ОктавБегбедер]

Полезно, благодарю! Подскажите, а если верстка резиновая, как быть с ней на больших экранах? Вебсайт получается слишком широким. Добавлять “max-width” в VW на всех экранах? Если да, какая макс. ширина должна быть оптимальной?

[@rediswebflow1005]

В первую очередь стоит экономический вопрос поддержки UltraWide. Будет ли готов ваш клиент платить за время потраченное на гипотетических 0.01% пользователей. Также плотность пикселей у всех мониторов разная, и поэтому я могу поделиться только своими субъективными размышлениями. Я считаю в первую очередь все зависит от дизайна и задач сайта. Если сам дизайн содержит много текста, а дизайнер нарисовал и затестил на своем мониторе макет 1920, то он может быть хорошей основой и для широких разрешений. А если в дизайне не так много текста и много графики, то лучше максимальной точкой для растяжения сделать 2560, чтобы учесть мониторы 2к, которые уже достаточно распространены. А далее наращивать поля по бокам. Вопрос чтения основного текста (он должен быть самым удобочитаемым) можно решать новым правилом для текстового стиля на большие разрешения, например можно начиная с 1920 сделать основной текст пиксельным. Также если на высоких брейкпоинтах начать наращивать поля при резиновой верстке, то начнутся проблемы. Если все объекты сверстаны в VW, то при изменении ширины экрана и не меняющейся ширине основной обертки верстка поломается. Избежать этого помогут дополнительные правила для больших мониторов, либо верстка в %, EM и REM.

[@olgaperesunko1301]

@@rediswebflow1005 крутой ответ! Спасибо

[@voo-lee]

Отличный видос, большое спасибо! Если не сложно, объясните, так как нужно понимать html, css и js, не легче ли сразу верстать кодом? Вопрос только в скорость разработки упирается или что-то ещё?

[@rediswebflow1005]

Кажется в вебфлоу действительно быстрее кастомной разработки, но у неё есть ещё плюсы: - Примерно понятно как устроено для клиента или менеджеров (поменять текст в проекте сам клиент может). - Отличная оптимизация и СЕО. Я не знаю как внутри устроено, но результаты на Гугл спид тесте всегда удивляют)). Чтобы на разработке хорошо сайт оптимизировать для Гугл спид тест у разработчика должен быть опыт и время. Также и анимации: они, насколько я понимаю, создаются на ванильном JS и CSS без библиотек. Вот хоть миллион анимаций создай и они будут работать) - Очень удобно работать с анимациями. Это кажется самый лучший инструмент в вебе для CSS анимаций. - Чем проще среда для работы, тем проще придумать конструкцию в верстке или как реализовать анимацию. - В коробке с публикацией идёт CMS. Про неё узнать подробнее можно посмотрев видос на ютубе где мы выступали на трамплине про вебфлоу. Я там показываю как на проекте мы по-максимуму из неё выжали. - Довольно простая публикация и настройка редиректов. Не надо разворачивать сервер.

[@voo-lee]

@@rediswebflow1005 огромное спасибо за очень развёрнутый ответ! 🙌🏻

[@ttbatkovich]

@@rediswebflow1005 Добрый день! Дайте пожалуйста линк на видео с выступлением на трамплине по вебфлоу.

[@rediswebflow1005]

@@ttbatkovich kzbin.info/www/bejne/bajdgZWufs6Iarc

[@mikakhassenova8352]

В чем может быть глюк: header-image-line (для него задала позицию абсолют, как на видео) находится в диве header-image-container, для которого задана позиция релатив. При выравнивании по нижнему краю картинка сползает наверх и перекрывает кнопку. Делаю все по видео, по шагам, пробовала обновить страницу, все равно также.

[@alanbaskaev3907]

Вообще отличный видос. Один вопрос - в самом конце видно, что гамбургер появился на десктопе. Его нужно будет убрать точно так же, как убрали кнопки для мобилки или там как-то по-другому надо шаманить?

[@rediswebflow1005]

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

[@alanbaskaev3907]

@@rediswebflow1005 спасибо за ответ.

[@helenromanova1124]

хочу к тебе в отдел 🙏

[@glistvon-.359]

Приветствую. Набор н стажировку ещё планируется в будущем?

[@rediswebflow1005]

В будущем планируется, но не в ближайшее время)

[@АлександрМоторный-б5я]

Почему вы везде используете div, а не контейнеры и секции?

[@rediswebflow1005]

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