Рабочая программа учебного предмета «Основы сайтостроения» 11 классы

МИНИСТЕРСТВО ПРОСВЕЩЕНИЯ РОССИЙСКОЙ ФЕДЕРАЦИИ
Министерство образования Пензенской области
Администрация Белинского района

МОУ СОШ им. И.И. Пушанина с. Пушанина Белинского района Пензенской области
Рассмотрено на заседании
методического объединения
Протокол №1 от 27.08.2024 г.

Принято на заседании
педагогического совета
Протокол №1 от 28.08.2024 г.

«Утверждаю»
Директор МОУ СОШ
им. И.И.Пушанина с.Пушанина
_____________Мирошкина Е.В.
Приказ №93/12 от 30.08.2024 г.

Рабочая программа учебного предмета
«Основы сайтостроения»
для обучающихся 11 класса

Пояснительная записка
Планируемые результаты:
Личностные:

широкие познавательные интересы, инициатива и любознательность, мотивы познания и творчества; готовность и
способность учащихся к саморазвитию и реализации творческого потенциала в духовной и предметно-продуктивной
деятельности за счет развития их образного, алгоритмического и логического мышления;

готовность к повышению своего образовательного уровня и продолжению обучения с использованием средств и
методов информатики и ИКТ;

интерес к информатике и ИКТ, стремление использовать полученные знания в процессе обучения другим предметам и
в жизни;

способность увязать учебное содержание с собственным жизненным опытом и личными смыслами, понять
значимость подготовки в области информатики и ИКТ в условиях развития информационного общества;

готовность к самостоятельным поступкам и действиям, принятию ответственности за их результаты; готовность к
осуществлению индивидуальной и коллективной информационной деятельности;

развитие чувства личной ответственности за качество окружающей информационной среды;

способность и готовность к принятию ценностей здорового образа жизни за счет знания основных гигиенических,
эргономических и технических условий безопасной эксплуатации средств ИКТ.
Метапредметные:

владение основными общеучебными умениями информационно-логического характера: анализ объектов и
ситуаций; синтез как составление целого из частей и самостоятельное достраивание недостающих компонентов;

владение умениями организации собственной учебной деятельности, включающими: целеполагание как постановку
учебной задачи; планирование с учетом конечного результата, разбиение задачи на подзадачи, разработка последовательности и
структуры действий, необходимых для достижения цели при помощи фиксированного набора средств; прогнозирование; контроль
– интерпретация полученного результата, его соотнесение с имеющимися данными с целью установления соответствия или
несоответствия (обнаружения ошибки); коррекция – внесение необходимых дополнений и корректив в план действий в случае
обнаружения ошибки; оценка – осознание учащимся того, насколько качественно им решена учебно-познавательная задача;

широкий спектр умений и навыков использования средств информационных и коммуникационных технологий для
сбора, хранения, преобразования и передачи различных видов информации (работа с текстом, гипертекстом, звуком и графикой в
среде соответствующих редакторов; навыки создания личного информационного пространства;

владение базовыми навыками исследовательской деятельности, проведения виртуальных экспериментов; владение
способами и методами освоения новых инструментальных средств;

владение основами продуктивного взаимодействия и сотрудничества со сверстниками и взрослыми; умение
осуществлять в коллективе совместную информационную деятельность; умение выступать перед аудиторией, представляя ей
результаты своей работы с помощью средств ИКТ; использование коммуникационных технологий в учебной деятельности и
повседневной жизни.

Содержание программы
Урок 1. Знакомство с технологиями веб-разработки
Теоретическая часть
Обзор базовых технологий разработки. Выбор инструментов. Знакомство с HTML. Создание тестовой первой страницы.
Практическая деятельность
Подбор материалов для индивидуального проекта.
Урок 2. Структура HTML-документа. Содержимое блока заголовков
Теоретическая часть
Изучение структуры веб-страницы, возможного содержимого блока .
Мета-теги. Комментарии.
Определение структуры и дизайна индивидуального проекта.
Проектная работа
Разработка блока заголовков индивидуального проекта. Создание индивидуальных элементов (заголовков, ключевых слов, иконок и т. д.)
своих страниц.
Урок 3. Форматирование текста. Физическое и логическое форматирование. Списки.
Теоретическая часть
Обзор тегов форматирования текста. Теги физического и логического форматирования текста, списков. Организация рабочего места
разработчика.
Практическая деятельность
Форматирование текстового контента.
Урок 4. Гиперссылки
Теоретическая часть
Изучение типов гиперссылок и вариантов их применения. Файловая структура. Внутренние и внешние ссылки. Знакомство со ссылкамиякорями.
Проектная работа
Размещение контента в индивидуальном проекте. Создание перекрестных ссылок.
Урок 5. Изображения
Теоретическая часть
Углубленное изучение параметров тега изображения. Единицы измерения. Изучение вариантов форматирования изображений в HTML.
Проектная работа

Подготовка и размещение изображений в индивидуальном проекте.
Урок 6. Изображения. Видео
Теоретическая часть
Форматы изображений для веб-дизайна и принципы их использования. Растр и вектор. Принципы подготовки изображений для вебдизайна. Анимированные изображения. Вставка видео на веб-страницу.
Практическая деятельность
Обработка изображений. Вставка видео и фрейма.
Урок 7. Таблицы
Теоретическая часть
Изучение средств HTML для создания таблиц. Варианты применения таблиц. Объединение и форматирование ячеек.
Практическая деятельность
Организация табличного представления информации.
Урок 8. Цвета
Теоретическая часть
Изучение вариантов определения цветов в HTML. Обзор теории цвета. Цветовой круг, модель Иттена. Обзор принципов создания
гармоничных цветовых схем.
Практическая деятельность
Подбор цветовой схемы для индивидуального проекта.
Урок 9. Основы CSS
Теоретическая часть
Обзор назначения, синтаксиса и применения каскадных стилей. Изучение вариантов размещения стилей.
Проектная работа
Применение стилей в индивидуальном проекте. Подключение шрифтов Google.
Урок 10. Селекторы. Приоритеты стилей. Каскадность
Теоретическая часть
Виды селекторов CSS: селекторы тегов, классов, идентификаторов, групп. Понятие класса. Селекторы дочерних и сестринских элементов,
потомков. Понятие наследования. Каскадность стилей. Расчет и определение приоритетов стилей.
Практическая деятельность
Применение стилевых правил к основному контенту индивидуального проекта.
Урок 11. Стилевые свойства текста
Теоретическая часть
Обзор применения CSS стилей для текста и списков. Цвет, шрифт, размер, начертание, трансформация, декорирование текста. Интервалы,
выравнивание.

Проектная работа
Создание стилевых правил для текстов в индивидуальном проекте.
Урок 12. Стилевые свойства графики
Теоретическая часть
Обзор применения CSS стилей для графических элементов. Фоновые изображения: повтор, позиция, размер. Цвет и градиент. Рамки,
отступы, тени. Примеры применения различных эффектов к изображениям.
Проектная работа
Применение стилей к изображениям в индивидуальном проекте.
Урок 13. Блоки-контейнеры. Блочная модель в CSS
Теоретическая часть
Изучение применения блоков-контейнеров и их видов при взаимном расположении элементов. Внешние и внутренние отступы. Блочные,
строчные, гибридные элементы. Подготовка к блочной верстке веб-страницы. Практика применения отступов, обтекания. Понятие потока
документа.
Практическая деятельность
Подготовка материалов к верстке одностраничного сайта.
Урок 14. Практикум. Верстка одностраничного сайта
Теоретическая часть
Объединение содержимого HTML и разметки CSS. Создание базовых стилей веб-страницы. Вопросы адаптивности. Размещение блоков
контента на страницах индивидуального проекта. Форматирование контента и применение стилей.
Проектная работа
Верстка одностраничного сайта в индивидуальном проекте.
Урок 15. Практикум. Продолжение верстки
Теоретическая часть
Объединение содержимого HTML и разметки CSS. Разработка шапки и навигационных панелей. Разработка стилей блоков основного
контента. Обтекание, вычисление ширины блоков. Резиновая верстка. Разработка подвала. Форматирование контента и применение стилей.
Проектная работа
Верстка одностраничного сайта в индивидуальном проекте.
Урок 16. Практикум. Адаптивная верстка
Теоретическая часть
Типы верстки. Изучение принципов адаптивной верстки. Наборы стилей. Медиа-запросы.
другим
параметрам экрана. Брейк-пойнты. Создание полностью адаптивной веб-страницы.
Проектная работа
Верстка адаптивного сайта в индивидуальном проекте.

Ограничения по

ширине

Тематическое планирование
№

2
3
4
5
6

7
8
9
10
11

Тема

Знакомство с технологиями
веб-разработки. Структура
HTML-документа
Физическое и логическое
форматирование. Списки.
Гиперссылки
Изображения и видео
Таблицы
Цвета
Итого
Принципы
Селекторы. Приоритеты
стилей. Каскадность
Стилевые свойства текста
Стилевые свойства
графики
Блоки-контейнеры.
Блочная модель в CSS
Итого

Количество часов
всего
теория
Основы языка разметки HTML
3
2

практика

2
1
2
1
2
1
1
1
12
7
Основы таблиц стилей CSS
1
1
2
1

1
1
1

2
2

1
1

2
12
2
34

1
4
1
17

1
8
1
17

Практикум
12
13
14

Верстка одностраничного
сайта
Адаптивность верстки
Итого
Резерв
Итого по всем разделам

Календарно-тематическое планирование
№ урока

Тема урока

Колво
часов

Основное содержание

Планируемые результаты
(предметные)

Оборудов
ание,
ЭОР

Основы языка разметки HTML (12ч)
1

Знакомство с
технологиями вебразработки.

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

2-3

Структура HTMLдокумента

4-5

Физическое
логическое
форматирование.
Списки.

6-7

Гиперссылки

8-9

Изображения и видео

Изучение структуры вебстраницы,
возможного
содержимого блока .
Мета-теги. Комментарии.
Определение структуры и
дизайна индивидуального
проекта
Обзор
тегов
форматирования
текста.
Теги
физического
и
логического
форматирования
текста,
списков.
Изучение
типов
гиперссылок и вариантов
их применения. Файловая
структура. Внутренние и
внешние
ссылки.
Знакомство со ссылкамиякорями.
Углубленное
изучение
параметров
тега

и 2

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

Интеракти
вная
доска, ПК

Интеракти
вная

Дата
план

факт

изображения.
Единицы
измерения.
Изучение
вариантов форматирования
изображений в HTML.
Анимированные
изображения.
Вставка
видео на веб-страницу.
Изучение средств HTML
для
создания
таблиц.
Варианты
применения
таблиц. Объединение и
форматирование ячеек.

структурирования информации,
умения выбирать способ
представления данных в
соответствии с поставленной
задачей — таблицы, схемы,
графики, диаграммы, с
использованием
соответствующих программных
средств обработки данных.
Формирование навыков и умений
безопасного и целесообразного
поведения при работе с
компьютерными программами и
Изучение
вариантов в Интернете, умения соблюдать
определения
цветов
в нормы информационной этики и
HTML.
Обзор
теории права.
цвета.
Цветовой
круг,
модель
Иттена.
Обзор
принципов
создания
гармоничных
цветовых
схем.

Таблицы

Цвета

Принципы

Обзор
назначения,
синтаксиса и применения
каскадных
стилей.
Изучение
вариантов
размещения стилей.

Селекторы.
Приоритеты стилей.
Каскадность

Виды селекторов CSS:
селекторы тегов, классов,
идентификаторов, групп.
Понятие класса. Селекторы
дочерних и сестринских
элементов,
потомков.
Понятие
наследования.
Каскадность стилей. Расчет
и определение приоритетов

10-11

доска, ПК

Интеракти
вная
доска, ПК

Основы таблиц стилей CSS (8ч)

14-15

Интеракти
вная
доска, ПК

стилей.

16-17

Стилевые свойства
текста

18-19

Стилевые свойства
графики

Блоки-контейнеры.
Блочная модель в CSS

Обзор применения CSS
стилей для текста и
списков. Цвет, шрифт,
размер,
начертание,
трансформация,
декорирование
текста.
Интервалы, выравнивание.
Обзор применения CSS
стилей для графических
элементов.
Фоновые
изображения:
повтор,
позиция, размер. Цвет и
градиент. Рамки, отступы,
тени. Примеры применения
различных эффектов к
изображениям.
Изучение
применения
блоков-контейнеров и их
видов
при
взаимном
расположении элементов.
Внешние и внутренние
отступы.
Блочные,
строчные,
гибридные
элементы. Подготовка к
блочной
верстке
вебстраницы.
Практика
применения
отступов,
обтекания. Понятие потока
документа.

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

Интеракти
вная
доска, ПК

Практикум (15ч)
21-30

Верстка
одностраничного сайта

Объединение содержимого
HTML и разметки CSS.
Создание базовых стилей
веб-страницы.
Вопросы
адаптивности. Размещение
блоков
контента
на

Формирование
Интеракти
информационной и
вная
алгоритмической культуры;
доска, ПК
формирование представления о
компьютере как универсальном
устройстве обработки

31-32

Адаптивность верстки

33-34

Резерв

страницах
индивидуального проекта.
Форматирование контента
и применение стилей.
Разработка
шапки
и
навигационных
панелей.
Разработка стилей блоков
основного
контента.
Обтекание,
вычисление
ширины блоков. Резиновая
верстка.
Разработка
подвала. Форматирование
контента и применение
стилей.
Типы верстки. Изучение
принципов
адаптивной
верстки. Наборы стилей.
Медиа-запросы.
Ограничения
по
ширине
и
другим
параметрам
экрана.
Брейк-пойнты.
Создание
полностью
адаптивной веб-страницы.

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

Интеракти
вная
доска, ПК