Учебный проект Создание сайта для начинающих (HTML & CSS)

Материал из НГПУ им. К.Минина
Перейти к: навигация, поиск


Автор проекта

Реунова Яна Геннадьевна

Предмет, класс

Информатика, 7-9 класс

Краткая аннотация проекта

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

Вопросы, направляющие проект

  1. Как создать веб-сайт, отражающий интересы учащихся и способствующий изучению основ веб-разработки?
  2. Какие темы и материалы должны быть включены в учебный контент, чтобы обеспечить полноценное освоение HTML и CSS?

Основополагающий вопрос

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

Проблемные вопросы

  1. Как эффективно оценивать и поддерживать успехи учащихся, предоставляя конструктивную обратную связь и дополнительные ресурсы?
  2. Как адаптировать материалы и методы обучения для удовлетворения разнообразных потребностей и уровней знаний начинающих веб-разработчиков?
  3. Как оценить эффективность проектного метода в обучении HTML и CSS и определить, насколько он способствует активному участию и достижениям учащихся?

Учебные вопросы

  1. Как создать основную структуру HTML-документа и какие элементы необходимы для правильного форматирования веб-страницы?
  2. Как применить CSS-стили для управления внешним видом и макетом веб-страницы, включая шрифты, цвета и расположение элементов?
  3. Какие методы использовать для создания адаптивного дизайна веб-страницы, чтобы она отображалась корректно на различных устройствах и разрешениях экранов?
  4. Как организовать мультимедийный контент, такой как изображения и видео, на веб-странице с использованием HTML и CSS?
  5. Какие методы и лучшие практики существуют для тестирования и отладки веб-сайта, а также для обеспечения оптимальной производительности без использования JavaScript?

План проведения проекта

План проведения проекта "Создание сайта для начинающих (HTML & CSS)" в разрезе недель:

Неделя 1-2: Введение в веб-разработку и основы HTML
- День 1: Знакомство с проектом.
- День 2-3: Основы HTML.
- День 4-5: Работа с текстовыми элементами.

Неделя 3-4: Глубже в HTML и введение в CSS.
- День 6-7: Работа с изображениями и ссылками.
- День 8-9: Основы CSS.

Неделя 5-6: Дизайн и продвинутые темы CSS
- День 10-11: Макет и бокс-модель.
- День 12-13: Работа с цветами и шрифтом.

Неделя 7-8: Проектная работа и закрепление
- День 14-16: Закрепление материалов и проектная работа.
- День 17-18: Консультация и разработка сайта.
- День 19-20: Оценка и презентация проектов.

Визитная карточка проекта

Визитная карточка

Публикация преподавателя

Публикация преподавателя320.png

Пример продукта проектной деятельности учащихся

Результат исследования учащихся по проекту Создание сайта для начинающих (HTML & CSS)

Материалы по формирующему и итоговому оцениванию

1. Итоговая рефлексия для учеников на самоанализ
2. Анкета

Материалы по сопровождению и поддержке проектной деятельности

1. Тестовые задания по HTML - Неделя 1: Введение в веб-разработку и основы HTML
2. Тестовые задания по HTML и CSS - Неделя 3-4: Глубже в HTML и введение в CSS
3. Тестовые задания по продвинутым темам CSS - Неделя 5-6: Дизайн и продвинутые темы CSS

Полезные ресурсы

1. HTML и CSS. Разработка и дизайн веб-сайтов
2. mdn web docs
3. flexbox froggy
4. Дэвид Макфарланд: Новая большая книга CSS

Проекты с аналогичной тематикой

1. Учебный проект Создаём сайт
2. Учебный проект Веб-сайт своими руками