Муниципальное бюджетное общеобразовательное учреждение средняя общеобразовательная школа села Ильчино муниципального района Учалинский район Республики Башкортостан
| РАССМОТРЕНА на заседании ШМО
____Ахмедвалиев А.А. « ___» _________ 2014г. | СОГЛАСОВАНА зам. директора по УВР
_____Низамова Г.Ш.
« ___» _________ 2014г. | УТВЕРЖДАЮ Директор школы
_____Батыршина З.Г.
« ___» _________ 2014 г. |
РАБОЧАЯ ПРОГРАММА
Кружка по информатике «Технология создания сайтов» на 2014-2015 учебный год
Разработала: Сайфуллина Ляйсан Ирековна
Пояснительная записка Умение представлять информацию в виде, удобном для восприятия и использования другими людьми – одно из условий образовательной компетентности ученика технологического профиля. Веб-сайт – наиболее популярное и доступное старшеклассникам средство представления текстовой, графической и иной информации в сети Интернет.
Занятия включают практическое освоение техники создания веб-страниц, тематических сайтов, веб-квестов, информационно-справочных и иных сайтов.
Курс рассчитан на 60 часов, которые проводятся в течение учебного года по 2 часа в неделю. Это более сжатое по времени изучение курса с использованием проектного метода обучения. Задачей курса является также подготовка школьников к осознанному выбору Интернет-профессий, предусматривающих веб-мастеринг.
Курс может с успехом использоваться не только в технологическом, но и в других профилях старшей школы, поскольку веб-стиль деятельности относится ко всем сферам современного общества – гуманитарным, естественнонаучным, социальным, экономическим, сервисным и другим.
Особенностью предлагаемой методики является личностная и продуктивная направленность занятий. Каждый учащийся создаёт личностно значимую для него образовательную продукцию – сначала простейшие веб-страницы, затем их отдельные элементы и целостные веб-сайты. Освоение знаний и способов веб-конструирования происходит в ходе разработки учениками сайтов на темы, которые они определяют для себя самостоятельно. Осознание и присвоение учащимися достигаемых результатов происходит с помощью рефлексивных заданий. Такой подход гарантирует повышенную мотивацию и результативность обучения.
Основные цели курса по отношению к деятельности учащихся:
освоить элементарные способы проектирования, конструирования, размещения и сопровождения веб-сайта в сети Интернет;
приобрести первичные навыки программирования на языках HTML;
познакомиться с основами веб-дизайна и научиться применять их при разработке веб-страниц;
создать и разместить в сети Интернет собственный веб-сайт (веб-страницы) по выбранной тематике.
Требования к уровню подготовки учащихся В рамках данного курса учащиеся должны овладеть следующими знаниями, умениями и способами деятельности:
знать принципы и структуру устройства "Всемирной паутины", формы представления и управления информацией в сети Интернет;
уметь найти, сохранить и систематизировать необходимую информацию из сети с помощью имеющихся технологий и программного обеспечения;
знать виды веб-сайтов, уметь произвести анализ и сформулировать собственную позицию по отношению к их структуре, содержанию, дизайну и функциональности;
уметь спроектировать, изготовить и разместить в сети веб-сайт объемом 5-10 страниц на заданную тему;
уметь программировать на языках HTML, Dynamic HTML, CSS на уровне создания не менее 3-5 элементов сайта;
знать и уметь применять при создании веб-страницы основные принципы веб-дизайна;
владеть способами работы с изученными программами (браузеры IE, NN, Opera; редакторы сайтов, Flash, FTP и др.);
уметь передавать информацию в сеть Интернет с помощью протокола FTP, специальных программ, веб-форм;
владеть приемами организации и самоорганизации работы по изготовлению сайта;
иметь опыт коллективного сотрудничества при конструировании веб-сайтов;
иметь опыт разработки и публичной защиты созданного сайта;
осуществлять рефлексивную деятельность, оценивать свои результаты, корректировать дальнейшую деятельность по сайтостроительству.
Способы оценки уровня достижений учащихся
Основой оценивания деятельности каждого ученика являются результаты анализа его образовательной продукции и деятельности по ее созданию.
Предметом диагностики, контроля и оценки в данном курсе являются:
внешние образовательные продукты учеников: созданные ими веб-страницы, их элементы, сайты и т.п.;
внутренние личностные качества учеников: освоенные ими способы деятельности, знания, умения, которые относятся к содержанию курса.
Качество образовательной продукции учеников оценивается по устанавливаемым в каждом случае критериям. Например, созданный учеником веб-сайт (веб-страница) может быть оценен по следующим критериям:
идея сайта,
соответствие структуры и содержания сайта его назначению;
степень оригинальности, количество творческих элементов сайта;
дизайн сайта, использованные графические возможности;
уровень технического исполнения сайта;
интерактивность сайта;
пользовательские возможности сайта, удобство его использования.
Для диагностики освоенных учеником умений и способов деятельности применяются рефлексивные задания. Ученик устно или письменно описывает этапы своей деятельности, возникающие проблемы, применяемые способы их решения. Рефлексивные материалы учеников служат предметом оценки уровня развития их личностных качеств – знаний, умений, способностей.
Учитель оценивает уровень развития личностных качеств учеников по параметрам, сгруппированным в определенные блоки: технические качества, дизайнерские, коммуникативные, креативные, когнитивные, оргдеятельностные, рефлексивные.
Оценка имеет различные способы выражения – устные суждения педагога, письменные качественные характеристики, систематизированные по заданным параметрам аналитические данные, в том числе и рейтинги.
Оценке подлежит, в первую очередь, уровень достижения учеником минимально необходимых результатов, обозначенных в программе курса. Оцениванию подлежат также те направления и результаты деятельности учеников, которые определены в рабочей программе учителя и в индивидуальных образовательных программах учеников.
Ученик выступает полноправным субъектом оценивания. Одна из задач педагога – обучение детей навыкам самооценки. С этой целью учитель выделяет и поясняет критерии оценки, учит детей формулировать эти критерии в зависимости от поставленных целей и особенностей образовательного продукта – создаваемого сайта.
Проверка достигаемых учениками образовательных результатов производится в следующих формах:
текущий рефлексивный самоанализ, контроль и самооценка учащимися выполняемых заданий;
взаимооценка учащимися работ друг друга, или работ, выполненных в группах;
публичная защита выполненных учащимися творческих работ (индивидуальных и групповых);
текущая диагностика и оценка учителем деятельности школьников;
итоговая оценка деятельности и образовательной продукции ученика в соответствии с его индивидуальной образовательной программой по курсу;
итоговая оценка индивидуальной деятельности учащихся учителем, выполняемая в форме образовательной характеристики.
Итоговый контроль проводится в конце всего курса. Он может иметь форму зачета олимпиады или защиты творческих работ. Данный тип контроля предполагает комплексную проверку образовательных результатов по всем заявленным целям и направлениям курса.
Формой итоговой оценки каждого ученика выступает образовательная характеристика, в которой указывается уровень освоения им каждой из целей курса и каждого из направлений индивидуальной программы ученика по курсу.
Содержание курса 1. Моя веб-страничка (10 часов)
Основные понятия: гипертекст, HTML, тег, браузер, веб-страница, разметка, структура документа, заголовок, тело.
Содержание темы:
Техническая часть. Что необходимо для работы.
Теги HTML
Структура веб-страницы
Заголовок документа
Тело документа
Атрибуты тегов
Цвет фона
Изображение как фон
Цвет текста
Цвета
Размер и форма шрифта
Теги форматирования текста
Взаимодействие тегов
Текстовые блоки
Заголовки
Абзацы
Перевод строки
Разделительная линия
Обобщение
Творческая работа "Самопрезентация"
Самооценка
2. Графика (4 часа)
Основные понятия: растровый формат, векторный формат, метафайлы, рамка изображения, выравнивание, обтекание.
Содержание темы:
Рисунки и фотографии в сети Интернет
Параметры графического файла
Форматы графических файлов
Растровые форматы
JPEG
GIF
PNG
Достоинства растрового формата
Недостатки
Векторные форматы
Достоинства
Недостатки
Метафайлы
Дополнительная информация
Графические редакторы
Как создать графический файл для веб-страницы
Прозрачная графика
Связывание графического файла с HTML-документом
Изображения в HTML-документе
Дополнительная информация
В помощь читателям веб-страниц
В помощь дизайнерам
Обобщение
Творческая работа "Сделай красиво!"
Самооценка
3. Гипертекстовый документ (12 часов)
Основные понятия: организация информации, гипертекстовые ссылки, внутренние ссылки, активные ссылки, посещенные ссылки, абсолютные адреса, относительные адреса.
Содержание темы:
Способы организации гипертекстовых документов
Разработка сценария гипертекстового документа, состоящего из нескольких файлов
Гипертекстовые ссылки
За пределами документа
Текстовые ссылки
Изображения-ссылки
Главный тег интернета
Абсолютные адреса
Относительные адреса
Новое окно
Внутренние ссылки.
Задание цвета ссылок на веб-странице
Задание цвета отдельных ссылок
Цвет и наличие рамок у изображений ссылок
Ссылка на адрес электронной почты
Обобщение
Творческая работа. Выполнение и защита проекта на одну из тем (сайт "Мой класс", "Наш фэн-клуб" и т.п.)
Самооценка
4. Виды сайтов (8 часа)
Основные понятия: Виды сайтов, критерии оценки, дизайн, навигация, эргономика, юзабилити, интерактивность.
Содержание темы:
Типы сайтов, их назначение.
Способы организации информации.
Оптимизация веб-страниц.
Удобство использования сайта.
Основные методы юзабилити.
Восприятие информации.
Критерии оценки сайтов.
Юзабилити.
Структура и навигация.
Контент (содержание).
Внешний вид.
Обратная связь. Интерактивность.
Обобщение
Творческая работа. Доработка оценочной таблицы и исследование выполненных проектов.
Самооценка
Рефлексия
5. Основы HTML (8 часов)
Основные понятия: списки, таблицы, фреймы, формы.
Содержание темы:
Таблицы.
Лишние ячейки. Пустые ячейки
Объединение ячеек. Разделение ячейки.
Вложенные таблицы
Цвета фона.
Цвет рамки.
Поля.
Фреймы
Как работают фреймы.
Достоинства фреймов.
Недостатки фреймов.
Создание фреймов.
Ссылки внутри фреймов.
Рамки.
Изменение размеров.
Полосы прокрутки.
Плавающие фреймы.
Фреймы – хорошо или плохо?
Формы
Добавление формы на страницу.
Кнопки.
Submit.
Reset.
Обобщение
Творческая работа. Выполнение и защита проекта на тему по выбору.
Самооценка
6. Редакторы сайтов (4 часов)
Основные понятия: Редактор веб-страниц, активные элементы, динамический язык, баннер, сервер.
Содержание темы:
Создание нового сайта
Настройка характеристик веб-страницы
Фон
Текст
Изображения
Гиперсылки
Настройка предпочтений для редактирования сайта
Использование таблиц
Использование слоев
Использование фреймов
Панель навигации
Доступ к HTML-коду веб-страницы
Самооценка
7. Основы веб-дизайна (4 часов)
Основные понятия: каскадные таблицы стилей, CSS, селектор, Flash, символ, клип, кнопка, анимация движения, анимация формы, Dynamic HTML, интерактивность, сценарии, статические и динамические страницы, активные элементы.
Содержание темы:
Назначение CSS.
Каскадные таблицы стилей.
Основы CSS.
Цвет в CSS.
Размер в CSS.
Комментарии.
Создание таблицы стилей.
Синтаксис.
Наследование.
Контекстные селекторы.
Шрифт и текст.
Фон.
Применение таблиц стилей к части страницы
Классы. Подклассы.
Личный тег
Строковый элемент
Блочный элемент
Свойства блоков
Граница (border)
Обтекание блока текста
Позиционирование.
Избранные страницы. Стиль персональный
Применение стиля для тега.
Взаимодействие стилей.
Каскадность стилей и приоритеты.
Ссылки как украшение.
ID-клaccы.
Способы задания стиля.
Flash.
Динамический HTML.
Творческая работа "Технический проект".
Самооценка.
Рефлексия.
8. Дополнительные возможности создания веб-страниц (4 часов)
Основные понятия: Дизайн, векторная и растровая графика, графический редактор, инструменты, фильтры, графические примитивы, палитра цветов, формат графического файла, заголовки, текст, разделы, ссылки, термины, эффективность рекламы.
Содержание темы:
Элементы веб-страницы.
Информационная архитектура.
Макет страницы.
Модульная сетка. Виды сеток.
Текст.
Оформление ссылок.
Форматирование текста.
Понятность и читаемость текста.
Основные элементы текста.
Фон.
Графические элементы.
Навигационная система. Типы.
Логотип.
Интерактивность.
Особенности начальной страницы.
Основные принципы веб-дизайна.
Уменьшение размера текста и графики.
Разделение пространства страницы.
Исключение длинных колонок.
Изображения в миниатюре.
Управление внешним видом сайта.
Совмещение неизменных и различающихся элементов сайта.
Фон.
Текст.
Месторасположение эмблемы и навигационных элементов.
Тема, название и заголовки.
Изображения.
Внесение разнообразия.
Повторение стандарта.
Композиция веб-страницы.
Основные правила композиции.
Средства композиции.
Цвет.
Психология цвета.
Отдельные цвета.
Средства веб-дизайна.
Инструменты веб-дизайнера.
Это может быть интересным.
Обобщение.
Web-мастеру: полезные советы.
Web-мастеру: правила хорошего HTML.
Web-мастеру: Что такое стильный дизайн?
Web-мастеру: Шрифтовое оформление в web-дизайне.
Web-мастеру: Главные ошибки в web-дизайне.
Web-мастеру: Юзабилити. Неписаные правила.
На заметку.
Творческая работа "Сайт класса должен быть классным!"
Самооценка.
Рефлексия.
9. Проектирование сайта (6 часов)
Основные понятия: Веб-студия: заказчик, арт-директор, веб-мастер, кодер, программист, верстальщик, менеджер. Техническое задание. Разделение труда. Проектирование, изготовление, размещение, тестирование сайта. Экспертная оценка.
Содержание темы:
Выбор темы сайта.
Заказчик сайта.
Создание команды. Распределение функций.
Техническое задание.
Этапы и сроки выполнения работ.
Разработка сайта. Особенности групповой деятельности разработчиков сайта.
Экспертная оценка. Защита проекта. Акт сдачи-приемки работы.
Самооценка и оценка.
Календарно-тематическое планирование
| № урока | Тема | Дата проведения | Фактическая дата проведения | Примечания
|
|
|
|
|
| Раздел 1. Моя веб-страничка (10) |
| 1 | Введение. Техника безопасности в кабинете информатики. | 01.10.14 |
|
|
| 2 | Введение. Техническая часть. Теги HTML. Структура веб-страницы | 01.10.14 |
|
|
| 3 | Введение. Техническая часть. Теги HTML. Структура веб-страницы | 15.10.14 |
|
|
| 4 | Заголовок документа Тело документа Атрибуты тегов Цвет фона. | 15.10.14 |
|
|
| 5 | Заголовок документа Тело документа Атрибуты тегов Цвет фона. | 22.10.14 |
|
|
| 6 | Заголовок документа Тело документа Атрибуты тегов Цвет фона. | 22.10.14 |
|
|
| 7 | Размер и форма шрифта. Теги форматирования текста. Взаимодействие тегов Текстовые блоки. | 29.10.14 |
|
|
| 8 | Размер и форма шрифта. Теги форматирования текста. Взаимодействие тегов Текстовые блоки. | 29.10.14 |
|
|
| 9 | Заголовки. Абзацы. Перевод строки. Разделительная линия. | 05.11.14 |
|
|
| 10 | Заголовки. Абзацы. Перевод строки. Разделительная линия. | 05.11.14 |
|
|
| Раздел 2. Графика (4) |
| 11 | Рисунки и фотографии в сети Интернета. Параметры графического файла. | 12.11.14 |
|
|
| 12 | Форматы графических файлов. Растровые форматы JPEG, GIF, PNG. | 12.11.14 |
|
|
| 13 | Достоинства растрового формата. Недостатки. Векторные форматы. | 26.11.14 |
|
|
| 14 | Связывание графического файла с HTML-документом. Изображения в HTML-документе. Дополнительная информация. | 26.11.14 |
|
|
| Раздел 3 . Гипертекстовый документ (12) |
| 15 | Гипертекстовые ссылки. Текстовые ссылки. Изображения-ссылки. | 03.12.14 |
|
|
| 16 | Гипертекстовые ссылки. Текстовые ссылки. Изображения-ссылки. | 03.12.14 |
|
|
| 17 | Абсолютные адреса. Относительные адреса. Внутренние ссылки. | 10.12.14 |
|
|
| 18 | Абсолютные адреса. Относительные адреса. Внутренние ссылки. | 10.12.14 |
|
|
| 19 | Абсолютные адреса. Относительные адреса. Внутренние ссылки. | 17.12.14 |
|
|
| 20 | Задание цвета ссылок на веб-странице ссылок. Ссылка на адрес электронной почты. | 17.12.14 |
|
|
| 21 | Задание цвета отдельных ссылок. Цвет и наличие рамок у изображений. | 24.12.14 |
|
|
| 22 | Задание цвета отдельных ссылок. Цвет и наличие рамок у изображений. | 24.12.14 |
|
|
| 23 | Творческая работа – создание сайта «Мой класс», «Наш фан-клуб» и т.п. | 14.01.15 |
|
|
| 24 | Творческая работа – создание сайта «Мой класс», «Наш фан-клуб» и т.п. | 14.01.15 |
|
|
| 25 | Творческая работа – создание сайта «Мой класс», «Наш фан-клуб» и т.п. | 21.01.15 |
|
|
| 26 | Творческая работа – создание сайта «Мой класс», «Наш фан-клуб» и т.п. | 21.01.15 |
|
|
| Раздел 4. Виды сайтов (8) |
| 27 | Виды сайтов, их назначение. | 28.01.15 |
|
|
| 28 | Способы организации информации. Полнота информации и ее обновление. | 28.01.15 |
|
|
| 29 | Способы организации информации. Полнота информации и ее обновление. | 04.02.15 |
|
|
| 30 | Графический и технический дизайн. Навигация. Скорость загрузки страниц и определяющие факторы. | 04.02.15 |
|
|
| 31 | Графический и технический дизайн. Навигация. Скорость загрузки страниц и определяющие факторы. | 11.02.15 |
|
|
| 32 | Интерактивность сайта. Интернет-технологии. Исследование действующих сайтов. Критерии оценки сайтов. | 11.02.15 |
|
|
| 33 | Интерактивность сайта. Интернет-технологии. Исследование действующих сайтов. Критерии оценки сайтов.
| 18.02.15 |
|
|
| 34 | Интерактивность сайта. Интернет-технологии. Исследование действующих сайтов. Критерии оценки сайтов. | 18.02.15 |
|
|
| Раздел 5. Основы HTML (8) |
| 35 | Таблицы. Лишние ячейки. Пустые ячейки. Вложенные таблицы. | 25.02.15 |
|
|
| 36 | Таблицы. Лишние ячейки. Пустые ячейки. Вложенные таблицы. | 25.02.15 |
|
|
| 37 | Объединение ячеек. Разделение ячейки. | 04.03.15 |
|
|
| 38 | Объединение ячеек. Разделение ячейки. | 04.03.15 |
|
|
| 39 | Цвета фона. Поля. Фреймы. | 11.03.15 |
|
|
| 40 | Цвета фона. Поля. Фреймы. | 11.03.15 |
|
|
| 41 | Формы. Метатеги. | 18.03.15 |
|
|
| 42 | Формы. Метатеги. | 18.03.15 |
|
|
| Раздел 6 . Редакторы сайтов (4)
|
| 43 | Создание нового сайта. Создание новых файлов и папок. Настройка характеристик веб-страницы. | 25.03.15 |
|
|
| 44 | Создание нового сайта. Создание новых файлов и папок. Настройка характеристик веб-страницы. | 25.03.15 |
|
|
| 45 | Фон. Текст. Изображения. Гиперссылки. | 08.04.15 |
|
|
| 46 | Использование таблиц. Использование слоев. Использование фреймов. | 08.04.15 |
|
|
| Раздел 7 . Основы веб-дизайна (4)
|
| 47 | Логотип. Фирменный стиль. Цветовая гамма. Макет дизайна. Верстка и оптимизация веб-страниц. | 15.04.15 |
|
|
| 48 | Информационное наполнение сайта (контент). Заголовки. Текст. Привлечение внимания. Соответствие содержанию. | 15.04.15 |
|
|
| 49 | Термины. Конкретность. Простота. Краткость. Расположение элементов на сайте. Графические элементы. | 22.04.15 |
|
|
| 50 | Логичность изложения. Орфография. Анимация. Баннеры. | 22.04.15 |
|
|
| Раздел 8. Дополнительные возможности создания веб-страниц (4)
|
| 51 | Каскадные таблицы стилей.
| 29.04.15 |
|
|
| 52 | Каскадные таблицы стилей.
| 29.04.15 |
|
|
| 53 | Создание таблицы стилей.
| 06.05.15 |
|
|
| 54 | Создание таблицы стилей.
| 06.05.15 |
|
|
| Раздел 9. Проектирование сайта (6) |
| 55 | Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. Защита выполненных проектов. | 13.05.15 |
|
|
| 56 | Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. Защита выполненных проектов. | 13.05.15 |
|
|
| 57 | Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. Защита выполненных проектов. | 20.05.15 |
|
|
| 58 | Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. Защита выполненных проектов. | 20.05.15 |
|
|
| 59 | Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. Защита выполненных проектов. | 27.05.15 |
|
|
| 60 | Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. Защита выполненных проектов. | 27.05.15 |
|
|
Учебно-методический комплект
14
555
79 384 
