Профессия «Верстальщик» — You Can Code
И да пребудет с тобой сила!
Профессии
Веб-разработчик Верстальщик Тестировщик
Полезноcти
Шпаргалка Flexbox CSS Шпаргалка Grid CSS Видео с практикой
Вход
Меню
Главная Профессии Верстальщик

Профессия
верстальщик

Создашь на практике 4 сайта и освоишь HTML/CSS, SCSS, Git, Github, Webpack, Figma, Photoshop
Начать обучение
Дата старта
4 июля 2022
Длительность
3 месяца
Подарок
Бонусные уроки
Базовый курс по верстке сайтов

Верстальщик — это специалист, который переводит макет, отрисованный дизайнерами в код.

Эта профессия даёт отличный старт в мир веб-разработки. У вас отроется возможность расти дальше, увеличивая уровень зарплаты. Например, стать frontend- или backend- разработчиком.

Что будет на курсе?

Видео-уроки
Записанные видео-уроки, на простом понятном языке, продолжительностью примерно 20–30 минут. Видеозаписи будут доступны в личном кабинете.
Практика
Вы на практике создадите с нуля 4 проекта, которые не стыдно будет показать заказчику или работодателю. Все работы будут проверяться кураторами.
Чат
Вам будет доступен чат во время обучения. Используй эту возможность, чтобы познакомиться со студентами текущего и предыдущих потоков.

Кому полезен этот курс?

Тем, кто готов обучаться с нуля, не боясь изменить свою жизнь на 100%, потому что вам откроется совершенно новый мир. Мир IT, который доступен каждому. Начинать лучше всего именно с верстки сайтов.
Тем, кто работает в иной digital-профессии, но хотел бы разобраться, как создаются сайты с нуля. Это пригодится, например, SMM-специалистам или маркетологам. Эти знания помогут общаться с разработчиками на одном  языке.
Тем, кто хотел бы начать зарабатывать в сфере IT. Начинать лучше с верстки сайтов, потому что освоить азы можно быстро и на этих знаниях заработать первую денежку. Главное не останавливаться.

Расписание

01

модуль

Вёрстка сайта «Бургерная» на HTML/CSS
  • Знакомимся с дизайном сайта
  • Создаем файлы и папки для сайта
  • Учимся создавать разметку
  • Улучшаем разметку для поисковых систем
  • Подключаем стили к разметке
  • Стилизуем текст и подключаем шрифты
  • Задаем отступы между блоками
  • Указываем имена для элементов
  • Расставляем элементы по сетке
  • Верстаем шапку сайта
  • Верстаем блок с фоном
  • Верстаем баннер сайта
  • Верстаем меню сайта
  • Верстаем подвал сайта
  • Стилизуем ссылки при наведении
  • Добавляем переходы между страницами
  • Добавляем переход на верх страницы
  • Адаптируем экраны под планшеты
  • Адаптируем экраны под мобильные
  • Публикуем страницу в Интернете
Дипломная работа:
Вёрстка сайта «Онлайн Тренировки» на HTML/CSS
02

модуль

Вёрстка сайта «Магазин здорового питания» на HTML/SCSS и Webpack
  • Знакомимся с дизайном сайта
  • Знакомимся с системой контроля версий
  • Устанавливаем Node и npm
  • Настраиваем сборку для проекта
  • Знакомимся с CSS-препроцессором
  • Учимся работать с вектором
  • Верстаем шапку сайта
  • Дорабатываем шапку сайта
  • Верстаем главный экран
  • Дорабатываем главный экран
  • Верстаем слайдер
  • Дорабатываем слайдер
  • Верстаем каталог
  • Верстаем форму
  • Верстаем подвал сайта
  • Знакомимся с трансформациями
  • Знакомимся с анимациями
  • Адаптируем сайт под планшет
  • Адаптируем сайт под мобильные
  • Оформляем проект и свой профиль
  • Делаем выпадающие окна
Дипломная работа:
Вёрстка сайта «Портфолио» на HTML/SCSS и Webpack
Бонусные уроки
  • Создание сайтов на конструкторе Tilda
  • Верстка страниц и уроков на GetCourse
  • Подключение Google и Yandex аналитики
  • Подключение Sitemap
  • Сопровождение и доработка проектов
  • Основы jQuery
  • (скоро появится) Основы работы с Wordpress

Обучение проходит на авторской платформе

Frontendblok education platform

Как проходит обучение?

Получаете доступ на учебную платформу You Can Code
Каждый день в 6 утра по мск открывается доступ к новому уроку
Просматриваете урок, в котором есть теория и практика
Выполняете домашнее задание для закрепления пройденного материала
Отправляете ДЗ куратору и выполняете его рекомендации
Получаете сертификат об окончании обучения: на русском и английском

Как можно зарабатывать на верстке сайтов, используя HTML/CSS?

Публиковать шаблоны
на продажу
Создав аккаунт на ThemeForest или TemplateMonster, ты сможешь продавать готовые шаблоны, обеспечив себе пассивный доход в долларах.
Сотрудничать
с веб-дизайнером
Заказчик, который обращается к веб-дизайнеру за макетом, вполне вероятно, нуждается в том, чтобы этот макет после сверстали. Такое сотрудничество создаст отличный тандем.
Искать заказчиков
на фрилансе
Под фрилансом можно понимать не только фриланс-биржи, но и соцсети. Начни вести экспертный блог и заказчики сами к тебе потянутся.

Общая информация по курсу

Формат уроков
Уроки заранее записаны и смонтированы так, чтобы не тратить ваше время и получать только качественную информацию без воды.
Длительность уроков
В среднем каждый урок длится 20–30 минут, но есть исключения, ролики по 60 минут. Всё зависит от сложности темы и демонстрируемой практики.
Домашние задания
Домашнее задание дается после каждого урока. Выполнение обязательно, потому что так вы сможете закрепить полученный материал. Также после каждого основного модуля вас ждут дипломные работы.
Конспекты
Кроме видео-материалов, вас ожидают на платформе конспект к урокам. Их удобно использовать, если в будущем захочется вспомнить материал, не просматривая заново ролик.

Учебные и дипломные проекты

Во время курса вы сверстаете 4 крутых сайта, которые не стыдно будет показать заказчику или работодателю, под руководством опытных кураторов
Пагинация
Предыдущий
Следующий
Учебный макет сайта «Бургерная» (Figma)

Сверстаем небольшую страницу за 20 уроков с использованием HTML и CSS, параллельно изучая основную теорию.
Дипломная работа по сайту «Онлайн тренировки» (Figma)

В конце обучения мы предоставим вам 2 недели на верстку этого макета, чтобы закрепить полученные навыки.
Учебный макет сайта «Магазин здорового питания» (PSD)

Сверстаем небольшой интернет-магазин за 20 уроков с использованием Webpack, HTML и CSS-препроцессора (SCSS).
Дипломная работа по сайту «Портфолио» (Figma)

В конце обучения мы предоставим вам 2 недели на верстку этого макета, чтобы закрепить полученные навыки.

Автор этого

Создатель сообщества Типичный Верстальщик
Более 6-ти лет в веб-разработке
Ведёт несколько соцсетей на тему веб-разработки
Основатель сервиса Frontend Help
Со-основатель учебного проекта YouCanCode
Anna Blok photo

Сколько стоит

Тариф «Основной»
Платформа с доступом ко всем видео и материалам
Чат с поддержкой и сообществом в Discord
Проверка работ от куратора
Закрытая база заказов и вакансий
Сертификат об окончании обучения
Подароок: бонусные уроки для прокачки навыков
59990 руб
Купить курс

Ваше резюме после обучения

Должность:
Верстальщик сайтов
Зарплата от:
50000 руб
Профессиональные навыки:
HTML5 и CSS3
Знание Figma b Photoshop для работы с макетами
Кроссбраузерная верстка
Адаптивная и отзывчивая верстка
Оптимизация под мобильные устройства
Оптимизация работы с изображениями
Умение разбираться в чужом коде
Понимание семантической верстки
Работа с Webpack
Умение работать с Git и Github
Умение работать с SCSS
Написание скриптов для популярных задач (карусель, попапы)

Отзывы о курсе

Кирилл Смирнов
Кирилл Смирнов
10 июня 2022
Короче говоря, курс очень прикольный, все структурировано. Во время изучения 2 модуля уже начала верстать работы для дипломных работ ребятам в колледже. Общение с ...
Дарья Середина
Дарья Середина
14 мая 2022
Благодарна Анне за качество подачи материала и структуру курса. Первый диплом заставит попотеть и позволил обрести веру в себя и свои возможности. Ценно! :)
Дмитрий Подорожных
Дмитрий Подорожных
06 апреля 2022
Курс понравился. Много интересных решений. Познакомился с webpack. Верстка по БЭМ. Получил более подробные знания по scss.
Александра Коржова
Александра Коржова
25 декабря 2021
Обучение очень понравилось. Материал объясняется легко, доступно, понятно. Все ошибки и недочёты в домашних заданиях разбираются при проверке. Огромный плюс ...
Пагинация
Предыдущий
Следующий

Оплатить курс


Ваше имя
Ваш телефон
Итого: 59 990 руб
Дата старта
4 июля 2020 года
Длительность
3 месяца
Дополнительно
Бонусные уроки
Технический английский и карьерное ориентирование

Часто задаваемые вопросы

Сколько по времени длятся уроки?
Развернуть
В среднем видео идут по 20-30 минут, но есть и более длительные - до 60-ти минут. Всё зависит от сложности темы и объема выполняемой практики.
Могу ли я посмотреть уроки в другой день?
Развернуть
Да, уроки не обязательно смотреть строго каждый день, но для системного обучения, лучше не пропускать уроки. В выходные уроков нет, поэтому можете использовать их, чтобы догнать пройденный материал за неделю.
Должен ли я знать что-то заранее?
Развернуть
Нет, это не обязательно. Мы обучаем всему с нуля.
Будут ли выдаваться сертификаты?
Развернуть
Да, сертификаты выдаются после сдачи дипломной работы в каждом модуле.
А у меня точно получится?
Развернуть
Наши учебные материалы расчитан на новичков без опыта в программировании. Мы специально создали максимально простые и понятные уроки, чтобы получилось у каждого! Но если вопросы будут возникать, то обязательно пишите их в чате, кураторы помогут вам.
Могу ли я использовать учебные работы в качестве портфолио?
Развернуть
Не только можно, но и нужно! 🙂
Закрыть
Кирилл Смирнов
Кирилл Смирнов
10 июня 2022
Короче говоря, курс очень прикольный, все структурировано. Во время изучения 2 модуля уже начала верстать работы для дипломных работ ребятам в колледже. Общение с кураторами и преподавателями дали мне возможность на месте исправлять свои недочеты в работах, фидбек - по фактам, с нормальным объяснением.
Закрыть
Александра Коржова
Александра Коржова
25 декабря 2021
Обучение очень понравилось. Материал объясняется легко, доступно, понятно. Все ошибки и недочёты в домашних заданиях разбираются при проверке. Огромный плюс - чат в дискорде, куда можно задать все интересующие вопросы касательно обучения/макетов/кода. Долго не могла поверить, что у меня получилось сделать учебный макет своими руками, что эту красивенькую, ровненькую страничку создала я. Осталось проверить свои знания на дипломной работе, а потом ещё больше прокачивать с:
Закрыть
Татьяна Пономарева
Татьяна Пономарева
24 мая 2022
Анна, если говорить в целом, то первые три урока не было ничего сложного, после пришлось подумать) Понравилось, что видео-уроки небольшие по продолжительности и есть и конспект урока (можно почитать, если неудобно слушать, например, наушники забыл или тем, кто предпочитает читать, а не слушать и смотреть). Много новых терминов, нужно проявлять внимательность и усидчивость. Объяснения понятные. Я уже смотрю 6 урок, и мне нравится преемственность: примеры те же, а смотрим на них уже глубже)). Была у вас на пробных занятиях для верстальщиков, и уже тогда поняла, что Вы, Анна, большой труженник, много работаете и делаете все по максимому. Спасибо Вам!