Муниципальное автономное образовательное учреждение
«Школа №152 для обучающихся с ограниченными возможностями здоровья»
г. Перми
| ПРИНЯТО на педагогическом совете МАОУ «Школа №152 для обучающихся с ограниченными возможностями здоровья» г.Пермь Протокол №__ от «__» _____20__г | УТВЕРЖДАЮ Директор МАОУ «Школа №152 для обучающихся с ограниченными возможностями здоровья» г.Пермь Щелконогова Т.В. ___________________
Приказ №___ от «__» ________20__г |
Долгосрочный обязательный курс по выбору
Создание web-сайта
Ответственные за реализацию программы:
Составитель:
Кураторы:
Место проведения: кабинет№12
Пермь 2017
Паспорт программы
ПРОФЕССИЯ:
web-мастер.
РОДСТВЕННЫЕ ПРОФЕССИИ:
web-программист, web-дизайнер, SEO-специалист.
ПЕРСПЕКТИВЫ КАРЬЕРНОГО РОСТА:
Карьерный рост связан с повышением мастерства и накоплением профессионального опыта, что требует освоения смежных профессий, получения дополнительного образования.
СФЕРа ПРОФЕССИОНАЛЬНОЙ ДЕЯТЕЛЬНОСТИ:
Информационные технологии
Связь
КЛАССИФИКАЦИЯ ПРОФЕССИИ:
Тип профессии по предмету труда: «Человек – Знаковая система».
Тип профессии по признаку цели: изыскательский.
Тип профессии по средствам труда: профессия, связанная с применением автоматизированных и автоматических систем.
Тип профессии по условиям труда: работа в «комнатных» условиях.
Класс профессии: творческий (эвристический); по характеру труда профессия web-мастера связана с анализом, планированием, организацией и управлением, конструированием, принятием нестандартных решений; профессия требует высокой эрудиции, оригинальности мышления, стремления к развитию и постоянному обучению.
ТРЕБОВАНИЯ К ИНДИВИДУАЛЬНЫМ ОСОБЕННОСТЯМ СПЕЦИАЛИСТА:
Должен обладать такими личностными качествами, как ответственность, честность, аккуратность, терпеливость, выдержанность, выносливость. Для успешного овладения профессией необходимо творческое начало, развитое воображение, оригинальность и изобретательность.
К профессионально важным качествам относятся: относятся: логическое мышление; гибкость и динамичность мышления; аналитические способности; хорошая память; математические и технические способности.
МЕДИЦИНСКИЕ ПРОТИВОПОКАЗАНИЯ:
Профессия не рекомендуется людям, страдающим: заболеваниями опорно-двигательного аппарата, нервной системы, органов зрения, иммунной системы; психическими расстройства.
УСЛОВИЯ ТРУДА
Web-мастер могут работать самостоятельно или в коллективе (IT-компании).
Web-мастер может работать на дому, выполнять частные заказы (например, создавать сайты для некрупных фирм и компаний и осуществлять их техническую поддержку).
Web-мастер проводит рабочий день в помещении. Работа происходит преимущественно сидя.
Web-мастер использует персональный компьютер с возможностью выхода в Интернет. Рабочее место должно быть хорошо освещено; должна быть обеспечена возможность регулярного проветривания.
Условия труда на рабочих местах специалистов с ограниченными возможностями здоровья должны соответствовать индивидуальной программе реабилитации инвалида, разрабатываемой бюро медико-социальной экспертизы (при наличии инвалидности). Конструкция всех элементов производственного оборудования и организация рабочего места должны соответствовать антропометрическим, физиологическим и психологическим особенностям и ограниченным возможностям работающих инвалидов.
Специальная форма для web-мастера не предусмотрена.
ПРОФЕССИОНАЛЬНЫЕ РИСКИ
Рабочая поза – положение сидя. Долговременное нахождение в положении сидя может привести к заболеваниям, сопровождающимся болями в спине и шее.
Постоянная работа с компьютером может вызвать заболевания зрительной системы.
В связи с тем, что в последнее время особенно бурно на всем земном шаре идет процесс информатизации, и все больший вес приобретают науки, связанные с общением, информатизационными и коммуникационными процессами, данный курс становится актуальным и востребованным. Все больший вес в жизни людей занимает интернет и технологии, связанные с работой в сети, умение создавать Web-сайты.
Современному человеку требуется не только определенный набор знаний, а умения самостоятельно приобретать недостающие, применять их в жизни. Одним из таких умений является умение работать с компьютером.
Темпы развития информатизации общества обгоняют учебные планы, школьную программу. В основной школе на эти темы отводится недостаточно времени, нет возможности организовать индивидуальную работу.
В проекте федерального компонента государственного стандарта общего образования по информатике и информационным технологиям изучение информатики должно преследовать следующие цели:
Освоение знаний составляющих основу научных представлений об информации и информационных процессах
Овладение умениями работать с различными видами информации
Развитие познавательных интересов, интеллектуальных и творческих способностей средствами информационных и коммуникационных технологий
Воспитание ответственного и избирательного отношения к информации
Выработка навыков применения средств ИКТ в повседневной жизни, при выполнении индивидуальных и коллективных проектов, в учебной деятельности, при дальнейшем освоении профессий, востребованных на рынке труда.
Одна из задач обучения информатике состоит в содействии прогрессивному изменению личностных качеств и свойств нового поколения в направлении, соответствующем стилю жизнедеятельности в условиях информационного общества. Поэтому основной задачей учебных курсов информационно-технологической направленности является обогащение индивидуальности учащихся и высвобождение их творческого потенциала в процессе освоения средств информационных технологий.
Учебный курс «Технологии создания web - сайтов» является предметом по выбору для учащихся 8-9 класса. На изучение курса отводится 35 часов.
Данный элективный курс связан, прежде всего, с удовлетворением индивидуальных образовательных интересов, потребностей и склонностей учащихся в зависимости от их интересов, способностей, последующих жизненных планов.
Цели и задачи программы
Основные цели курса по отношению к деятельности учащихся
Освоить элементарные способы проектирования, конструирования, размещения и сопровождения web-сайта в сети Интернет.
Приобрести первичные навыки программирования на языке HTML
Познакомиться с основами web-дизайна и научиться применять их при разработке web-страниц.
Создать собственный web-сайт (web-страницы) по выбранной тематике.
Задачи курса
Познакомиться с видами web-сайтов, их функциональными, структурными и технологическими особенностями.
Научиться ориентироваться и продуктивно действовать в информационном интернет-пространстве, используя для достижения своих целей создаваемые web-ресурсы.
Сформировать целостное представление об информационной картине мира средствами «Всемирной паутины». Научиться способам представления информации в сети Интернет.
Изучить способы научно-технического мышления и деятельности, направленные на самостоятельное творческое познание и исследование информационной части сетевого пространства.
Реализовать коммуникативные, технические и эвристические способности в ходе проектирования и конструирования сайтов.
Овладеть элементами информационной и телекоммуникационной компетенций по отношению к знаниям, умениям и опыту конструирования web-сайтов.
Овладеть навыками работы в коллективе с комплексными web-проектами.
Планируемые результаты курса
В рамках курса «Создание web-сайтов» учащиеся овладевают следующими знаниями, умениями и способами деятельности:
знают принципы и структуру устройства Всемирной паутины, формы представления и управления информацией в сети Интернет;
умеют найти, сохранить и систематизировать необходимую информацию из Сети с помощью имеющихся технологий и программного обеспечения;
умеют спроектировать, изготовить и разместить в сети web-сайт объёмом 3—4 страниц на заданную тему;
владеют способами работы с изученными программами;
владеют приёмами организации и самоорганизации работы по изготовлению сайта;
имеют опыт коллективной разработки и публичной защиты созданного сайта;
Предметом контроля и оценки являются внешние образовательные продукты учеников. Качество ученической продукции оценивается следующими способами:
По количеству творческих элементов в сайте;
По степени его оригинальности;
По относительной новизне сайта для ученика или его одноклассников;
По емкости и лаконичности созданного сайта по его интерактивности;
По практической пользе сайта и удобству его использования.
Необходимое материально-техническое обеспечение:
Компьютерное рабочее место
мультимедийный проектор
Любой текстовый редактор
Браузер
Используемые образовательные технологии
Для успешной реализации образовательного процесса по курсу «Создание web-сайтов» и повышения его эффективности используются как традиционные педагогические технологии, так и методы активного обучения: практические занятия профессиональной направленности, проблемное занятие, моделирование.
Удельный вес занятий, проводимых с использованием активных и интерактивных методов обучения, составляет 90 %.
Форма итоговой аттестации
Итоговая аттестация проводится в форме выполнения итоговой практической работы. Форма и условия проведения итоговой практической работы доводятся до сведения слушателей курса в начале обучения. Аттестационной комиссией проводится оценка освоенных слушателями профессиональных компетенций в соответствии с критериями, утвержденными образовательным учреждением. Лицам, прошедшим соответствующее обучение в полном объеме и итоговую аттестацию, образовательным учреждением выдается документ (сертификат) установленного образца.
В ходе выполнения итоговой практической работы оцениваются следующие самостоятельные умения:
По количеству творческих элементов в сайте;
По степени его оригинальности;
По относительной новизне сайта для ученика или его одноклассников;
По емкости и лаконичности созданного сайта по его интерактивности;
По практической пользе сайта и удобству его использования.
Тематическое планирование
| № | Наименование разделов, блоков, тем | Количество часов учебных занятий |
|
|
|
|
| Всего, час | Теория | Практика |
|
| Раздел 1. Моя веб-страничка | 6 | 2 | 4 |
| 1-2 | Введение. Техническая часть. Теги HTML. Структура веб-страницы | 2 | 1 | 1 |
| 3 | Заголовок документа Тело документа Атрибуты тегов Цвет фона. | 1 | 0,5 | 0,5 |
| 4-5 | Размер и форма шрифта. Теги форматирования текста. Взаимодействие тегов Текстовые блоки. | 1,5 | 0,5 | 1 |
| 6 | Заголовки. Абзацы. Перевод строки. Разделительная линия. | 1,5 | 0,5 | 1 |
|
| Раздел 2. Графика | 2 | 1 | 1 |
| 7 | Рисунки и фотографии в сети Интернета. Параметры графического файла. Форматы графических файлов. Растровые форматы JPEG, GIF, PNG. | 0,5 | 0,5 | - |
|
| Достоинства растрового формата. Недостатки. Векторные форматы. | 0,5 | 0,5 | - |
| 8 | Связывание графического файла с HTML-документом. Изображения в HTML-документе. Дополнительная информация. | 1 | - | 1 |
|
| Раздел 3 . Гипертекстовый документ | 3 | 1 | 2 |
| 9 | Гипертекстовые ссылки. Текстовые ссылки. Изображения-ссылки. | 1 | - | 1 |
| 10 | Абсолютные адреса. Относительные адреса. Внутренние ссылки. Задание цвета ссылок на веб-странице ссылок. Ссылка на адрес электронной почты. | 1 | - | 1 |
| 11 | Задание цвета отдельных ссылок. Цвет и наличие рамок у изображений. | 1 | - | 1 |
|
| Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. |
|
|
|
|
| Раздел 4. Виды сайтов | 4 | 1 | 3 |
| 12 | Виды сайтов, их назначение. | 1 | 0,5 | 0,5 |
| 13 | Способы организации информации. Полнота информации и ее обновление. | 1 | 0,5 | 0,5 |
| 14 | Графический и технический дизайн. Навигация. Скорость загрузки страниц и определяющие факторы. | 1 | - | 1 |
| 15 | Интерактивность сайта. Интернет-технологии. Исследование действующих сайтов. Критерии оценки сайтов. | 0,5 | - | 0,5 |
|
| Раздел 5. Основы HTML | 8 | 4 | 4 |
| 16-17 | Таблицы. Лишние ячейки. Пустые ячейки. Вложенные таблицы. | 2 | 1 | 1 |
| 18-19 | Объединение ячеек. Разделение ячейки. | 2 | 1 | 1 |
| 20-21 | Цвета фона. Поля. Фреймы. | 2 | 1 | 1 |
| 22-23 | Формы. Метатеги. | 2 | 1 | 1 |
|
|
|
|
|
|
|
| Раздел 6 . Редакторы сайтов | 2 | 1 | 1 |
| 24 | Создание нового сайта. Создание новых файлов и папок. Настройка характеристик веб-страницы. | 1 | 1 | - |
| 25 | Фон. Текст. Изображения. Гиперссылки. | 1 |
| 1 |
|
| Использование таблиц. Использование слоев. Использование фреймов. |
| - |
|
|
| Раздел 8 . Основы веб-дизайна | 4 | 1 | 3 |
| 26 | Логотип. Фирменный стиль. Цветовая гамма. Макет дизайна. Верстка и оптимизация веб-страниц. | 1 | 1 | - |
| 27 | Информационное наполнение сайта (контент). Заголовки. Текст. Привлечение внимания. Соответствие содержанию. | 1 | - | 1 |
| 28 | Термины. Конкретность. Простота. Краткость. Расположение элементов на сайте. Графические элементы. | 1 | - | 1 |
| 29 | Логичность изложения. Орфография. Анимация. Баннеры. | 1 | - | 1 |
|
| Раздел 9. Дополнительные возможности создания веб-страниц (2 часа) | 2 | 1 | 1 |
| 30 | Каскадные таблицы стилей. | 1 | 1 |
|
| 31 | Создание таблицы стилей. | 1 |
| 1 |
|
| Раздел 9. Проектирование сайта | 3 |
| 3 |
| 32-34 | Творческая работа – создание сайта «Мой класс», «Наш фэн-клуб» и т.п. Защита выполненных проектов. | 3 |
| 3 |
Содержание курса
1. Моя веб-страничка (6 часов)
Основные понятия: гипертекст, HTML, тег, браузер, веб-страница, разметка, структура документа, заголовок, тело.
Содержание темы:
Техническая часть. Что необходимо для работы.
Теги HTML
Структура веб-страницы
Заголовок документа
Тело документа
Атрибуты тегов
Цвет фона
Изображение как фон
Цвет текста
Цвета
Размер и форма шрифта
Теги форматирования текста
Взаимодействие тегов
Текстовые блоки
Заголовки
Абзацы
Перевод строки
Разделительная линия
Обобщение
Творческая работа "Самопрезентация"
Самооценка
2. Графика (2часа)
Основные понятия: растровый формат, векторный формат, метафайлы, рамка изображения, выравнивание, обтекание.
Содержание темы:
Рисунки и фотографии в сети Интернет
Параметры графического файла
Форматы графических файлов
Растровые форматы
JPEG
GIF
PNG
Достоинства растрового формата
Недостатки
Векторные форматы
Достоинства
Недостатки
Метафайлы
Дополнительная информация
Графические редакторы
Как создать графический файл для веб-страницы
Прозрачная графика
Связывание графического файла с HTML-документом
Изображения в HTML-документе
Дополнительная информация
В помощь читателям веб-страниц
В помощь дизайнерам
Обобщение
Творческая работа "Сделай красиво!"
Самооценка
3. Гипертекстовый документ (3 часов)
Основные понятия: организация информации, гипертекстовые ссылки, внутренние ссылки, активные ссылки, посещенные ссылки, абсолютные адреса, относительные адреса.
Содержание темы:
Способы организации гипертекстовых документов
Разработка сценария гипертекстового документа, состоящего из нескольких файлов
Гипертекстовые ссылки
За пределами документа
Текстовые ссылки
Изображения-ссылки
Главный тег интернета
Абсолютные адреса
Относительные адреса
Новое окно
Внутренние ссылки.
Задание цвета ссылок на веб-странице
Задание цвета отдельных ссылок
Цвет и наличие рамок у изображений ссылок
Ссылка на адрес электронной почты
Обобщение
Творческая работа. Выполнение и защита проекта на одну из тем (сайт "Мой класс", "Наш фэн-клуб" и т.п.)
Самооценка
4. Виды сайтов (4 часа)
Основные понятия: Виды сайтов, критерии оценки, дизайн, навигация, эргономика, юзабилити, интерактивность.
Содержание темы:
Типы сайтов, их назначение.
Способы организации информации.
Оптимизация веб-страниц.
Удобство использования сайта.
Основные методы юзабилити.
Восприятие информации.
Критерии оценки сайтов.
Юзабилити.
Структура и навигация.
Контент (содержание).
Внешний вид.
Обратная связь. Интерактивность.
Обобщение
Творческая работа. Доработка оценочной таблицы и исследование выполненных проектов.
Самооценка
Рефлексия
5. Основы HTML (8 часов)
Основные понятия: списки, таблицы, фреймы, формы.
Содержание темы:
Таблицы.
Лишние ячейки. Пустые ячейки
Объединение ячеек. Разделение ячейки.
Вложенные таблицы
Цвета фона.
Цвет рамки.
Поля.
Фреймы
Как работают фреймы.
Достоинства фреймов.
Недостатки фреймов.
Создание фреймов.
Ссылки внутри фреймов.
Рамки.
Изменение размеров.
Полосы прокрутки.
Плавающие фреймы.
Фреймы – хорошо или плохо?
Формы
Добавление формы на страницу.
Кнопки.
Submit.
Reset.
Обобщение
Творческая работа. Выполнение и защита проекта на тему по выбору.
Самооценка
6. Редакторы сайтов (2 часов)
Основные понятия: Редактор веб-страниц, активные элементы, динамический язык, баннер, сервер.
Содержание темы:
Создание нового сайта
Настройка характеристик веб-страницы
Фон
Текст
Изображения
Гиперсылки
Настройка предпочтений для редактирования сайта
Использование таблиц
Использование слоев
Использование фреймов
Панель навигации
Доступ к HTML-коду веб-страницы
Самооценка
7. Дополнительные возможности создания веб-страниц (2 часов)
Основные понятия: каскадные таблицы стилей, CSS, селектор, Flash, символ, клип, кнопка, анимация движения, анимация формы, Dynamic HTML, интерактивность, сценарии, статические и динамические страницы, активные элементы.
Содержание темы:
Назначение CSS.
Каскадные таблицы стилей.
Основы CSS.
Цвет в CSS.
Размер в CSS.
Комментарии.
Создание таблицы стилей.
Синтаксис.
Наследование.
Контекстные селекторы.
Шрифт и текст.
Фон.
Применение таблиц стилей к части страницы
Классы. Подклассы.
Личный тег
Строковый элемент
Блочный элемент
Свойства блоков
Граница (border)
Обтекание блока текста
Позиционирование.
Избранные страницы. Стиль персональный
Применение стиля для тега.
Взаимодействие стилей.
Каскадность стилей и приоритеты.
Ссылки как украшение.
ID-клaccы.
Способы задания стиля.
Flash.
Динамический HTML.
Творческая работа "Технический проект".
Самооценка.
Рефлексия.
9. Основы веб-дизайна (4 часов)
Основные понятия: Дизайн, векторная и растровая графика, графический редактор, инструменты, фильтры, графические примитивы, палитра цветов, формат графического файла, заголовки, текст, разделы, ссылки, термины, эффективность рекламы.
Содержание темы:
Элементы веб-страницы.
Информационная архитектура.
Макет страницы.
Модульная сетка. Виды сеток.
Текст.
Оформление ссылок.
Форматирование текста.
Понятность и читаемость текста.
Основные элементы текста.
Фон.
Графические элементы.
Навигационная система. Типы.
Логотип.
Интерактивность.
Особенности начальной страницы.
Основные принципы веб-дизайна.
Уменьшение размера текста и графики.
Разделение пространства страницы.
Исключение длинных колонок.
Изображения в миниатюре.
Управление внешним видом сайта.
Совмещение неизменных и различающихся элементов сайта.
Фон.
Текст.
Месторасположение эмблемы и навигационных элементов.
Тема, название и заголовки.
Изображения.
Внесение разнообразия.
Повторение стандарта.
Композиция веб-страницы.
Основные правила композиции.
Средства композиции.
Цвет.
Психология цвета.
Отдельные цвета.
Средства веб-дизайна.
Инструменты веб-дизайнера.
Это может быть интересным.
Обобщение.
Web-мастеру: полезные советы.
Web-мастеру: правила хорошего HTML.
Web-мастеру: Что такое стильный дизайн?
Web-мастеру: Шрифтовое оформление в web-дизайне.
Web-мастеру: Главные ошибки в web-дизайне.
Web-мастеру: Юзабилити. Неписаные правила.
На заметку.
Творческая работа "Сайт класса должен быть классным!"
Самооценка.
Рефлексия.
11. Зачетная работа (4 часов)
Основные понятия: Веб-студия: заказчик, арт-директор, веб-мастер, кодер, программист, верстальщик, менеджер. Техническое задание. Разделение труда. Проектирование, изготовление, размещение, тестирование сайта. Экспертная оценка.
Содержание темы:
Выбор темы сайта.
Заказчик сайта.
Создание команды. Распределение функций.
Техническое задание.
Этапы и сроки выполнения работ.
Разработка сайта. Особенности групповой деятельности разработчиков сайта.
Экспертная оценка. Защита проекта. Акт сдачи-приемки работы.
Самооценка и оценка.
Список литературы
А. В. Матросов, А. О. Сергеев, М. П. Чаунин. HTML 4.0. – СПб.: БХВ-Петербург, 2003 – 672c.
Дригалкин В.В. HTML в примерах. Как создать свой Web-сайт: Самоучитель / В.В.Дригалкин. – М.: Издат. дом «Вильямс», 2003. – 192 с.: ил.
Дригалкин В.В. HTML в примерах. Как создать свой Web-сайт: Самоучитель / В.В.
Кузнецов М.В. PHP 5. Практика разработки Web-сайта / М.В. Кузнецов, И.В. Симдянов, С.В. Голышев. – СПБ.: БХВ-Петербург, 2005. – 960 с.: ил.
П. Б. Храмцов, С. А. Брик, А. М. Русак, А. И. Сурин. Основы Web-технологий. – М.: ИНТУИТ.РУ, 2003 – 512с.
Угринович Н. Информатика и информационные технологии. М.: Бином. Лаборатория Знаний, 2002.
Штайнер, Г. HTML/XML/CSS / Г. Штайнер. – 2-е изд., перераб. – М.: Лаборатория Базовых Знаний, 2005. – 510 с.: ил.
