Направление 05 · визуальный конструктор · html · css · javascript

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

Для тех, кому важно, чтобы результатом можно было поделиться ссылкой. Сайт — самый «показываемый» артефакт: его открывают друзья, учителя и бабушка. Направление подходит и гуманитариям: здесь половина работы — смысл и красота, а не только код. Младшие начинают с визуального конструктора сайтов без кода (в аккаунте родителя по правилам сервиса), старшие — с HTML, CSS и первого JavaScript.

7–18 лет
Вход: с нуля
Занятия 1 на 1
Блоки по 8/16/24 занятия

Записаться на бесплатный урок

AI-иллюстрация направления «Создание сайтов»

Навыки и результат

Чему научится ребёнок

Вёрстка и стили

HTML, CSS и адаптив под телефон: сайт выглядит хорошо везде.

Веб-дизайн

Структура страницы, смысл и красота: сайт, который приятно открыть.

JavaScript и логика

Игровой цикл, события, корзина магазина — сайт оживает.

Публикация и работа по ТЗ

Хостинг, сдача проекта «заказчику» и защита работы.

Итог направления

4–5 опубликованных сайтов, включая работу «по ТЗ заказчика» и собственное портфолио, которое растёт вместе с учеником. Ученик понимает, как устроен любой сайт в интернете, и может собрать свой за выходные.

Примеры маршрутов

Как может выглядеть путь

Маршрут каждого ученика индивидуален: мы подбираем его на пробном уроке по возрасту, опыту и интересам. Два примера — для ориентира.

Маршрут для младших, 7–10 лет

Свой сайт в визуальном конструкторе (8) → Мой первый сайт (8) → далее по интересу

Далее по интересу: «Дизайн приложения в Figma» или переход в «Программирование».

Маршрут для старших, 12–16 лет

Сайт-портфолио (8) → Браузерная мини-игра (8) → Интернет-магазин (16) → Два сайта по ТЗ заказчика (16) → Фронтенд-разработчик: полный цикл (24)

Итог: учебное портфолио сайтов для конкурсов и олимпиад и опыт работы по ТЗ.

Как проходит занятие

Занятие длится 60 минут: короткое повторение, новая техника вёрстки или логики на сайте ученика, затем самостоятельная работа — преподаватель видит экран и помогает в реальном времени. Каждый блок заканчивается опубликованной ссылкой.

Модульная программа

Программа по блокам

Направление собирается из проектных блоков: каждый блок — 8, 16 или 24 занятия и готовый проект на выходе.

Блок «Свой сайт в визуальном конструкторе»

8 занятий Уровень 1 · с нуля 7–10 лет

Результат: Лендинг о любимом увлечении — собран в визуальном конструкторе (в аккаунте родителя по правилам сервиса) и опубликован в интернете.

Первый сайт без кода: в визуальном конструкторе сайтов ребёнок собирает страницу о том, что любит, — о питомце, любимой игре или своих рисунках. Структура блоков, шрифты, фотографии, кнопки — и публикация в интернете в аккаунте родителя по правилам сервиса: ссылку можно отправить бабушке. Код здесь не нужен — важен вкус и аккуратность.

Блок «Мой первый сайт»

8 занятий Уровень 1 · с нуля все возрасты

Результат: Сайт-страница на HTML и CSS о теме по выбору ребёнка — свёрстан с нуля и выложен на хостинг.

Переход от конструктора к настоящей вёрстке: HTML отвечает за содержимое, CSS — за красоту. Ребёнок пишет сайт с нуля — и понимает, как устроен каждый сайт в интернете. Финал — публикация на хостинге: страница доступна всему миру. После блока «сделать сайт» перестаёт казаться магией.

Блок «Сайт-портфолио»

8 занятий Уровень 1 · с нуля 11–18 лет

Результат: Опубликованный в интернете сайт-портфолио с проектами ребёнка — по ссылке могут пройти друзья и учителя.

Сайт, который растёт вместе с учеником: каждый новый блок обучения добавляет в портфолио проект. HTML, CSS, первый JavaScript, адаптив под телефон — и публикация в интернете. Со временем это станет живой витриной всех достижений. Ссылку на портфолио удобно прикладывать к олимпиадам и конкурсам.

Блок «Браузерная мини-игра»

8 занятий Уровень 2 · после первого блока 11–18 лет

Результат: Игра прямо в браузере: «змейка», арканоид или кликер — со счётом, звуками и таблицей рекордов; опубликована в интернете.

JavaScript перестаёт быть «языком кнопочек»: ребёнок пишет игровой цикл, обрабатывает столкновения и рисует на canvas. Счёт, уровни, звук, рекорды — и чемпионат среди друзей на финальном занятии. Игра открывается по ссылке на любом устройстве без установки.

Блок «Интернет-магазин»

16 занятий Уровень 2 · после первого блока 11–18 лет

Результат: Работающий интернет-магазин: каталог, карточки товаров, корзина и оформление заказа — опубликован в интернете.

Проект «как у взрослых» в двух частях. Сначала витрина: каталог, карточки, фильтры. Затем покупки: корзина на JavaScript, форма заказа и публикация. Ребёнок поймёт, как устроены все магазины, которыми пользуется его семья. Такой проект — сильный пункт учебного портфолио для конкурсов и олимпиад.

Блок «Два сайта по ТЗ заказчика»

16 занятий Уровень 2 · после первого блока 11–18 лет

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

Симуляция настоящей коммерческой работы. Часть первая — учимся читать ТЗ, задавать вопросы заказчику и верстать по макету. Часть вторая — два сайта «под ключ»: адаптив под мобильные, интерактив на JavaScript, рабочая форма обратной связи и публикация. Умение работать по ТЗ отличает разработчика от любителя.

Блок «Фронтенд-разработчик: полный цикл»

24 занятия Уровень 3 · продвинутый 11–18 лет

Результат: Три проекта для учебного портфолио: вёрстка по макету из Figma, интерактивное веб-приложение и финальный сайт с защитой.

Путь фронтенд-разработчика в трёх частях: вёрстка по настоящему макету из Figma, затем интерактивное веб-приложение на JavaScript, финал — большой проект по выбору ученика с публикацией и защитой. На выходе — учебное портфолио для конкурсов, олимпиад и дальнейшего роста. Логичное завершение направления «Создание сайтов».

Блоки можно комбинировать с другими направлениями — соберите маршрут на 48 занятий вместе с преподавателем на пробном занятии.

Взгляд изнутри

Так выглядит работа над проектом

AI-иллюстрация направления «Создание сайтов» — проект — **Результат.** Опубликованный сайт — ссылку открывают друзья и учителя.

AI-иллюстрация направления «Создание сайтов» — процесс — **Рабочий процесс.** Разметка, стили и отладка — так выглядит занятие по веб-разработке.

Стоимость

Сколько стоит обучение

Standart — 8 занятий/мес16 800 ₽2 100 ₽ за занятие

Deluxe — 8 занятий/мес20 000 ₽2 500 ₽ за занятие

Gold — 8 занятий/мес + командный проект25 000 ₽для подростков 13–18

Занятие — 60 минут один на один с преподавателем. Deluxe: всё из Standart, чат с преподавателем между занятиями и командная работа — участие в групповом проекте с другими учениками. Gold: участие в командном проекте учеников академии — в новом или уже идущем, в зависимости от успехов. При покупке в день пробного занятия — скидка 10% и бонус: бесплатная заморозка и перенос занятий. При оплате прямо на пробном — скидка 20%. Первое занятие бесплатно; возврат неиспользованных средств — по заявлению за 10 дней (оферта, п. 5.6–5.8).

Другие направления

Создание игр Подробнее → Программирование Подробнее → Моделирование и дизайн Подробнее → Тестирование Подробнее →

Первый шаг

Придумайте проект — мы доведём его до релиза

Занятие один на один с преподавателем: определим цель ребёнка, составим персональную дорожную карту проекта и честно скажем, сколько занятий это займёт.

Записаться на бесплатный урок

Без обязательств · консультация партнёра академии, а не продавца