Web-программирование для детей —

Если бы не существовало HTML, то пользоваться интернетом было бы практически невозможно, так как все сайты так или иначе построены с использованием HTML. HTML — основа любого сайта в интернете.

Некоторые из тренеров участвуют в разработке нашей платформы для обучения детей, поддерживают и заполняют информацией сайт Айтигенио.

Интересные факты о направлении

На изучение направления на базовом уровне без дополнительных тем потребуется от 86 до 106 часов.

На углубленном уровне с дополнительными темами и собственными проектами - от 110 до 130 часов.

1. Введение в HTML (2-4 часа)

Учащиеся в этом разделе знакомятся с базовыми принципами и правилами работы с языком разметки HTML.

Выбор и установка текстового редактора.
Создание первого HTML-документа и его запуск в браузере.
Изучение тегов для форматирования текста на веб-страницах.
Основы редактирования текста в текстовом редакторе.
Синтаксис и распространённые ошибки.
Первый проект с использованием HTML.

2. Ссылки и изображения (8-10 часов)

Учащиеся знакомятся с особенностями добавления контента на свои веб-страницы, а также изучают особые приёмы работы со ссылками и изображениями.

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

Практические задания на использование ссылок и изображений на веб-страницах.

Дополнительные возможности при работе со ссылками.

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

Дополнительные возможности редактирования изображений для Windows и MacOS.

3. Таблицы (4-6 часов)

Учащиеся знакомятся со способами добавления таблиц на веб-страницы, а также оттачивают свои навыки на практических заданиях.

Основы работы с таблицами в HTML.

Группировка ячеек таблицы.

Упражнения для закрепления пройденного теоретического материала.

4. Основы CSS (12-14 часов)

Учащиеся знакомятся с языком для создания стилей CSS и учатся работать с его базовыми понятиями. В этом разделе ученик получает доступ к справочникам по основным CSS свойствам, а также создаёт такие глобальные проекты как:"Сайт кофейни", "Сайт компьютерных игр".

Знакомство с языком стилей CSS.

Способы подключения CSS к HTML и их взаимодействие.

CSS свойства для форматирования текста.

Основы блочной вёрстки веб-страниц.

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

Работа со шрифтами.

Применение полученных знаний при выполнении заданий "Проекты по теме".

5. Формы (8-10 часов)

Учащиеся знакомятся с таким понятием как "Форма на веб-странице". Учатся создавать поля для ввода данных, различные кнопки, "чекбоксы". Данные возможности языка HTML позволяют добавлять на веб-страницы поля для входа в аккаунт или регистрации.

Знакомство с формами.

Текстовые поля, выпадающие списки, важные атрибуты.

Стилизация форм с помощью CSS.

Практические задания на добавление форм.

Загрузка сайта на GitHub.

6. Продвинутый CSS (12-14 часов)

Учащиеся знакомятся с более сложными приёмами работы с языком CSS и изучают современные продвинутые способы стилизации веб-страниц. На этом этапе ученик создаёт большое количество как собственных проектов, так и проектов по заданному шаблону.

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

Резиновый фон и способ его создания.

Блочная верстка макета страницы.

Сложные селекторы в CSS.

Псевдоэлементы и их применение.

Правильное использование цветов при оформлении сайтов.

CSS переменные.

Медиазапросы.

Особенности создания горизонтального меню.

Создание галереи на CSS.

Разбор и исправление наиболее популярных ошибок.

7. Анимация (4-8 часов)

Учащиеся знакомятся с основными принципами создания анимации на веб-страницах. Также выполняются проекты по анимации изображений и текста на сайтах.

Основные понятия при работе с анимацией в CSS.

Анимация текста.

Анимация картинки с помощью псевдоэлементов.

Изучение CSS-переменных.

Проект Спиннер Pacman.

8. HTML5 (8-10 часов)

Учащиеся знакомятся с новыми возможности пятой версии HTML, а также учатся применять новые теги на веб-страницах с помощью практических заданий и проектов по теме.

Новые теги в HTML5.

Практические задания на применение тегов HTML5.

Проект по теме для закрепления полученных знаний.

Разбор и исправление наиболее популярных ошибок.

9. Флексбоксы (10-12 часов)

Данный блок посвящен технологии построения макетов для веб-страниц - Flexbox. Учащиеся изучают основы работы этой технологии, создают большое количество макетов и сайтов на основе Flexbox.

Как работает Flexbox.

Справочники и теоретический материал.

Практические задания для закрепления полученных знаний.

Анимированная фотогалерея.

Создание адаптивных сайтов.

Проекты по теме для создания портфолио и закрепления полученных знаний.

Разбор и исправление наиболее популярных ошибок.

10. Гриды(Grid System) (8-10 часов)

Учащиеся знакомятся с принципами построения макетов сайтов с помощью системы гридов.

Введение в гриды.

Теоретический материал по основам работы с Grid System.

Создание адаптивных сайтов с помощью Grid System.

Практические задания для закрепления полученных знаний.

Проекты по теме для создания портфолио.

Разбор и исправление наиболее популярных ошибок при работе с Grid System.

11. Bootstrap (4-6 часов)

Учащиеся знакомятся с библиотекой стилей Bootstrap и используют эти знания для построения стилей для сайтов.

Знакомство с Bootstrap.

Bootstrap и Grid System.

Практическое задание по построению сайта с помощью Bootstrap.

На изучение направления на базовом уровне без дополнительных тем потребуется от 50 до 80 часов.

На углубленном уровне с дополнительными темами - от 140 до 220 часов.

Модуль 1. Введение в JavaScript (2-6 часов)

Структура кода на JavaScritpt, понятие переменных, функции alert(), prompt(), confirm(), работа с консолью.

К концу изучения модуля ученик получит знания о базовой структуре языка программирования, научится создавать переменные, вводить их значения с клавиатуры, выводить их значения на экран и в консоль, а также получит понятие об использовании консоли браузера для отладки кода программы. Модуль 2. Переменные, операции, типы данных (8-14 часов)

Типы данных переменных, специальные значения, которые могут принимать переменные, преобразование типов. Математические операции в JavaScript. Сокращенные операции, инкремент и декремент.

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

Модуль 3. Условия (10-16 часов)

Конструкция if else. Операторы сравнения и логические операторы. Сокращенный синтаксис if else. Конструкция switch case. Сравнение данных разных типов.

После изучения этого модуля ученик сможет делать ветвления в программе, используя при этом условные операторы if else или switch case. Ученик поймет разницу между этими операторами и узнает особенности использования каждого из них. Научится решать задачи с ветвлениями, сделает несколько небольших простых игр, используя ветвления.

Модуль 4. Строки (4-8 часов)

Строки и операции над ними. Методы работы со строками.

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

Модуль 5. Циклы (14-20 часов)

Работа с различными видами циклических алгоритмических структур в JavaScript.

При изучении изучения этого модуля ученик познакомится с понятием цикла как такового, изучит выражения для создания циклов while, do while, for. Также он изучит особенности использования каждого вида циклов. Ученик научится решать задачи с использованием циклов, создаст несколько простых проектов с использованием циклов, а также сделает простейшую игру «Угадай число».

Модуль 6. Составные типы данных (18-24 часов)

Массивы, методы работы с массивами. Многомерные массивы. Объекты.

После изучения этого раздела ученик поймет, что такое составные типы данных, как использовать массивы для хранения больших объемов данных, как работать с ними. Он научится использовать циклы для перебора ячеек массива, а также научится применять все полученные знания на практике, решит несколько десятков задач для закрепления материала, создаст игру «Виселица». Кроме того, ученик познакомится с объектами в JavaScript и научится их создавать и манипулировать ими. Используя объекты, ученик создаст простейший каталог фильмов.

Модуль 7. Функции (12-18 часов)

Понятие функций в JavaScript. Параметры функций, инструкция return. Использование флагов в функциях, области видимости переменных.

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

Модуль 8. Работа с DOM (30-40 часов)

Понятие о DOM (Document Object Model), обращение к элементам веб-страницы, привязка и отвязка событий элемента. Работа с текстом тега, с текстовыми полями. Цепочки методов и свойств. Работа с группой элементов. Создание DOM элементов.

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

Модуль 9. Объектно-ориентированное программирование (6-12 часов)

Понятие класса и объекта класса. Создание собственных классов

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

Модуль 10. Canvas (30-38 часов)

Знакомство с canvas. Создание изображений на canvas. Создание двумерных анимаций и простых игр.

При изучении этого модуля ученик познакомится с тегом canvas, научится рисовать на нем простые изображения, а также создавать двухмерную анимацию. Для закрепления этого модуля, а также модуля 9, ученик создаст несколько игр, где применит знания классов, объектов и работы с canvas.

Модуль 11. Модули (10-16 часов)

Создание больших модульных проектов.

После изучения этого модуля ученик научится структурировать свой код, разбивать его на отдельные части – модули. Также он научится подключать и использовать эти модули для создания сложных проектов.

Модуль 12. jQuery (20-26 часов)

Работа с фреймворком jQuery.

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