логотип PurpleSchool
логотип PurpleSchool
FrontendMobile

HTML и CSS - полный курс по вёрстке с нуля

Изучите все особенности HTML5 и CSS3, чтобы создавать современные адаптивные сайты на flexbox и CSS Grid

Обновлено 12 апреля 2025 г.
ЗвездаЗвездаЗвездаЗвезда
Рейтинг 4.9на основании отзывов
Иконка аватараИконка аватараИконка аватараИконка аватараИконка аватара
1,274ученика
изображение курса
кнопка запустить видеоО курсе
Цена от:3 999 ₽6 990 ₽
При покупке до 05.07.2025
Гарантия возврата денег — 30 дней
Неограниченный доступ
Сертификат об окончании
Знания

Чему вы научитесь?

После прохождения курса вы сможете:
Верстать адаптивные сайты на HTML и CSS
Знать сематическую вёрстку и особенности HTML5
Проверять доступность и работать со Screen Reader
Верстать формы и таблицы
Работать с Figma макетами
Понимать каскад и специфичность стилей
Понимать работу потока документа и блочную модель
Создавать анимацию
Работать с различными layout
Верстать на CSS Flexbox
Верстать на CSS Grid
Custom property и расчёты в CSS

Минимальные требования: Не требуются ни какие знания по программированию

211уроковвидео с конспектами
19 упражненийдля закрепления на практике
79 тестовдля проверки знаний
Технологии
HTMLCSSБЭМHTML5FigmaFlexboxCSS GridSMACSSCustom Properties
О курсе

Что в курсе?

В этом курсе мы изучим всё об HTML и CSS и сверстаем несколько посадочных страниц и отдельных компонент сайта. Он подойдёт тем, кто только хочет погрузиться в веб разработку и создавать свои сайты или полноценные приложения. HTML и CSS является базой перед переходом к JavaScript и фреймворкам типа React, Angular или Vue, поэтому от вас не потребуется вообще никаких знаний.

Так же он подойдёт тем, кто уже пишет веб приложения, но хочет структурировать свои знания по вёрстке и почерпнуть техники работы с flex и grid. Все эти знания мы применим на вёрстке реальной страницы сайта PurpleSchool, сравнивая различные подходы к вёрстке.

Лекции содержат как теоретическую часть, так и live-code, где мы вместе будем писать код, разбираю особенности работы HTML и CSS. В конце каждого модуля вас ожидает тест. Этот курс направлен на практику, потому в курсе сделан упор на большое число упражнений, которые позволит закрепить знания.

certificate
Ваш сертификат по окончанию курса
Возможности обучения

Обучение в PurpleSchool

Собственная платформа

Интеграция с GitHub

Интеграция с GitHub

Все проекты для домашних заданий проверяются напрямую из GitHub

Поддержка всех устройств

Поддержка всех устройств

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

Подсветка синтаксиса

Подсветка синтаксиса

Не теряйтесь в коде, пользуйтесь привычным форматированием синтаксиса

Проверенные форматы

Мини-лекции

Мини-лекции

Короткие видео (по ~5 минут) позволяют обучаться даже тогда, когда времени на полноценное обучение не хватает

Упражнения

Упражнения

Выполняйте задачи, а затем сравнивайте с верным процессом решения в видео для самопроверки

Конспекты

Конспекты

Каждая лекция сопровождается детальными конспектами для удобного поиска информации

Домашние задания

Домашние задания

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

Тесты

Тесты

Закрепляйте знания и находите слабые места с помощью точечных тестов по темам курса

Тщательно следим за актуальностью технологий и регулярно обновляем курсы

AI и тренажёры

Livecode-тренажёр

Livecode-тренажёр

Решайте мини-задачи по темам курса и получайте мгновенный разбор ошибок в коде от AI-наставника

Mock-тренажёр

Mock-тренажёр

Практикуйтесь в прохождении собеседований и находите ошибки, которые мешают пройти на нужную вакансию

Проверка домашних заданий

Проверка домашних заданий

Отправляйте Pull Request наставнику и получайте детальный разбор с учётом лучших практик

AI-наставник обучен на реальных проектах, практике студентов, официальной документации и материалах курса

Реальная практика в студии

Проектная команда

Проектная команда

Подключитесь в коллектив и пройдёте проект плечом к плечу

Рекомендательное письмо

Рекомендательное письмо

В случае успешной стажировки получите индивидуальное рекомендательное письмо от основателя студии PurpleCode

Реальные задачи

Реальные задачи

Реализуете действующий функционал, а не задачки из учебников

Еженедельное планирование

Еженедельное планирование

Освоите практики Agile, научитесь декомпозировать задачи, оценивать сроки, анализировать ретроспективу

Практикующие разработчики и HR

Проверка домашних заданий

Проверка домашних заданий

Получайте детальную обратную связь от разработчиков из ведущих компаний

Консультации 1 на 1

Консультации 1 на 1

Разбирайтесь с трудностями и вопросами на личных консультациях

Проверка резюме и мок

Проверка резюме и мок

Повышайте софтскиллы и проходите на вакансии выше уровнем

Гарантия: если в течение 30 дней после покупки поймёте, что курс не нравится и не прошли более 50% курса — вернём деньги без лишних вопросов.

Модули курса

План курса

Курс построен таким образом, чтобы доносить материал от простого к сложному. Ниже вы можете ознакомиться с планом курса и посмотреть часть открытых лекций по кнопке проигрывателя.

кнопка запустить видеоПример лекции
Цена от: 3 999 ₽ 6 990 ₽
Иконка календаряПри покупке до 05 июля 2025
Монетки
300 бонусных рублей за регистрацию
О проектах

Что будем писать?

Самостоятельный

Каталог курсов

Каталог курсов

Каталог курсов по аналогии с сайтом школы и формой контактов

Наставник и практика

Приложение для планирования встреч

Приложение для планирования встреч

Сайт сравнения товаров и услуг, с личным кабинетом, народным рейтингом и рецензиями.

О PurpleSchool

Наши проекты

Антон Ларичев

Антон Ларичев

Основатель PurpleCode, школы обучения разработки PurpleSchool. 14 лет опыта разработки, более 10 лет управления ИТ проектами и интернет маркетинга.

PurpleSchool

Школа PurpleSchool

Направления
30 000

учеников по всему миру

30 дней

гарантия возврата денег

90%

студентов рекомендуют курсы

4.8Kursly
ЗвездаЗвездаЗвездаЗвездаЗвезда
4.8Stepik
ЗвездаЗвездаЗвездаЗвездаЗвезда
4.7Udemy
ЗвездаЗвездаЗвездаЗвездаЗвезда

Студия PurpleCode

Направления
50+

проектов за последний год

15

лет опыта

7

команд разработки

Практика в PurpleCode

1
Собеседуем выбранных участников
2
Прошедших отбор берём на оплачиваемую стажировку
3
После 3-х месяцев успешной стажировку - оффер
Цена от: 3 999 ₽ 6 990 ₽
Иконка календаряПри покупке до 05 июля 2025
Монетки
300 бонусных рублей за регистрацию
Под ваши потребности

Тарифы

Иконка курсаГарантия возврата - 30 дней
Иконка курсаСкидки до 05.07.2025
Иконка курсаДоступ - Неограниченно
Начните бесплатно3 первых модуля курса

Самостоятельный

Цена:3 999 ₽6 990 ₽
  • ГалочкаУроки и упражнения
  • КрестикДомашние задания
  • КрестикAi-тренажеры
  • КрестикПоддержка наставника
  • КрестикПрактика в студии
  • ГалочкаГарантия возврата
Премиум

AI и тренажёры

Цена:4 999 ₽8 990 ₽
2 платежа: 2 499,5 ₽/мес
  • ГалочкаУроки и упражнения
  • ГалочкаДомашние задания
  • ГалочкаAi-тренажеры
  • КрестикПоддержка наставника
  • КрестикПрактика в студии
  • ГалочкаГарантия возврата

Наставник и практика

Цена:12 999 ₽20 000 ₽
3 платежа: 4 333 ₽/мес
  • ГалочкаУроки и упражнения
  • ГалочкаДомашние задания
  • ГалочкаAi-тренажеры
  • ГалочкаПоддержка наставника
  • ГалочкаПрактика в студии
  • ГалочкаГарантия возврата
иконка часов4д : 8ч : 39м : 10с

Сравнение тарифов

Самостоятельный
Премиум
AI и тренажёры
Наставник и практика
Обучение
Уроки
check
check
check
Упражнения
check
check
check
Тесты
check
check
check
Сертификат
check
check
check
AI и задания
Домашние задания
check
check
check
Ответы на вопросы 24/7 от AI-наставника
check
check
check
Livecode-занятия с AI-наставником
check
check
check
Mock-собеседования c AI-наставником
check
check
check
Проверка домашних заданий
check
check
check
Менторы
Онлайн-сессия «Вопрос-ответ» с менторами - 1 раз в неделю
check
check
check
Прямой чат с менторами команды PurpleSchool
check
check
check
Практика
Длительность практики - 2 нед.
check
check
check
Погружение в Agile процессы
check
check
check
Командная работа над реальным проектом
check
check
check
Ревью от опытных наставников
check
check
check
Прямой чат с автором
check
check
check
Гарантии
Гарантия возврата денег без объяснения причин — 30 дней
check
check
check
Условия действуют
иконка часов4д : 8ч : 39м : 10с
3 999 ₽6 990 ₽
4 999 ₽8 990 ₽
12 999 ₽20 000 ₽
О тарифе

Тариф с командным проектом

  • Реальный проект

    Вы будете работать вместе с командой на реальным проектом

  • Практика

    2 недели интенсивной практики и погружения в процессы разработки

  • Наставничество

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

  • Командная работа

    Вы научитесь синхронизироваться с командой и совместно реализовывать сложные фичи

  • Практика Agile

    Вы будете работать по Scrum и познакомитесь с Agile процессами

team project
  1. 1

    Планируем спринт

    1 раз в неделю мы проводим звонок и планируем спринт, декомпозируем задачи и начинаем работать над итерацией.

  2. 2

    Синхронизируемся

    Каждый день мы синхронизуемся в чате, а наставники помогают с задачами и отвечают на вопросы.

  3. 3

    Выполняем задачи

    Работая по GitFlow вы выполняете задачи и отправляете их на ревью. Код ревью проводят наставники, которые проверяют качество кода и дают рекомендации.

  4. 4

    Проводим ретроспективу

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

Для вас подготовлены дополнительные материалы
  • additional material

    Макеты для вёрстки и создания компонент

  • additional material

    Техническое задание на итерацию от ProductOwner

  • additional material

    Процессы по работе в команде и код ревью

Цена от: 3 999 ₽ 6 990 ₽
Иконка календаряПри покупке до 05 июля 2025
Монетки
300 бонусных рублей за регистрацию
Команда курса

Автор и наставники

фото команды
Автор курса

Антон Ларичев

Основатель PurpleSchool

Основатель PurpleSchool и ex-CTO. Занимаюсь разработкой уже более 14 лет и имею большой опыт: JavaScript, TypeScript, Php, Go, C#, Swift и Python. Активно внедряю гибкие методологии разработки в компании и внутренние обучения для команд.

фото команды
Наставник

Алексей Черепанов

Руководитель отдела разработки

В IT сфере более 10 лет. Основной стек MySQL, JavaScript, NodeJS, Express.js. Около 5 лет занимаюсь системными интеграциями, внедрением и развитием веб-сервисов, автоматизацией процессов. Люблю задачи, которые заставляют развиваться и хорошенько подумать, после решения которых приходит эйфория.

фото команды
Наставник

Левитин Никита

Старший Frontend разработчик Билайн

Занимаюсь разработкой больше 5 лет. Начинал с продавца в магазине одежды, смотря на перерыве уроки по фронтенду. Основной стек React, Vue, TypeScript. Разрабатываю дизайн-системы и микрофронты. Люблю сложные задачи после которых сложно сдержать крик радости.

фото команды
Наставник

Денис Уткин

Senior Frontend Engineer at IBS

Знаю как технологии работают под капотом. Люблю чистый строго типизированный код и функциональное программирование. В свободное время изучаю искусственный интеллект. Стек: React, Typescript и все что с ним связано

фото команды
Наставник

Сергей Краснолобов

Фронтенд инженер в Авито

В разработке около 5 лет. Полностью самоучка, основные знания получил из разного рода книг, статей и документации. Считаю, что главные качества хорошего разработчика - это упорство и трудолюбие! В своем подходе к обучению ребят я стараюсь дать возможность найти ответы самому, изредка слегка направляя куда копать

Что говорят наши ученики

Отзывы

Отзывы не модерируются и не редактируются. Отзыв можно оставить поле прохождения половины курса.

Изучи направление Фронтенд разработчик

Благодаря направлению вы сможете последовательно изучить все аспекты Frontend разработки под руководством опытного наставника, добавить множество проектов в портфолио и получить практический опыт разработки.

12
12 месяцевдлительность направления
11
11 проектовдля портфолио
1 на 1
занятияс наставником
Этот курс является частью направления Мобильный разработчик

Благодаря направлению вы сможете последовательно изучить все аспекты Mobile разработки под руководством опытного наставника, добавить множество проектов в портфолио и получить практический опыт разработки.

12
12 месяцевдлительность направления
11
11 проектовдля портфолио
1 на 1
занятияс наставником
Цена от: 3 999 ₽ 6 990 ₽
Иконка календаряПри покупке до 05 июля 2025
Монетки
300 бонусных рублей за регистрацию

Карта развития разработчика

Получите полную карту развития разработчика по всем направлениям: frontend, backend, devops, mobile

Курсы с наставником и без

Для компаний

Все курсы доступны для приобретения для сотрудиков компаний по безналичному расчёту. Процесс получения доступа очень простой, нужен только ваш ИНН и число сотрудников.

Свяжитесь со мнойЧерез форму ниже или по почтеcontact@purpleschool.ru
Оплата счётаВы оплачиваете счёт на нужное число мест и курсов
СтартНа email сотрудников открывается доступ
Наши курсы выбирают:
Остались вопросы?

Частые вопросы

Курс построен таким образом, чтобы доносить материал от простого к сложному. Ниже вы можете ознакомиться с планом курса и посмотреть часть открытых лекций по кнопке проигрывателя.

Остались вопросы? Их можно задать в чате Telegram.