developedbyed.com
Учись быть креативным! Узнайте захватывающие технологии от веб-разработки, дизайна, разработки игр и многое другое!
Творческий курс по HTML5 и CSS3
The Creative HTML5 & CSS3 Course
★4.8 (всего оценок - 82)
Продолжительность
13 ч 2 мин
Категория
HTMLКоличество уроков
70 Видео
Дата добавления
1 февр. 2020 г., 17:58
Язык
Английский
Дата обновления
29 апр. 2026 г., 06:30
Творческий курс по HTML5 и CSS3 — это практическое обучение, где вы шаг за шагом создадите три ярких, полностью адаптивных и анимированных сайта. Курс подходит начинающим и тем, кто хочет вывести свои навыки веб-разработки на новый уровень.
Что представляет собой этот творческий курс
Обучение построено на сочетании теории и практики. Каждый модуль сопровождается созданием реальных элементов интерфейса, а завершается полноценным проектом. Благодаря этому вы не просто изучите теги и свойства, а поймете, как применять их в реальных задачах.
Кому подойдет обучение
Курс разработан так, чтобы быть одинаково полезным новичкам и тем, кто уже знаком с HTML и CSS.
- Начинающие получат четкую структуру, понятные объяснения и уверенный старт в веб-разработке.
- Опытные студенты улучшат навыки создания дизайна, анимаций и адаптивной верстки.
Чему вы научитесь
Вы разберете фундаментальные технологии фронтенда и научитесь создавать современные, быстрые и доступные сайты.
Основные темы курса
- HTML5 и семантическая разметка
- CSS3 и современные возможности стилизации
- Адаптивная и мобильная верстка
- Анимации и динамичные интерфейсы
- Работа с изображениями, SVG и оптимизацией
- Flexbox и CSS Grid для построения макета
- SASS для эффективной организации стилей
- Основы доступности
- Техники оптимизации и финальное развертывание проекта
Практические проекты
За время курса вы создадите три полноценных сайта, каждый из которых поможет закрепить определенный набор навыков.
Проект 1: Базовый адаптивный сайт
Вы научитесь семантической разметке, базовым стилям и адаптивности. Этот проект станет вашим надежным фундаментом.
Проект 2: Креативный сайт с анимациями
Создадите визуально насыщенный сайт с плавной анимацией, переходами и эффектами для интерактивных элементов.
Проект 3: Полноценный лендинг с продвинутыми технологиями
Используя Flexbox, Grid и препроцессор SASS, вы разработаете современный лендинг с оптимизацией и финальным развертыванием.
Преимущества этого курса
Вы получите практические навыки, которые сможете сразу применять в работе или собственных проектах.
Почему учащиеся выбирают этот курс
- Простые и понятные объяснения сложных тем
- Фокус на практике и создании реальных сайтов
- Структурированный контент и логичное повышение сложности
- Примеры кода, шаблоны и полезные материалы
Результат прохождения курса
По завершении курса вы сможете:
- уверенно верстать сайты на HTML5 и CSS3;
- использовать Flexbox, Grid и SASS в реальных проектах;
- создавать анимации и интерактивные элементы;
- делать быстрые, адаптивные и удобные сайты;
- испытывать уверенность в своих фронтенд‑навыках.
Готовы начать путь в веб‑разработку? Этот творческий курс поможет вам освоить современные инструменты и создать впечатляющие проекты с нуля.
- Урок 1.00:00:57Welcome To The Course!
- Урок 2.00:01:44Setting Up VS Code
- Урок 3.00:02:47Installing Extensions
- Урок 4.00:04:16Creating a HTML Tag
- Урок 5.00:04:24Basic Layout
- Урок 6.00:12:59Meta Tags
- Урок 7.00:07:01h and p Tags
- Урок 8.00:07:11Images and Video
- Урок 9.00:05:13a Tags
- Урок 10.00:16:49Forms
- Урок 11.00:04:05Lists
- Урок 12.00:02:26Comments
- Урок 13.00:03:14Tables
- Урок 14.00:05:33Classes and ID's
- Урок 15.00:16:01HTML5 Semantics
- Урок 16.00:03:18HTML5 Entities
- Урок 17.00:00:28Let's Learn CSS
- Урок 18.00:03:57How To Use CSS3
- Урок 19.00:05:20Basic Syntax
- Урок 20.00:15:31Selectors
- Урок 21.00:07:42Specificity
- Урок 22.00:08:05Padding and Margin
- Урок 23.00:08:33Box Model
- Урок 24.00:13:37Pixels, rem, em
- Урок 25.00:07:03Styling a Button
- Урок 26.00:07:23Display Types
- Урок 27.00:17:48Positions
- Урок 28.00:05:56Pseudo Elements and Classes
- Урок 29.00:33:52Mini Project - How to not create layouts (optional)
- Урок 30.00:10:27Media Queries
- Урок 31.00:12:12VH and VW
- Урок 32.00:27:04Flexbox Basics
- Урок 33.00:28:39Let's Practice Flexbox
- Урок 34.00:01:22Before We Start Our Projects
- Урок 35.00:12:56Setting Things Up
- Урок 36.00:38:22Creating Our Nav&Hero
- Урок 37.00:42:44Creating the City Section
- Урок 38.00:20:07Card Section
- Урок 39.00:14:45Form Section
- Урок 40.00:05:33Submitting Forms
- Урок 41.00:03:31Semantics
- Урок 42.00:04:16Contrast
- Урок 43.00:04:15Keyboard
- Урок 44.00:04:57Text
- Урок 45.00:06:20Labels and Alt
- Урок 46.00:19:31CSS Grid Basics
- Урок 47.00:06:24CSS Grid vs Flexbox
- Урок 48.00:14:37Setup
- Урок 49.00:02:28Adding Fonts
- Урок 50.00:28:42First Page
- Урок 51.00:10:40Plant Animation
- Урок 52.00:22:43Burger Animation
- Урок 53.00:03:19Fixing Small Issues
- Урок 54.00:17:48About Section
- Урок 55.00:17:35Image Gallery
- Урок 56.00:26:18Contact Page
- Урок 57.00:15:46Javascript Functionality
- Урок 58.00:24:24Basics of SASS
- Урок 59.00:01:24Let's Learn a Magic Trick
- Урок 60.00:12:02Portfolio Setup
- Урок 61.00:09:02Getting SVGs and Icons
- Урок 62.00:21:26Creating the Nav and Section
- Урок 63.00:08:38Animating SVGs
- Урок 64.00:11:44Mobile Friendly
- Урок 65.00:11:32Project Page
- Урок 66.00:14:29Finish Line
- Урок 67.00:04:12Optimizing Images
- Урок 68.00:01:54Optimizing HTML and CSS
- Урок 69.00:04:45Deployment
- Урок 70.00:00:48The End
Автор - developedbyed.com
Комментарии
ordepFinished this great course, thank you CH.
akkiAdmin can you please add https://developedbyed.com/p/the-creative-react-and-redux-course , thanks :)