«Web - дизайн» (Web-программирование) программа
рабочая программа

Рассмотрена на заседании                                                 УТВЕРЖДАЮ

педагогического совета                                        Директор _______________

Протокол № ___12________                                ________________________

от _____08 мая 2020_______                                 Приказ № _____ от_______

Дополнительная общеразвивающая программа

технической направленности

«Web - дизайн»

(Web-программирование)

Объединение «Web - дизайн»

Срок реализации программы – 144 часов

Возраст обучающихся первого года обучения: 14-17 лет

Уровень программы (базовый)

Автор-разработчик:

___Ротанова Е.В.____

г. Барыш, 2020 г.

Структура дополнительной общеразвивающей программы

1. Комплекс основных характеристик программы

1.1 Пояснительная записка                                                                3 стр.        

            1.2 Цель и задачи программы                                                        5 стр.

3. Планируемые результаты освоения программы                                6 стр.        

1.4 Содержание программы                                                        7 стр.        

2. Комплекс организационно-педагогических условий.

2.1 Календарный  учебный  график                                                        15 стр.        

2.2 Условия реализации программы                                                  16 стр.        

4. Формы аттестации                                                                17стр.        
5. Методические материалы                                                        18 стр.                                        

3. Список литературы                                                                 29 стр.        

1. Комплекс основных характеристик программы

1. Пояснительная записка

Дополнительная образовательная программа «Web-дизайн» предназначена для работы в учреждениях дополнительного образования с обучающимися образовательных учреждений, желающими овладеть основами программирования и web-дизайна. Основными задачами в работе является ориентация на максимальную самореализацию личности, личностное и профессиональное самоопределение, социализацию и адаптацию детей в обществе. Таким образом, целью программы на всех этапах ее реализации является создание поля самоактуализации для детей в техническом виде деятельности (web-дизайне), формирование потребности ребёнка в приобретении специальных знаний и навыков, подготовить детей к осознанному выбору профессии и жизненного пути.

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

Данная программа реализуется с применением оборудования поставляемым по проекту создания высокооснащенных мест в дополнительном образовании.

Нормативно-правовое обеспечение программы.

        В настоящее время содержание, роль, назначение и условия реализации программ дополнительного образования закреплены в следующих нормативных документах:

        Программа разрабатывается в соответствии со следующими документами:

• Федеральный Закон Российской Федерации от 29.12.2012 № 273 «Об образовании в Российской Федерации»;
• Приказом от 09.11.2018  № 196 Министерства просвещения Российской Федерации «Об утверждении Порядка организации и осуществления образовательной деятельности по дополнительным общеобразовательным программам»;
• Концепция развития дополнительного образования детей от              04.09.2014 № 1726;
• Письмо Минобрнауки России от 18.11.2015 №09-3242 «Методические рекомендации по проектированию дополнительных общеразвивающих программ»;
• СанПин 2.4.3172-14: «Санитарно-эпидемиологические требования к устройству, содержанию и организации режима работы образовательных организаций дополнительного образования детей»;
• Устав МБОУ СОШ №2 МО «Барышский район» Ульяновской области (Распоряжение Министерства образования и науки Ульяновской области от 23.03.2017 № 506-р);
• Локальные акты образовательного учреждения:

- Положение о разработке, структуре и порядке утверждения

дополнительной общеразвивающей программы (локальный акт МБОУ СОШ №2 МО «Барышский район» Ульяновской области);

        - Положение о приёме, переводе, отчислении и восстановлении обучающихся;

        - Положение об объединении образовательного учреждения;

        - Положение о проведении промежуточной и итоговой аттестации обучающихся;

        - Методические рекомендации по проектированию и оформлению дополнительных общеразвивающих программ;

        - Правила внутреннего распорядка для обучающихся.

Уровень освоения базовый

Направленность (профиль) программы – техническая.

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

Умение представлять преобразованную информацию, учитывая особенности восприятия других людей, — важное условие образовательной компетентности учащихся, выбравших кружок «Web-дизайн». Web-сайт является хорошо известным и доступным ученикам средством представления текстовой, графической и иной информации в сети Интернет.

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

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

Тесная связь стиля деятельности, сформированного интернет-технологиями, со всеми сферами современного общества (гуманитарной, естественнонаучной, социальной, экономической и др.) позволяет использовать знания, выработанные при освоении программы кружка «Web-дизайн», практически во всех образовательных областях старшей школы.

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

Новизна дополнительной общеразвивающей программы предполагает:

• новое решение проблем дополнительного образования;
• новые методики преподавания;
• новые педагогические технологии в проведении занятий.

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

Адресат программы – 14 - 17 лет.

Объём программы – Программа предусматривает 144 часа на реализацию и состоит из двух модулей – 64 часа и 80 часов, занятия проводятся 2 раза в неделю по 2 часа. Занятия проводятся два раза в неделю по два академических часа, с перерывом между занятиями 10-15 минут.

Формы обучения и виды занятий:

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

1.2 Цели и задачи программы

Общепедагогическая направленность занятий — гармонизация индивидуальных и социальных аспектов обучения по отношению к сетевым информационным технологиям. Знания, умения и способы конструирования web-сайтов являются элементами информационной компетенции — одной из ключевых компетенций современной школы. Умение находить, структурировать, преобразовывать и сохранять информацию в html-формате и других интернет-совместимых форматах — необходимое условие подготовки современных школьников. Особая роль отводится широко представленной в курсе системе рефлексивных заданий. Освоение рефлексии направлено на осознание учащимися того важного обстоятельства, что наряду с разрабатываемыми ими продуктами в виде html-страниц рождается основополагающий образовательный продукт: освоенный инструментарий. Именно этот образовательный продукт станет базой для творческого самовыражения учащихся в форме сайтов, которые можно размещать в Интернете или в локальной школьной сети.

Цели

Основными целями являются:

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

Задачи

Основными задачами являются:

• познакомить с видами web-сайтов, их функциональными, структурными и технологическими особенностями;
• сформировать навыки элементарного проектирования, конструирования, размещения и сопровождения web-сайта;
• создать представление о языке HTML и научить использовать его для создания web-страниц;
• сформировать навыки коллективной работы с комплексными web-проектами;
• создать и разместить в сети Интернет собственный web-сайт в соответствии с выбранной темой.

1.3 Планируемые результаты освоения программы

В рамках кружка «Web-дизайн» учащиеся овладевают следующими знаниями, умениями и способами деятельности:

• знают принципы и структуру устройства Всемирной паутины, формы представления и управления информацией в сети Интернет;
• умеют найти, сохранить и систематизировать необходимую информацию из Сети с помощью имеющихся технологий и программного обеспечения;
• умеют спроектировать, изготовить и разместить в сети web-сайт объёмом 5-10 страниц на заданную тему;
• владеют способами работы с изученными программами;
• знают и умеют применять при создании web-страницы основные принципы web-дизайна;
• владеют необходимыми способами проектирования, создания, размещения и обновления web-сайта;
• знают виды web-сайтов, способны произвести анализ и сформулировать собственную позицию по отношению к их структуре, содержанию, дизайну и функциональности;
• владеют приёмами организации и самоорганизации работы по изготовлению сайта;
• имеют положительный опыт коллективного сотрудничества при конструировании сложных web-сайтов;
• имеют опыт коллективной разработки и публичной защиты созданного сайта;
• овладевают процедурой самооценки знаний и деятельности и корректируют дальнейшую деятельность по сайтостроительств

1.4 Содержание программы

Учебный план 1 модуля

1.4.2 Содержание учебного  плана 1 модуля

Раздел 1. Введение

Основы web-дизайна, технологии создания привлекательных и удобных сайтов. Язык HTML — основной инструмент создания web-страниц.

Язык JavaScript — скриптовый язык, с помощью которого можно добавить на страницу динамические и интерактивные эффекты (реагирование на кнопки, обработка форм, произвольные надписи, зависящие от действий пользователей, и т. д.). Техника безопасности и организация рабочего места.

Раздел 2. Осваиваем Интернет 

Учащиеся должны знать / понимать:

 Структура сети Интернет. Виды доступа к Интернет

Принципы функционирования сети. Сервисы Интернета. Браузеры

Раздел 3. Язык гипертекстовой разметки HTML

Тема 1.1. Структура html-документа

Учащиеся должны знать / понимать:

принципы работы с html-тегами;

принципы работы браузера при отображении страницы;

структуру кода web-страницы;

теги заголовков, с помощью которых формируется страница;

теги форматирования текста.

Учащиеся должны уметь:

создать web-страницу с помощью html-кода;

придать web-странице требуемое форматирование.

Браузер. Структура html-документа. Тег. Форматирование html-документа.

Практическая работа: «Структура html-документа».

Тема 1.2. Теги и атрибуты

Учащиеся должны знать / понимать:

назначение основных параметров для тегов форматирования.

Учащиеся должны уметь:

управлять параметрами текста с помощью тега ;

управлять параметром выравнивания для тега

;

задавать заголовок документа.

Атрибуты тегов. Базовый шрифт. Заголовок html-документа.

Практическая работа: «Теги и атрибуты».

Тема 1.3. Вставка изображения на страницу

Учащиеся должны знать / понимать:

как вставить изображение на web-страницу;

как отключать отображение изображений на web-странице.

Учащиеся должны уметь:

вставлять необходимое изображение в нужное место web-страницы;

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

Вставка изображения на web-страницу. Альтернативный текст.

Практическая работа: «Вставка изображения на страницу».

Тема 1.4. Управление рисунком

Учащиеся должны знать / понимать:

как узнать значения высоты и ширины графического файла.

Учащиеся должны уметь:        

задавать произвольный размер вставляемому изображению;

выравнивать и центрировать рисунок на web-странице.

Выравнивание рисунка. Свойства графического изображения.

Практическая работа: «Управление рисунком».

Тема 1.5. Простые таблицы

Учащиеся должны знать / понимать:

основы работы с таблицами и применение их для разметки структуры web-документа;

назначение основных атрибутов таблицы.

Учащиеся должны уметь:

формировать таблицу;

настраивать ширину и высоту ячеек таблицы;

осуществлять разметку страницы с помощью таблиц;

создавать сложную структуру с помощью вложенных таблиц.

Создание и разметка таблицы. Вложенные таблицы.

Практическая работа: «Простые таблицы».

Тема 1.6. Формирование сложных таблиц

Учащиеся должны знать / понимать:

способы модификации таблицы путём объединения ячеек и применение границ и заливок.

Учащиеся должны уметь:

объединять ячейки таблицы;

оформлять таблицу с помощью границ и заливки ячеек.

Объединение ячеек таблиц. Границы и заливка таблицы.

Практическая работа: «Формирование сложных таблиц».

Тема 1.7. Гиперссылки

Учащиеся должны знать / понимать:

назначение гиперссылок и принцип их создания.

Учащиеся должны уметь:

осуществлять связь страничек с помощью гиперссылок.

Гиперссылки.

Практическая работа: «Гиперссылки».

Тема 1.8. Оформление гиперссылок

Учащиеся должны знать / понимать:

как оптимальным образом и в каком виде поместить гиперссылку на web-страницу.

Учащиеся должны уметь:

изменять стандартные цвета гиперссылок;

создавать картинки-гиперссылки;

ссылаться на внешние ресурсы Интернета.

Картинка-гиперссылка. Цвета гиперссылки. Внешний ресурс.

Практическая работа: «Оформление гиперссылок».

Раздел 4. Каскадные таблицы стилей CSS

Тема 2.1. Каскадные таблицы стилей

Учащиеся должны знать / понимать:

назначение каскадной таблицы стилей;

принципы создания стилей и их применение на web-страницах.

Учащиеся должны уметь:

создавать внешнюю таблицу стилей, подключать её к web-странице и применять стили к тегам;

создавать стилевые правила для отдельных тегов, создавать классы и псевдоклассы.

Каскадные таблицы стилей (CSS). Селектор. Внешняя таблица стилей. Стилевой класс и псевдокласс.

Практическая работа: «Каскадные таблицы стилей».

Тема 2.2. Позиционирование

Учащиеся должны знать / понимать:

возможности стилей по позиционированию тегов;

возможности внутренних и Inline-стилей.

Учащиеся должны уметь:

создавать и использовать контекстный селектор;

использовать внутреннюю таблицу стилей и Inline-стиль;

задать позицию для тега с помощью стилей.

Контекстный селектор. Внутренняя таблица стилей. Inline-стиль. Позиционирование.

Практическая работа: «Позиционирование».

Тема 2.3. Фреймы

Учащиеся должны знать / понимать:

назначение фреймов и основы работы с ними.

Учащиеся должны уметь:

формировать фреймовую структуру страницы;

осуществлять загрузку web-страницы в заданный фрейм.

Фрейм. Фреймовая структура страницы. Гиперссылки между фреймами.

Практическая работа: «Фреймы».

Тема 2.4. Настройка фреймов

Учащиеся должны знать / понимать:

основные атрибуты тегов фреймовой структуры.

Учащиеся должны уметь:

оформлять фреймы;

создавать «историю» посещения страничек.

Форматирование фреймов. «История» посещения страничек.

Практическая работа: «Настройка фреймов».  

Учебный план 2 модуля