Верстка сайта с нуля до выгрузки на хостинг. Адаптивная верстка из Figma. Часть №2
Привет! Ну что, поверстаем?
В этом видео я начинаю верстать адаптивный сайт с нуля до выгрузки на хостинг. Мы вместе поэтапно пройдем все стадии верстки - разметим макет, напишем сетку, применим стили, сделаем адаптивную верстку, напишем js-код, а после загрузим все это на хостинг!
Данное видео предназначено для новичков, которые уже базово знакомы с тегами и стилями, но им не хватает понимания того, как же правильно верстать страницы. В этом я как раз и помогу. Используем только "чистые" языки - html, css, js (js-плагины), чтобы можно было просто сесть и верстать, не углубляясь в сборщики, препроцессоры и т.д. Ну и конечно, будем делать все pixel perfect.
И, как сейчас модно и удобно - используем для верстки крутой и удобный редактор - Figma.
Это вторая часть, делаем тут header сайта)
Макет в Figma: https://www.figma.com/file/6doFNNXepkzolMs4usZlL1/MaxGraph-Youtube-marathon-1.0?node-id=0%3A1
https://github.com/maxdenaro/maxgraph-youtube-source/tree/master/%D0%9C%D0%B0%D1%80%D0%B0%D1%84%D0%BE%D0%BD%20%D0%B2%D0%B5%D1%80%D1%81%D1%82%D0%BA%D0%B8%20%E2%84%961.%20Mitravel - исходники видео на GitHub
Меня зовут Максим Васянович. Фрилансер уже 5 лет, создал более 50 коммерческих сайтов. Преподаватель в онлайн-университете Skillbox, автор курса Веб-верстка.
Понравилось? https://clck.ru/Gr9Ec
Моя страница вконтакте: http://vk.com/maxdenaro
Моя группа по верстке сайтов: http://vk.com/maxgraph
Мой блог: http://blog.maxgraph.ru
Мой сайт: http://maxgraph.ru
Канал в телеграм: https://teleg.run/maxgraph
Чат для верстальщиков: https://teleg.run/maxgraph_chat
#обучение #марафонверстки #верстка
Видео Верстка сайта с нуля до выгрузки на хостинг. Адаптивная верстка из Figma. Часть №2 канала MaxGraph - cайты как страсть
В этом видео я начинаю верстать адаптивный сайт с нуля до выгрузки на хостинг. Мы вместе поэтапно пройдем все стадии верстки - разметим макет, напишем сетку, применим стили, сделаем адаптивную верстку, напишем js-код, а после загрузим все это на хостинг!
Данное видео предназначено для новичков, которые уже базово знакомы с тегами и стилями, но им не хватает понимания того, как же правильно верстать страницы. В этом я как раз и помогу. Используем только "чистые" языки - html, css, js (js-плагины), чтобы можно было просто сесть и верстать, не углубляясь в сборщики, препроцессоры и т.д. Ну и конечно, будем делать все pixel perfect.
И, как сейчас модно и удобно - используем для верстки крутой и удобный редактор - Figma.
Это вторая часть, делаем тут header сайта)
Макет в Figma: https://www.figma.com/file/6doFNNXepkzolMs4usZlL1/MaxGraph-Youtube-marathon-1.0?node-id=0%3A1
https://github.com/maxdenaro/maxgraph-youtube-source/tree/master/%D0%9C%D0%B0%D1%80%D0%B0%D1%84%D0%BE%D0%BD%20%D0%B2%D0%B5%D1%80%D1%81%D1%82%D0%BA%D0%B8%20%E2%84%961.%20Mitravel - исходники видео на GitHub
Меня зовут Максим Васянович. Фрилансер уже 5 лет, создал более 50 коммерческих сайтов. Преподаватель в онлайн-университете Skillbox, автор курса Веб-верстка.
Понравилось? https://clck.ru/Gr9Ec
Моя страница вконтакте: http://vk.com/maxdenaro
Моя группа по верстке сайтов: http://vk.com/maxgraph
Мой блог: http://blog.maxgraph.ru
Мой сайт: http://maxgraph.ru
Канал в телеграм: https://teleg.run/maxgraph
Чат для верстальщиков: https://teleg.run/maxgraph_chat
#обучение #марафонверстки #верстка
Видео Верстка сайта с нуля до выгрузки на хостинг. Адаптивная верстка из Figma. Часть №2 канала MaxGraph - cайты как страсть
Показать
Комментарии отсутствуют
Информация о видео
8 мая 2020 г. 20:00:12
00:29:07
Другие видео канала
![Верстка сайта с нуля до выгрузки на хостинг. Адаптивная верстка из Figma. Часть №3](https://i.ytimg.com/vi/fs4oN8ec9WE/default.jpg)
![](https://i.ytimg.com/vi/Js7Xyjud8F4/default.jpg)
![Адаптивная верстка сайта с нуля для новичков №8. Полезные советы по верстке сайта](https://i.ytimg.com/vi/uD4JEthM5P4/default.jpg)
![JS-решения №12. Базовая анимация при скролле на чистом JS](https://i.ytimg.com/vi/ol08qHSVUvw/default.jpg)
![](https://i.ytimg.com/vi/5HQdk7arl-U/default.jpg)
![Как я делал реальный заказ и сколько заработал | Фриланс, Дизайн, Верстка, CMS](https://i.ytimg.com/vi/YKxua0wkgD8/default.jpg)
![Адаптивный web-дизайн и Constraints (ограничители) в Фигма || Урок #6](https://i.ytimg.com/vi/RzBQ6srNjmU/default.jpg)
![Flexbox CSS3 в одном видео за 20 минут!](https://i.ytimg.com/vi/38bMnJ2l4bg/default.jpg)
![Верстка сайта с нуля до выгрузки на хостинг. Адаптивная верстка из Figma. Часть №1](https://i.ytimg.com/vi/JLWywZpAnMI/default.jpg)
![Адаптивный дизайн сайта в Figma [Уроки Веб дизайна]](https://i.ytimg.com/vi/jghijgFpFoE/default.jpg)
![Pure CSS Animated Wavy Background | CSS Animation Effects](https://i.ytimg.com/vi/l5PkvXb3LeU/default.jpg)
![Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS](https://i.ytimg.com/vi/f-irDQwt1l4/default.jpg)
![Адаптивная верстка сайта с нуля для новичков. Полезные советы по верстке сайта](https://i.ytimg.com/vi/D8DqoTjd_dg/default.jpg)
![✅ Верстка сайта с нуля для начинающих | HTML, CSS Flexbox & Grid, VS Code, Figma](https://i.ytimg.com/vi/orm8pLd80LU/default.jpg)
![#1 Верстка сайта с нуля для начинающих | HTML, CSS](https://i.ytimg.com/vi/ltMSrSis9ww/default.jpg)
![Верстка сайта с нуля до выгрузки на хостинг. Адаптивная верстка из Figma. Часть №6](https://i.ytimg.com/vi/WtfsH1DND6Y/default.jpg)
![Что лучше: Фигма или Фотошоп? Как сохранить копию макета (сделать дубликат) в Figma](https://i.ytimg.com/vi/Jz-ywNAa150/default.jpg)
![Адаптивная верстка. HTML для JS разработчиков](https://i.ytimg.com/vi/3xwdQPKaTb4/default.jpg)
![Как сделать дизайн сайта в Figma. Дизайн сайта в Фигме. Саня Кво](https://i.ytimg.com/vi/LisjTbEZW6g/default.jpg)
![#3 Фигма Figma — Подготовка макета к верстке и Zeplin](https://i.ytimg.com/vi/OgmqTESLCYk/default.jpg)