Подробно и познавательно, подзабыл как делать чтобы на всех устройствах отображалось сразу нормально, пошел искать в прошлые уроки :)
@freelance-pro Жыл бұрын
рад что познавательно))
@user-lg1bh3cm6p7 ай бұрын
Спасибо за возможность учится.
@freelance-pro7 ай бұрын
Пожалуйста ☺️
@freelance-pro2 жыл бұрын
- Материалы с данного видео freelance-blog.webflow.io/course - Полезные штуки для webflow freelance-blog.com/webflow/ - Индивидуальное обучение freelance-blog.com/study/ Таймкоды: 00:00 Вступление и подготовка body 01:59 Добавляем и настраиваем hero section (секцию для первого экрана) 03:37 Добавляем контейнер (ограничитель контента по ширине) 04:50 Делим контейнер на две части (левую и правую) с помощью грида (Grid) 05:50 Добавляем див блоки внутрь ячеек грида, для размещения контента внутри них 06:19 Загружаем главную картинку 08:37 Добавляем "дизайна" для картинки (много разных популярных вариантов) 21:30 Делаем градиент для первого экрана (рассматриваем разные варианты) 29:24 Меняем главную иллюстрацию на альтернативную 30:53 Как в фотошоп вырезать картинку и сделать ее на прозрачном фоне 42:55 Загружаем картинку на прозрачном фоне (png) и пробуем разные варианты с ней 49:03 Темная версия главного экрана 51:17 Еще светлые варианты с png-шкой 59:32 Добавляем контент слева (заголовок H1) и стилизуем его 01:03:04 А теперь дополнительный параграф текста пойдет в ход)) 01:04:04 И пришло время кнопки 01:10:48 Центрируем контент в левой части hero section 01:15:36 Где искать больше информации? И как научится максимально быстро? 01:16:35 Подводим итоги проделанной работы
@AndreiKozlov-ph8wo7 ай бұрын
Закрепите коммент, пожалуйста.
@sergeyshmelev8350 Жыл бұрын
СПАСИБО БОЛЬШОЕ !! Всё понятно , всё "разжовано " до мелочей !! Супер !!!
Очень крутой ролик!Снято отлично, про контент даже говорить ничего не надо, он очень полезный.Огромное спасибо что делаете такие хорошие и полезные ролики!
@freelance-pro2 жыл бұрын
И вам спасибо огромное за поддержку! Рад что нравится, буду и дальше вас радовать!
@user-px5fe7lb9u11 ай бұрын
Спасибо большое за урок!
@freelance-pro11 ай бұрын
Пожалуйста ☺️
@elisabetromerosaavedra7572 жыл бұрын
Як завжди якicть 100%! Дякую!
@freelance-pro2 жыл бұрын
Будь-ласка 😉
@utilisateur_magnifique7 ай бұрын
НЕ розумію чому так мало переглядів? відео топ
@freelance-pro7 ай бұрын
Мало хто хоче заробляти гроші складним шляхом 😁 от і перегляди будуть високі завжди на розважальних відео
@antonfedotov6125 Жыл бұрын
Спасибо большое, очень круто! Хотелось бы ещё отдельный урок по типовым ситуациям когда нужно использовать margin, а когда - padding.
@freelance-pro Жыл бұрын
Так в прошлых роликах я эту тему раскрыл (прямо в этом курсе)
@victoriasssuslova3642 Жыл бұрын
Большое спасибо за урок!) Спасибо что делитесь своим опытом, для новичка в этой сфере это очень полезная инфо!
@freelance-pro Жыл бұрын
Пожалуйста ☺️ рад что инфо полезная
@miroed Жыл бұрын
@@freelance-pro Второй урок мучаюсь, не могу понять, где вы берёте ПИПЕТОЧКУ? Это расширение нужно ставить?
@freelance-pro Жыл бұрын
Да
@gooakk1784 Жыл бұрын
Комментарий благодарности для поднятия настроения и мотивации автора ❤️
@freelance-pro Жыл бұрын
Спасибо 😊
@serpmyf7 ай бұрын
Спасибо большое за видео!
@freelance-pro7 ай бұрын
Пожалуйста ☺️
@user-ce9mh7ij6o Жыл бұрын
Спасибо большое за ролики и что объясняете очень доступно. :) Уже хочеться быстрее изучить все видео и приступить к использованию данного инструмента в разработке. :)
@freelance-pro Жыл бұрын
Пожалуйста! 😊 ну что как у вас успехи? Изучили? Работаете?
@НикитаТигров-к8и9 ай бұрын
Благодарю, очень информативный урок!
@freelance-pro9 ай бұрын
Пожалуйста ☺️ рад что информативно
@anddrew5841 Жыл бұрын
как всегда супер подробно! спасибо!
@freelance-pro Жыл бұрын
Пожалуйста
@kalyabka_ Жыл бұрын
Спасибо! 🤍 мне очень помогают твои уроки
@freelance-pro Жыл бұрын
Пожалуйста! 😊 рад слышать
@pungushe2 жыл бұрын
Класс спасибо
@freelance-pro2 жыл бұрын
Пожалуйста 😉
@ВикторКузнецов-о1ь Жыл бұрын
Дмитрий, этому уроку больше подходит название "Варианты стилевого оформления Главного экрана сайта."..
@freelance-pro Жыл бұрын
Думаете такое название многие ищут в поиске? Я же пытаюсь подстраивать названия видео под поисковые запросы
@user-wn1jm4hp5k Жыл бұрын
Отличный урок!
@freelance-pro Жыл бұрын
Спасибо ☺️
@slimelanguage98792 жыл бұрын
Спасибо за полезный контент! Можете пожалуйста рассказать про cms в webflow? А то я не совсем понимаю когда есть смысл этим пользоваться)
@freelance-pro2 жыл бұрын
Если коротко то никогда, используйте вебфлоу как инструмент для дизайна где ещё и вёрстка в подарок, а дальше если нужна cms то узкоспециализированная и сделает это программист а не вы
@IvannaIv-cy6sj Жыл бұрын
thank you : )
@freelance-pro Жыл бұрын
🥳
@designckinet Жыл бұрын
Nice lesson like before!
@freelance-pro Жыл бұрын
👍👍👍
@vovastetsiuk91072 жыл бұрын
Как всегда хорошо, но не понял почему 5 и 6 урок об одном и том же))
@freelance-pro2 жыл бұрын
Что бы научить людей мыслить, а не слепо повторять за мной 😉
@ElenaMatesha2 ай бұрын
Заголовок-ударение на второе о, вы так много раз произнесли слово заголовок, я подсчитала, -это не главное. Вы молодец, спасибо за уроки! Совершенству нет предела🙂
@freelance-pro2 ай бұрын
У меня в стране ударение по другому 😜
@diplomatproАй бұрын
@@freelance-proЯ тоже заметила, но скромно промолчала. Спасибо, что могу вообще слушать и понимать ваши уроки.
@freelance-proАй бұрын
Пожалуйста 😊 я вот тоже считаю, что главное содержимое речи, а не произношение))
@UhaMap Жыл бұрын
Отлично!
@freelance-pro Жыл бұрын
Это хорошо))
@hot-short822 жыл бұрын
как в Webflow сделать строку поиска, чтобы левая сторона была в виде дропбокса, а правая в виде обычной строки поиска?
@freelance-pro2 жыл бұрын
Добавить див блок, внутрь него дропбокс и обычный инпут (это все внутри формы) и для див блока задаём флексбокс и горизонтальное позиционирование - готово!
@hot-short822 жыл бұрын
@@freelance-pro спасибо
@freelance-pro2 жыл бұрын
Пожалуйста 😉 обращайтесь
@tripgames45207 ай бұрын
Здравствуйте, очень нужна помощь, что делать если нa 7:54 не работает центрирование, я делал все точь-в-точь как у вас, однако этот Grid Child вообще не работает на моё изображение(разрешение исходной фотографии 920х716) P.s разобрался сам, оказывается всё дело в заданной ширине, в моем случае надо было вместе min Height поставить min Width) P.s.s вновь благодарю вас за такое прекрасное обучение, когда я начинал, я ничего не понимал, сейчас методом рассуждений могу распознать свою ошибку, поскольку в голове уже началось формирование правил и баз по webflow, так сказать понимание технической операции, без вас я бы ни за что так быстро не смог освоить webflow!
@freelance-pro7 ай бұрын
Пожалуйста ☺️ рад что все получилось
@-sanoletto-7395 Жыл бұрын
Привет, а як ти міряєш лінійкою? є якісь гарячі клавіші?
@freelance-pro Жыл бұрын
На мак команд шифт n на Винде джокси
@MrReactor11 Жыл бұрын
Странно, почему-то не работает анимация нажатой кнопки, при наведении работает, при нажатии нет, просто желтый цвет. Разобрался в следующем уроке это есть, тени должны быть либо inside либо outside.
@freelance-pro Жыл бұрын
Рад что разобрались!
@1eremeev447 Жыл бұрын
и снова круто, спасибо!)
@freelance-pro Жыл бұрын
Пожалуйста 😊
@user-rq9vb8xc1i Жыл бұрын
Спасибі
@freelance-pro Жыл бұрын
Будь-ласка))
@SvetlanaTonkich Жыл бұрын
Дмитрий, подскажите как лучше вписывать текст в картинку. У меня Картинка "мысли" png и я хочу туда вписать текст. Как сделать, что бы текст был в пределах этого овала картинки. Или как это можно сделать. Я Просмотрела пока 6 ваших уроков. Может это в следующих уроках есть?
@freelance-pro Жыл бұрын
Да есть, нужен див блок с позишин ридейтив внутрь ложим картинку и текст с позишин абсолют
@jevgenisuija9 ай бұрын
Спасибо автору за проделанную большую работу. Немного обратной связи, просмотрел уже около 8 часов материала, информация могла бы быть более структурированной. Часто отходишь от выбранной темы, начинаешь рассказывать о каких то других вариантах и потом снова меняешь тему / подход. Получается оч много информации за раз, перегрузка мозга. Это не критика, а просто предложение что могло бы быть лучше, ещё раз Спасибо!❤
@freelance-pro9 ай бұрын
Всегда может быть лучше, например на индивидуальном обучении 😉 ученикам другой подход
@user-ex8qj8bw2l5 ай бұрын
Привет, подскажите как запустить линейку которой автор измеряет расстояние между блоками?
@freelance-pro4 ай бұрын
Привет, комманд шифт 4 (одновременно нажать) если у вас не мак ос тогда сочувствую надо искать софт сторонний например Джокси скриншотилка как вариант
@alexsandrkhaladzhy6386 Жыл бұрын
Лайк за классное видео! Скажите, плиз, не помню на каком видео, пользовались "пиксельной рулеткой".. где ее можно скачать?
@freelance-pro Жыл бұрын
Джокси (скачать в Гугле) на Винде и команд шифт 4 на мак
@user-ce9mh7ij6o Жыл бұрын
Добрый день. А какую мышку вы используете к маку? Или у вас отдельный тачпад?..
@freelance-pro Жыл бұрын
Добрый день, использую стандартную маковскую мышку 3го поколения (самую новую) отдельный трекпад не так удобен мышка точнее трекпад хорош для монтажа видео разве что
@ОчирБембетов10 ай бұрын
подскажите пожалуйста!) в grid добавил div block , left и rights в rights добавил картинку , начинаю выравнивать по див блоку правому, а она ровняет по body
@freelance-pro10 ай бұрын
Она в абсолют а див блок в котором она находится не рилейтив, а должен быть 😉
@Aleshatyan6 ай бұрын
44:44 При изменении максимальной высоты нижняя часть картинки продолжает выступать за пределы hero section. У картинки абсолютное позиционирование по нижнему краю. На 44:44 нижняя часть картинки "обрезается" и не выступает за пределы. Дело в обновлении webflow или дело в размерах картинки? У меня её размеры 2761 на 3600 px. С чем это может быть связано?
@freelance-pro6 ай бұрын
Что бы картинка обращалась нужно задавать overflow hidden для элемента внутри которого она находится
@showreel20246 ай бұрын
COOL :)
@freelance-pro6 ай бұрын
Nice
@onandwon2 жыл бұрын
Благодарю, за видео! Подскажите, а Вы пипетку в Вебфлоу берете или какую то свою используете?
@freelance-pro2 жыл бұрын
Пожалуйста, гугловцы удалили пипетку от вебфлоу с магазина хрома, так что пока приходится пользоваться альтернативными вариантами, по запросу color picker можно найти много вариантов, я на маке пользуюсь софтиной color note к примеру.
@onandwon2 жыл бұрын
@@freelance-pro Я в самом Вебфлоу нашёл пипетку...
@freelance-pro2 жыл бұрын
Это отлично 👍 ее в новых аккаунтах просто нет, ну или может уже вернули это расширение))
@CLABA_CC Жыл бұрын
Питання, я додаю це коло, але воно у мене вилітає за фото, тобто зникає, що це може бути?
@freelance-pro Жыл бұрын
Позишн релейтив задайте для див блока в котором находится круг
@terekhova__l Жыл бұрын
Присоединяюсь ко всем комментариям - огромное спасибо за такой качественный бесплатный контент! Не на всех платных курсах так доходчиво объясняют материал, как здесь)) Буду очень благодарна если ответите на вопрос: есть ли возможность в вебфлоу какой-то нестандартной верстки (как можно сделать в фигме)? Типа дизайна с сайтов эвордс, где заголовки необычно большие к примеру и как-то креативно расположены, или все же есть определенные ограничения по верстке? Заранее спасибо))
@freelance-pro Жыл бұрын
Пожалуйста! 😊 рад что вам нравится! И да в вебфлоу можно делать любую нестандартную верстку, все как на эвардс можно сделать
@1974mura2 жыл бұрын
Не зАголовок, а заголОвок.
@freelance-pro2 жыл бұрын
Русский не мой родной язык 😛 говорю как мне удобно и не парюсь, не уроки грамматики))) это я к тому, что не на то внимание тратите
@virtuozfilm7936 ай бұрын
Спасибо, Дмитрий !!! Вопрос? где полное фото танцующий девушки, не обрезанное изображение. В приложенных секретных материалах не нашел.
@freelance-pro6 ай бұрын
Оно вам не нужно, делайте все на основе своих фото, что бы получился ваш сайт а не копия 1в1
@virtuozfilm7936 ай бұрын
Понял. Спасибо!
@freelance-pro6 ай бұрын
Пожалуйста ☺️
@procrastinator32199 ай бұрын
а где линеечку брать?)))
@freelance-pro9 ай бұрын
Command shift 4 одновременно нажать (это на маке) если виндовс то скачать скриншотилку джокси
@hot-short822 жыл бұрын
можешь рассказать, какие часто используются внутренние отступы между элементами? Например во внешних отступах ты используешь значения 80-100px. Есть ли что-то подобное и для внутренних отступов или это в основном на глаз делается?
@freelance-pro2 жыл бұрын
Внутренние да обычно все на глаз, что бы красиво было))) зависит от блока сайта и ситуации
@hot-short822 жыл бұрын
@@freelance-pro спасибо
@freelance-pro2 жыл бұрын
Пожалуйста 😉
@artimity11 ай бұрын
Кто-нибудь понимает, зачем нам секция если можно сделать див на боди? Или если переформулировать, можно ли вместо секции использовать див?
@freelance-pro11 ай бұрын
Да можно
@CLABA_CC Жыл бұрын
У мене іде тема Аніме😅
@freelance-pro Жыл бұрын
Теж круто))
@izhiend Жыл бұрын
Спасибо за видео, но как же режет ухо слово "зАголовок", это прям пытка какая-то😅
@freelance-pro Жыл бұрын
А как правильно?
@izhiend Жыл бұрын
@@freelance-pro заголо́вок, с ударением на вторую букву "о", как же ещё) Никогда в жизни не слышал, чтобы кто-то говорил за́головок😅