Сергеева Диана Лазаревна учитель информатики средней школы №10 г. Ярцево 2007 г. Содержание: пояснительная записка

Вид материала

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

Содержание Итоговый контроль Содержание курса Глава II. Изображения и таблицы на Web-странице (4 ч) Глава IV. Планирование и размещение Web-сайта в Интернете (4 ч) Глава III. Творческий проект (4 ч). Учебно-тематический план курса. Создание Web-страницы (5 ч) Изображения и таблицы на Web-странице (4 ч) Планирование и размещение Web-сайта в Интернете (3 ч) Творческий проект(5 ч) Наименование образовательного продукта. Список литературы для учителя. Занятие 1. Принципы создания Web-страниц и Web-сайтов. План занятия. Деятельность учащихся Ход занятия. Учащимся предлагается список вопросов, на которые они должны будут самостоятельно записать ответы в тетради в ходе прослушивания Далее следует демонстрация сайта «История Ярцева до XX века». Демонстрация сопровождается поясняющим рассказом. Ключевые теги языка HTML Тег (tag-указатель,метка)- это код элемента HTML. ... Полное содержание

Подобный материал:

• Пояснительная записка 4 Содержание программы 7 Требования к уровню подготовки выпускников, 97.02kb.
• Богданова Виктория Алексеевна bogdanov@belnet ru учитель информатики муниципальной, 62.51kb.
• Мусихин Александр Александрович, учитель физики высшей категории Воркута 2007 пояснительная, 249.87kb.
• Пояснительная записка Рабочая программа составлена на основе: авторского планирования, 143.68kb.
• Гусельникова Лидия Ивановна, учитель 1 категории Петуховской средней общеобразовательной, 909.18kb.
• Чеботарева Фаина Мэлсовна учитель математики высшей категории средней общеобразовательной, 155.8kb.
• Кустова Ольга Анатольевна, учитель истории и обществознания Уренгой, 2007 пояснительная, 173.36kb.
• Пояснительная записка Программа данного элективного курса рассчитана на 16 часов. Элективный, 74.11kb.
• Киселева Мария Геннадьевна учитель информатики моу сош №2 им. И. А. Сухана г. Кстово, 328.22kb.
• Киселева Мария Геннадьевна учитель информатики моу сош №2 им. И. А. Сухана г. Кстово, 428.62kb.

Ярцевская муниципальная общеобразовательная средняя (полная) школа №10

г.Ярцево

Смоленская область


Элективный курс по информатике

для предпрофильной подготовки

Создаем и размещаем в Интернете

Web-сайт о городе Ярцево.


Вид элективного курса: предметно-ориентированный


Сергеева Диана Лазаревна

учитель информатики

средней школы №10


г. Ярцево

2007 г.


Содержание:

1. Пояснительная записка 2
   
2. Содержание курса 7
   
3. Учебно-тематический план курса 10
   
4. Наименование образовательного продукта 12
   
5. Список литературы для учителя и учащихся 13
   
6. Учебный модуль «Создание Web-страницы» 15
   
7. Учебный модуль «Графические изображения и 49
   

таблицы на Web-странице».

8. Учебный модуль «Планирование и размещение 75
   

Web-сайта в Интернете».

9. Учебный модуль «Творческий проект» 91


Элективный курс «Создаем и размещаем в Интернете Web-сайт о

городе Ярцево».

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

Элективный курс «Создаем и размещаем в Интернете Web-сайт о городе Ярцево» является предметом по выбору для учащихся 9 классов средней школы и рассчитан на 17 часов.

Курс включает в себя практическое освоение техники создания Web-страниц и Web-сайтов. Web-сайт – это наиболее популярное и доступное средство представления информации в Интернете. Освоив технологию создания Web-сайтов, учащиеся смогут пополнить информационное пространство Интернета.

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

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

Построение курса на основе материала о своей малой родине способствует повышению эффективности процесса патриотического воспитания учащихся.

Курс предполагает межпредметные связи с историей Смоленщины.

При обучении созданию сайтов затрагиваются вопросы оформления Web-дизайна. Работа над созданием Web-дизайна – это ярко выраженное творчество. Именно в сфере Web-дизайна учащиеся смогут проявить свои творческие способности.

Цели курса:

• Научить способу представления информации в WWW;
  
• Развивать познавательные интересы, коммуникативные, технические и творческие способности учащихся в ходе проектирования и конструирования сайтов;
  
• Помочь определится в выборе профессии по компьютерной специальности «Создание HTML-документов. Основы Web-дизайна»;
  
• Способствовать формированию патриотических чувств учащихся.
  

Задачи курса:

• Сформировать навыки элементарного проектирования, конструирования и размещения Web-сайта;
  
• Научить использовать возможности языка HTML для создания Web-сайтов
  
• Познакомить с основами Web-дизайна;
  
• Создать и разместить в Интернете Web-сайт на основе материала о своей малой родине – городе Ярцево
  

В результате изучения курса учащиеся

могут узнать:

• Назначение Web-страниц и Web-сайтов;
  
• Основные возможности языка HTML для создания Web-страниц;
  
• Правила проектирования Web-сайта;
  
• Виды Web-хостинга;
  
• Правила оформления Web-дизайна.
  

могут научиться:

• Создавать Web-страницы;
  
• Создавать гипертекстовый документ, состоящий из нескольких файлов;
  
• Размещать графические изображения на Web-странице;
  
• Производить разметку Web-страницы с использованием таблицы;
  
• Размещать Web-сайт в службе WWW.
  

При изучении базовой программы по учебнику Угриновича Н.Д. «Информатика – 9» предполагается краткое знакомство учащихся с технологией создания Web-страниц. Но при этом остаются нераскрытыми вопросы проектирования, оформления дизайна сайта и размещения его в Интернете.

Курс позволяет учащимся получить знания по этим вопросам и раскрыть свои способности в этой области.

К принципиально новому для учащихся материалу курса относится:

• Вставка таблицы в Web-документ
  
• Использование таблицы для разметки Web-страницы
  
• Правила оформления дизайна сайта
  
• Проектирование сайта
  
• Размещение сайта в Интернете
  

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

Для реализации методики проектно-модульного обучения курс разбивается на отдельные учебные модули. Каждый модуль охватывает изучение отдельной информационной технологии или ее части. Изучение каждого модуля начинается с постановки задачи – характеристики проекта, который предстоит создать ученикам. С этой целью учитель проводит лекции, мультимедийные презентации, Web-экскурсии. Далее проводится первичное закрепление знаний в форме лабораторной работы на компьютере. При выполнении лабораторной работы ученик опирается на указания к ее выполнению, разработанные учителем.

В ходе обучения учащимся предлагаются короткие (5-7 мин) тестовые работы, направленные на проверку полученных знаний.

Изучение учебного модуля завершается созданием и защитой проектов, разработанных учениками индивидуально или в группах (2-3 человека).

Проектно-модульная методика обучения обладает рядом преимуществ:

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

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

В начале курса каждому учащемуся предлагается самостоятельно в течение всего времени изучения курса собрать материал для разработки проекта в форме Web-сайта по интересующей его теме о г.Ярцево.

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

• практическая польза сайта
  
• удобство просмотра сайта
  
• творческие элементы при оформлении дизайна сайта
  
• емкость и лаконичность сайта
  
• качество доклада
  

Для изучения данного курса необходимы персональные компьютеры с установленным текстовым редактором Блокнот и браузером Microsoft Internet Explorer. Для отдельных занятий необходим доступ в Интернет. Для демонстрации проектов и для объяснения материала желательно использовать мультимедийный проектор.

Курс сопровождается методическими пособиями как для учителя

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

Курс «Создаем и размещаем в Интернете Web-сайт о городе Ярцево» является результатом продолжения работы над курсом «Создание Web-страниц», разработанным мною годом раньше. Курс «Создание Web-страниц» был апробирован на базе средней школы № 10 г. Ярцево Смоленской области в 2006/2007 учебном году. Курс «Создание Web-страниц» пользовался большой популярностью среди учащихся 9-х классов. Многие из них впоследствии выбрали формой итоговой аттестации творческие проекты. Ученики оформляли экзаменационные творческие проекты в форме Web-сайта.

Два ученика представили свои работы на областной конкурс Web-дизайна в 2007 г и были отмечены дипломами за участие. Это были работы «Героическая оборона Смоленска в 1609-1611 г.» и «История Ярцева до XX века». По окончании областного конкурса Web-дизайна ребята решили продолжить работу над созданием сайта с рассказом о истории г.Ярцева. Ученики дополнили проект информацией о истории г.Ярцево в XX веке, изменили дизайн сайта. В результате был создан Web-сайт «История г.Ярцево», который ребята собираются представлять в декабре 2007 г. на ярцевский конкурс информационных технологии.


В ходе работы над конкурсными проектами у меня зародилась идея создания элективного курса «Создаем и размещаем в Интернете Web-сайт о городе Ярцево».

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

Содержание курса

Глава I. Создание Web-страницы (5 ч)

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

Основные понятия: гипертекст, HTML, тег, браузер, Web-страница, заголовок документа, тело документа, теги форматирования шрифта, теги форматирования абзаца, гипертекстовые ссылки, абсолютные адреса, относительные адреса.

Содержание главы:

Что такое Web-страница и Web-сайт

Для чего нужен браузер и HTML

Теги HTML

Структура Web-страницы

Заголовок документа

Тело документа

Лабораторная работа «Создаем первую Web-страницу»

Текстовые блоки: заголовки, абзацы, перевод строки,

Разделительная линия

Лабораторная работа «Форматирование текстовых блоков на Web-странице. Современное Ярцево»

Цвет текста

Размер шрифта

Лабораторная работа «Работа со шрифтами на Web-странице. Современное Ярцево»

Гипертекстовые ссылки

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

Лабораторная работа «Гиперссылки на Web-страницах. Знаменитые ярцевчане.»

Творческий проект по теме «Знаменитые ярцевчане».


Глава II. Изображения и таблицы на Web-странице (4 ч)

В этой главе вы узнаете, как вставлять изображения и таблицы на Web-страницы. Научитесь управлять их видимыми размерами и расположением на странице. Также вы узнаете, как использовать таблицы для оформления Web-страницы. Дополните свою Web-страницу изображением и таблицей.

Основные понятия: формат графического файла, вставка изображения в Web-документ, выравнивание изображения, размер изображения, таблица, столбец таблицы, ячейка таблицы, форматирование таблицы

Содержание главы:

Рисунки и фотографии в Интернете

Параметры изображения

Теги ширины и высоты изображения

Теги расположения изображения

Лабораторная работа «Вставляем изображение на Web-страницу. Памятники Ярцева»

Создание таблицы.

Форматирование таблицы.

Таблица как инструмент Web-дизайна.

Лабораторная работа «Используем таблицы на Web-странице. Герб Ярцева»

Лабораторная работа «Табличная разметка Web-страницы».

Творческая работа «Мои знаменитые земляки», «Ярцевчане, именами которых названы улицы нашего города», «Знаменательные события на ярцевской земле», «Ярцево во время Великой Отечественной войны»

Глава IV. Планирование и размещение Web-сайта в Интернете (4 ч)

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

Основные понятия: структура сайта, веб-хостинг, регистрация, загрузка файла, управление файлами, тестирование сайта.

Содержание главы:

Разработка структуры сайта

Сборка файлов Web-сайта

Удобство навигации

Особенности Web-дизайна

Корректность ссылок

Графика

Скорость загрузки

Бесплатный хостинг

Платный хостинг

Лабораторная работа «Оценка дизайна Web-сайта».

Выбор Web-сервера для размещения сайта

Размещение Web-сайта в Интернете

Лабораторная работа « Размещаем Web-страницу в Интернете»

Глава III. Творческий проект (4 ч).

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

Основные понятия: тема и структура Web-страницы, проектирование, изготовление, тестирование Web-страницы.

Содержание главы:

Выбор темы творческого проекта

Поиск и сбор информации по выбранной теме

Распределение работы между разными учениками

(содержательная и техническая части)

Защита выполненных проектов.

Самооценка и оценка.

Учебно-тематический план курса.

№	Тема	Компьютерный практикум.
Создание Web-страницы (5 ч)
1	Принципы создания Web-страниц и Web-сайтов	Лабораторная работа «Знакомство с ключевыми тегами языка HTML»
2	Форматирование текстовых блоков на Web-странице.	Лабораторная работа «Форматирование текстовых блоков на Web-странице. Современное Ярцево»
3	Работа со шрифтами	Лабораторная работа «Работа со шрифтами на Web-странице. Современное Ярцево»
4	Гипертекстовые ссылки	Лабораторная работа «Гиперссылки на Web-страницах. Знаменитые ярцевчане»
5	Контрольный творческий проект «Знаменитые ярцевчане».	Практическая работа «Знаменитые ярцевчане».
Изображения и таблицы на Web-странице (4 ч)
6	Вставка изображения на Web-страницу. Управление размерами и положением изображения на Web-странице.	Лабораторная работа «Вставка изображения на Web-страницу. Памятники Ярцева»
7	Создание таблицы на Web-странице.	Лабораторная работа «Используем таблицы на Web-странице. Герб Ярцева»
8	Таблица как инструмент Web-дизайна. Цвет и фон таблицы.	Лабораторная работа «Табличная разметка Web-страницы».
9	Контрольный творческий проект «Изображения и таблицы на Web-странице»	Практическая работа «Изображения и таблицы на Web-странице».
Планирование и размещение Web-сайта в Интернете (3 ч)
10	Основные этапы создания Web-сайта
11	Особенности Web-дизайна.	Лабораторная работа «Оценка дизайна Web-сайта».
12	Размещение сайта в Интернете. Веб-хостинг.	Лабораторная работа «Размещаем Web-сайт в Интернете»
Творческий проект(5 ч)
13	Формулировка темы. Поиск и сбор информации по выбранной теме. Использования для поиска информации поисковых служб Интернет.	Практическая работа «Используем поисковые службы Интернет для поиска информации».
14	Работа над проектом	Практическая работа «Создание итогового творческого проекта».
15	Работа над проектом	Практическая работа «Создание итогового творческого проекта».
16	Работа над проектом.	Практическая работа «Размещение Web-сайта в Интернете».
17	Защита проекта

Наименование образовательного продукта.

Название проекта	Описание проекта
Знаменательные события на ярцевской земле.	Web-сайт должен рассказывать о знаменательных исторических событиях на ярцевской земле.
Мои знаменитые земляки.	|Web-сайт должен повествовать о ярцевчанах, оставивших неизгладимый след в истории нашей страны.
Ярцево в пламени Великой Отечественной Войны.	Web-сайт должен рассказывать о положении Ярцева и ярцевчан во время Великой Отечественной войны.
Ярцевчане – Герои Советского Союза.	Web-сайт должен рассказывать о наших земляках, заслуживших звание Героя Советского Союза во время Великой Отечественной войны или войны в Афганистане.
Ярцево – развивающийся промышленный город.	Web-сайт должен рассказывать о работе современных промышленных предприятий г.Ярцево и о перспективах развития нашего города.
Ярцево в наши дни.	Web-сайт должен содержать информацию о жизни современных ярцевчан – культурной, спортивной, общественной.
Свободная тема	Тема Web-сайта предлагается учеником. Web-сайт должен рассказывать о г.Ярцеве или о ярцевчанах. Тема проекта должна быть заранее согласована с учителем.

Список литературы для учителя.

1. Хуторский А.В., Орешко А.П. Технология создания сайтов. Профильная школа №3, 2005

2. Гаевский А.Ю., Романовский В.А. – М.: Технолоджи – 3000, 2005

100% самоучитель по созданию Web-страниц и Web-сайтов.

3. Дунаев В.В. Основы Web-дизайна. Самоучитель.- СПб.: БХВ – Петербург, 2006.

4. Юркова Т.А., Ушаков Д.М. Путеводитель по компьютеру для школьника. – СПБ.:Издательский дом Нева,2004.- 480с.

5. Молодцов В.А., Рыжикова Н.Б. Современные открытые уроки информатики. 8-11-е классы. Изд. 2-е, дополненное и переработанное.- Ростов н/Д: изд-во «Феникс», 2003.

6. Шелепаева А.Х. Поурочные разработки по информатике: 8-9 классы.- 2-е изд., перераб. и доп. – М.:ВАКО, 2006.

7. Шелепаева А.Х. Поурочные разработки по информатике: базовый уровень 10-11 классы. – М.:ВАКО, 2006.

8. Ефименков И., Потапенков Н. Город на Вопи., Ярцево: Вести Привопья, 1996г.


Список литературы для учащихся.

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

1. Методическое пособие для учащихся «Создание Web-страницы»

2. Методическое пособие для учащихся «Изображения и таблицы на Web-странице».

3. Методическое пособие для учащихся «Планирование и размещение Web-сайта в Интернете».


Учебный модуль «Создание Web-страницы».

Общеобразовательные цели:

• освоить технологию создания простейших Web-страниц с помощью языка HTML;
  
• освоить технологию проектирования;
  
• закрепить навыки систематизации и структуризации информации.
  

Развивающие цели:

• формировать и развивать приемы умственного труда;
  
• развивать логико-алгоритмического мышление.
  

Воспитательные:

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

Оборудование: компьютерный класс, лицензированное программное обеспечение, мультимедийный проектор, экран.


Занятие 1. Принципы создания Web-страниц и Web-сайтов.

Цели занятия:

познакомить с назначением Web-страницы, Web-сайта, браузера и языка разметки HTML; отразить структуру Web-страницы; показать ключевые теги языка HTML.

План занятия.

Этапы занятия	Деятельность учителя	Деятельность учащихся
Орг.момент	Учитель приветствует учащихся, проверяет их готовность к занятию.	Ученики готовятся к занятию, приветствуют учителя.
Изучение нового материала.	Урок начинается вступительным словом учителя, в котором отмечается, что учащиеся приступают к изучению нового курса и сообщается, какие цели и задачи будут стоять перед школьниками в процессе обучения и каких результатов хотелось бы достичь. Учитель предлагает учащимся вопросы для самостоятельного составления конспекта в ходе прослушивания лекции. Проводит лекцию для знакомства учащихся с новым материалом	Ученики слушают объяснения учителя. Самостоятельно записывают конспект в тетради, опираясь на вопросы учителя.
Закрепление материала.	Учитель знакомит с целями и планом проведения лабораторной работы. Наблюдает за выполнением лабораторной работы. Консультирует учащихся.	Ученики выполняют лабораторную работу за компьютером. При необходимости обращаются за консультацией к учителю.
Итог занятия	Учитель задает вопросы для повторения основных знаний, полученных на занятии.	Ученики отвечают на вопросы учителя.

Ход занятия.

1 Орг.момент.


II. Изучение нового материала.

Ребята, сегодня на занятии вы познакомитесь с принципами создания Web-страниц и Web-сайтов. В заключительной части нашего занятия вы выполните лабораторную работу по созданию своей первой Web-страницы.

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

Вопросы учащимся:

• В каком виде представлена информация в службе WWW?
  
• Что представляет собой Web-сайт?
  
• Какой язык используют для создания Web-сайта?
  
• В чем преимущества HTML-документа?
  
• Как называют программы для просмотра Web-сайта?
  

При изучении темы нашего занятия мы будем обращаться к Web-сайту «История Ярцева до XX века». Этот сайт был создан в прошлом году учениками нашей школы по окончании элективного курса. Вам тоже по окончании курса предстоит создать Web-сайт с рассказом о городе Ярцево.

Далее следует демонстрация сайта «История Ярцева до XX века». Демонстрация сопровождается поясняющим рассказом.

Принципы создания Web-страниц и Web-сайтов.

Информация во всемирной паутине WWW хранится в виде Web-сайтов.

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

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

В нашем случае на титульной странице располагаются гиперссылки на основные разделы сайта «История Ярцева до XX века»:

• Первое упоминание о Ярцеве
  
• Ярцево – одна из деревень Духовщинского уезда
  
• Ярцево – фабричное село
  
• Источники
  

Гиперссылки дают возможность пользователю перемещаться с одного документа на другие связанные с ним документы. Гиперссылкой может быть слово или рисунок. При наведении на гиперссылку мыши её форма изменяется на указательную. При щелчке мышью по ссылке происходит переход на соответствующий документ. На сайте «История Ярцева до XX века» в качестве гиперссылок использованы как рисунки, так и словосочетания. ( Учитель демонстрирует различные формы представления гиперссылок).

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

Создание Web-страниц реализуется с использованием языка разметки гипертекстовых документов HTML (Hyper Text Markup Language). Технология HTML состоит в том, что в обычный текстовой документ вставляются управляющие символы (теги). Учитель демонстрирует HTML-код одной из Web-страницы сайта «История Ярцева до XX века».

Для прочтения Web-страницы используются специальные программы - браузеры. Браузер, установленный на клиентском компьютере, имеет всю информацию о последнем – конфигурация, настройки, разрешение экрана и количество цветов, текущий размер окна, в котором выводится Web-страница. Опираясь на все эти данные и, следуя приказам тегов, браузер преобразует HTML-документ в красочную Web-страницу. Из отдельных файлов добавляются картинки, подключается звук, видео и т.д.

Примеры браузеров: Microsoft Internet Explorer, Opera, Netscape Navigator.

Основными достоинствами HTML-документов являются:

• Малый информационный объем
  
• Возможность просмотра на персональных компьютерах, оснащенных различными операционными системами
  

Для создания Web-страниц используются простейшие текстовые редакторы. В качестве такого редактора можно использовать приложение Windows – Блокнот.

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

Созданную Web-страницу необходимо сохранить в виде файла. Принято сохранять титульный файл сайта, то есть тот, который первый загружается в браузер, под именем index.php. Рекомендуется создать для размещения сайта специальную папку и сохранять все файлы разрабатываемого сайта в этой папке.

Ключевые теги языка HTML

Любая Web-страница представляет собой набор элементов (абзацев, заголовков, гиперссылок, рисунков и проч.).

Элемент – это конструкция языка HTML. Элемент состоит из трех компонент: начального тега, содержимого и конечного тега. В некоторых элементах конечный тег может быть опущен (в случае одиночных тегов).

Тег (tag-указатель,метка)- это код элемента HTML.

Теги определяют границы действия элементов и отделяют элементы друг от друга. В тексте Web-страницы теги всегда заключаются в угловые скобки (<>). Теги могут быть одиночными или парными. Для парных тегов обязательно наличие открывающих <Имя тега> и закрывающих скобок. Такая пара тегов называется контейнером.

Например, HTML-код страницы помещается внутрь контейнера

< HTML>

…

.

По этим тэгам браузер распознает Web-документ.

Web-страница разделяется на две логические части: заголовок и содержание.

Заголовок заключается в контейнер … и содержит справочную информацию о документе и название документа.

Основное содержание страницы помещается в контейнер < Body>…

и может включать текст, таблицы, графические изображения, ссылки на другие страницы.

Приведем пример простейшего HTML-документа. ( HTML-код страницы записать на классной доске перед занятием).













Здесь располагается содержимое Web-страницы.





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

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

Ученики записывают назначение ключевых тегов в тетради.


Ключевые теги языка HTML.

Тег	Назначение тега
	Этот тег указывает на начало HTML-документа
	Этот тег указывает на начало области заголовка Web-страницы. Служит для формирования структуры документа.
	Элемент для размещения заголовка Web-страницы. Строка отображается в заголовке окна браузера.
	Этот тег несет служебную информацию и не отображается в экране браузера. В данном случае идет речь о кодировке Web-странички. Вам достаточно лишь каждый раз вставлять этот тег в таком виде на свою страничку. Тогда ваша страничка будет использовать кодировку Windows-1251, наиболее распространенную на сегодняшний день.
	Конец области заголовка Web-страницы.
	Начало содержания Web-страницы. Содержание Web-страницы отразится в окне браузера.
	Конец содержания Web-страницы
	Конец HTML-документа.

III. Закрепление материала.

Лабораторная работа «Знакомство с ключевыми тегами HTML» Цель работы: научиться создавать простейшую Web-страницу с применением ключевых тегов HTML.
1	Запустить текстовый редактор Блокнот (Пуск – Программы –Стандартные -Блокнот)
2	Набрать содержимое страницы. Работу выполнил ученик 9 А класса Иванов Петр
3	Выполнить команду меню ( Файл - Сохранить). Файлу дать имя index.htm или index.php
4	Запустить браузер и. задав команду (Файл – Открыть), найти и запустить созданный файл.
Результат	В заголовке окна браузера высвечивается Первое знакомство с тегами HTML , в основной части окна браузера – Работу выполнил …

4. Итог занятия.
   

• Как представлена информация во всемирной паутине WWW?
  
• Какой язык мы начали изучать для создания Web-страниц?
  
• Как называются служебные слова языка HTML?
  
• Из каких частей состоит структура Web-страницы?
  

Занятие 2. Форматирование текстовых блоков на Web-странице.

Цели занятия:

• познакомить с тегами форматирования текстовых блоков на Web-странице
  
• познакомить с назначением атрибутов
  
• познакомить с атрибутом ALIGN и его возможными значениями
  
• познакомить с тегом HR и его атрибутами
  

План занятия

Этапы занятия	Деятельность учителя	Деятельность учащихся
Орг.момент	Приветствует учащихся, проверяет их готовность к занятию.	Ученики подготавливаются к занятию, приветствуют учителя.
Актуализация опорных знаний.	Учитель задает вопросы учащимся для повторения основных знаний, полученных на прошлом занятии.	Ученики отвечают на вопросы учителя.
Изучение нового материала.	Учитель проводит лекцию для знакомства учащихся с новым материалом. Консультирует учеников при заполнении таблицы «Основные теги форматирования текстовых блоков».	Ученики слушают объяснения учителя, заполняют таблицу «Основные теги форматирования текстовых блоков».
Закрепление материала.	Учитель знакомит с целями и планом выполнения лабораторной работы. Наблюдает за выполнением лабораторной работы. Консультирует учащихся.	Ученики выполняют лабораторную работу за компьютером. При необходимости обращаются за консультацией к учителю.
Итог занятия	Учитель задает вопросы для повторения основных знаний, полученных на занятии.	Ученики отвечают на вопросы учителя.

Ход занятия.

I. Орг.момент.

II. Актуализация опорных знаний.

Вопросы для повторения:

• В каком виде располагается информация в WWW?
  
• Что представляет собой Web-сайт?
  
• Что называют Web-страницей?
  
• Из каких частей состоит структура Web-страницы?
  

III. Изучение нового материала.

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

Основные теги форматирования текстовых блоков.

Элемент	Тег	Атрибуты