Создание сайтов

1) Введение в язык HTML. Понимаем внутреннюю организацию веб-страницы
‍
2) Оформляем текст средствами HTML
‍
3) Знакомимся с секционными элементами HTML5
‍
4) Изучаем базовый синтаксис CSS, селектор тега и основные правила для оформления текста

‍Результат: дети понимают роль CSS в веб-разработке, разделение ролей между HTML и CSS, умеют пользоваться правилами для оформления текста и цвета фона; понимают модель RGB, знают типы шрифтов и умеют подключать внешние шрифты из Google Fonts

1. Селекторы класса и идентификатора. Учимся применять CSS-правила точечно к конкретным элементам

2. Изучаем блочную модель элемента и рассматриваем ее составляющие

3. Учимся работать с расширенными настройками фона. Создаем простой эффект параллакс

4. Позиционирование элементов страницы

‍Результат: дети знают особенности типов позиционирования, понимают понятие поток документа, умеют применять разные типы позиционирования в зависимости от задачи

1. UX/UI. Введение в дизайн. Понимаем, что такое UX дизайн и как его нужно разрабатывать.

2. Основы прототипирования в Figma. Учимся использовать его базовые инструменты.
‍
3. Знакомство с законами UI, основанных на психологии человека. 
‍
4. Разработка первого профессионального макета
‍
Результат: дети учатся создавать структуру сайта, правильно организовывать пространство для макетирования, создавать модульную и колоночную сетку для экранов макетирования; ребята самостоятельно работают над макетом своей первой главной страницы.

1. Изучаем Flexbox и Grid позиционирование на основе блочной и модульной сетки.

2. Знакомимся с float, fixed, sticky и мультиколоночной версткой

3. Применяем фреймворки для быстрой и удобной верстки. Изучаем самый популярный фреймворк для верстки макетов Bootstrap.

4. Верстка первого проекта
‍
Результат: готовый проект на основе созданного в третьем модуле макета на выбранную тему. Ребята презентуют полученный результат и выкладывают в HUB.

1. Знакомимся с селекторами в CSS

2. Стилизация блоков в CSS. Осваиваем основные команды CSS для стилизации блоков.

3. Изучаем основные команды, отвечающие за эффекты в оформлении элементов в CSS.

4. Правила организации вашего CSS. Практическая работа

‍Результат: Дети научатся правильно писать CSS-документы, комментировать блоки. Ребята организуют работу со своим проектом. 

1. Принципы адаптивной верстки, медиазапросы. Адаптация сайта под разные экраны.

2. Анимация в CSS. Создание анимированных элементов. 

3. Препроцессор SASS, что это такое и зачем он нужен. 

4. Формы в языке HTML. Знакомство с тегом Form и элементами формы.
‍
Результат: дети научатся использовать свойства CSS для «резиновой» верстки, создадут несколько анимированных элементов и напишут CSS используя синтаксис SСSS.

1. Введение в JavaScript. Знакомство с библиотекой jQuery

2. Методы и условия в jQuery. Учимся использовать методы и условия в jQuery.

3. Эффекты анимации и события jQuery

4. Массивы и циклы в jQuery. Используем циклы для решения некоторых задач.

‍Результат: дети научатся пользоваться циклами и напишут программы, позволяющие обрабатывать информацию введенную пользователем.