КСП «Создание мини-сайта с использованием HTML и CSS» по информатике, 9 класс

• Создать структуру HTML-документа для мини-сайта на заданную тему, используя основные теги (html, head, body, заголовки, параграфы, списки, изображения).
• Применить базовые стили CSS (цвет, шрифт, выравнивание, отступы) для оформления созданной веб-страницы.
• Проявить творческий подход и критическое мышление при разработке дизайна и контента сайта, предложив собственную идею или улучшив предложенный шаблон.

"Добрый день, ребята! Сегодня мы с вами будем не просто программистами, а дизайнерами и архитекторами собственного маленького уголка в интернете. Тема нашего урока: «Создание мини-сайта с использованием HTML и CSS»."

"Давайте начнем с разминки для ума. У вас на столах лежат стикеры. За 1 минуту запишите на них все слова-ассоциации, которые приходят вам на ум, когда вы слышите словосочетание «веб-сайт». Это могут быть технологии, эмоции, элементы, цели — все что угодно."

(Через минуту). "Отлично! Теперь давайте разместим ваши стикеры на доске. Посмотрите, какая интересная карта ассоциаций у нас получилась! Давайте вместе выберем 3 ключевых, на ваш взгляд, понятия. Например, «структура», «дизайн», «контент». Почему именно они? Потому что без четкой структуры сайт развалится, без дизайна он будет неинтересен, а без контента — бесполезен. Именно над этими тремя китами мы сегодня и поработаем."

ИИ-инструменты: Интеллект-карта (mind-map) может быть создана в реальном времени с помощью сервисов типа Miro или MindMeister. Учитель может демонстрировать общую карту на экране, а ученики — добавлять свои ассоциации с устройств. Это визуализирует коллективную работу и экономит время.

• Слушают вводную информацию учителя.
• Индивидуально записывают ассоциации на стикеры за отведенное время.
• Выходят к доске, чтобы прикрепить стикеры, формируя общую mind-map.
• Участвуют в обсуждении, аргументируют выбор ключевых понятий.

• Ученик записал не менее 3 ассоциаций.
• Ученик принял участие в обсуждении выбранных ключевых понятий (устно или активно слушая).

• Стикеры, маркеры, доска.
• ИИ-сервис для создания интеллект-карт (Miro, MindMeister).
• Проектор/интерактивная доска.