Для знакомства с основами языка HTML в школьном курсе необходимо минимально выделить 8 часов. В нашей школе уроки информатики спаренные, т.е. проводится два урока по 45 минут вместе. Если учитель располагает большим запасом времени, то это будет другой, наверное, более серьезный курс. Но даже за эти 8 часов результатом работы каждого учащегося может стать небольшой тематический сайт.
Методика преподавания основ языка HTML базируется на методе проектов. Этот метод сегодня широко используется в школьной практике и как нельзя лучше подходит для изучения информационной технологии. Чтобы работа вписалась в столь короткий срок, необходимо четко распределить и конкретизировать деятельность учащихся на каждом уроке. Для этого учитель должен продумать тему (или темы) создаваемого учащимися сайта. А также подготовить текстовый и графический материал, структуры страниц и схему навигации сайта. Папка с материалом должна находиться на доступном для ученика диске, так, чтобы не было проблем при работе с тегами.
Для подготовки содержательной части сайта можно привлечь преподавателя-предметника, тогда работа над сайтом станет не только возможностью повторения школьного предмета, но и покажет детям практическое применение их работы, например, таким образом можно создать и сайт школы. В нашей школе учащиеся создают сайт о своем поселке, его истории и о людях, в нем живущих.
Каждый урок строится так, что работа, выполняемая учеником - есть небольшая часть одного большого проекта, который выполняет либо сам ученик, либо группа учащихся, что повышает ответственность за выполняемую работу. Задание каждого урока предполагает повторение материала и навыков прошлого урока или использует страницы, ранее созданные. Новый материал обязательно продолжает предыдущий.
Результатом изучения курса является:
- Знакомство с Web-технологией, возможностями представления и использования информации в Internet
- Приобретение первичных навыков по созданию сайта на языке HTML.
Краткое описание курса
Из-за строгого ограничения объемов материала приводится краткое описание курса, без подробного теоретического материала и практических заданий.
Урок 1
Тема: Знакомство с Web-технологией
Теоретический материал: Основные понятия и соглашения Web-технологии.
На первом уроке необходимо немного рассказать об истории развития Internet и создания HTML-языка, а также об основных понятиях: редактор, браузер, страница и её структура, сайт и его структура, соглашения о названиях страниц и сайтов. Записать в конспект теги, формирующие Web-страницу, и основные теги разметки текста (заголовки, форматирование шрифта, нумерованный список, ненумерованный список, разделительная линия). Обязательно зарисовать структуру создаваемого сайта.
Практическая работа: направлена на приобретение опыта прописывания тегов в текстовом редакторе “Блокнот”, сохранения файла как Web-страницы. Для этого учащимся даются следующие задания с подробным описанием действий. (Здесь даются только задания).
Задание 1. Создание страницы-шаблона.
Так как прописывание тегов латинскими буквами для учащихся сложно и чтобы максимально сократить время на повторяющиеся операции, нужна страница-шаблон, которую путем редактирования можно использовать для создания других страниц.
Задание 2. Создание 1-ой страницы сайта.
Используя уже созданную страницу-шаблон необходимо создать Web-страницу с заголовком сайта и перечнем названий страниц. Для этого учащиеся должны использовать теги форматирования текста, списки.
Результат: должен представлять собой именную папку ученика с сохраненными в ней двумя файлами, а именно 1-ый файл - страница-шаблон, 2-ой файл - 1-ая страница сайта.
Урок 2
Тема: Таблица и графика на странице
Теоретический материал:
1. Повторение основных понятий Web-технологии.
2. Знакомство с тегами размещения на странице таблицы и картинок.
Практическая работа:
1. Создание 2-3-х страниц сайта: вставка таблиц, размещение графики и текста.
Задание 1 (на повторение). Редактирование страницы-шаблона.
Это задание необходимо не только, чтобы вспомнить теги, формирующие тело страницы но и научиться прописывать структуру пустой страницы. Здесь же можно объяснить детям, что размещать информацию удобнее в таблице, а не на пустой странице. Поэтому в файл-шаблон необходимо добавить теги, формирующие пустую таблицу, например, из 2-х столбцов и 2-х строк.
Задание 2. Создание страниц сайта.
Используя уже отредактированный файл страницы-шаблона, учащиеся должны создать 2 или 3 страницы сайта. На каждой необходимо разместить заранее заготовленный текст и рисунки. Таким образом, учащиеся, многократно повторяя одни и те же действия, получают навык их выполнения.
Результат: в именной папке ученика к уже существующим двум файлам добавляются еще 2-3 файла - страницы сайта.
Урок 3
Тема: Гиперссылки внешние и внутренние
Теоретический материал:
Структура сайта, внешние и внутренние гиперссылки.
Пока страницы не связаны между собой ссылками, они не являются сайтом. Сейчас необходимо напомнить структуру создаваемого сайта и об особенностях Web-технологии. Пришло время познакомить учащихся с тегами, которые генерируют ссылки. Начать лучше со ссылок внутри документа. Отметить, что внутренняя ссылка состоит из 2-х элементов: метки перед элементом, на который происходит ссылка и самой ссылки. А затем рассказать о внешних. Нужно отметить, что ссылкой может быть не только слово, а и другой элемент страницы, например, картинка. Каждый случай нужно прописать и привести пример.
Практическая работа: вставка гиперссылок на страницы.
Задание 1. Создать ссылки на титульной странице.
Открыть в Блокноте уже созданный файл титульной страницы и отредактировать его, вставив нужные теги так, чтобы пункты перечисления тем страниц стали ссылками на эти страницы.
Задание 2. Создать ссылки внутри страниц.
Открыть в Блокноте уже созданный файл 1-ой страницы и прописать внутреннюю ссылку с последней строки страницы на заголовок.
Задание 3. Создать ссылку со страницы на титульную страницу.
Здесь надо прописать теги, генерирующие переход на титульную страницу. Для этого лучше набрать слово “обратно” и его использовать как ссылку.
Задание 4. Создать ссылки перехода внутри сайта между страницами. Это задание дополнительное и его можно не выполнять.
Результат: Сайт из нескольких страниц.
Урок 4
Тема: Знакомство с ПО для создания Web-страниц
Теоретический материал:
1. Web-редакторы и среды для создания Web-страниц.
2. Сравнение страниц, созданных разными способами.
Теперь учащимся можно рассказать, что современное инструментальное программное обеспечение позволяет создавать сайты и без знания языка HTML и привести примеры таких приложений. И нужно, обязательно, показать разницу между страницами, созданными в приложениях и с помощью языка.
Практическая работа:
1. Создание страницы об авторе в Word.
2. Доработка страниц.
На заключительном уроке необходимо завершить работу над сайтами. Предложите ученикам создать последнюю страницу о себе любым удобным для них способом. Обязательно внимательно просмотрите все работы так, чтобы уходя со звонком с урока учащиеся оставили по готовому сайту.
Результат: Готовый сайт.
Литература
- А.И. Тихонов. Динамический HTML. - М.: ЗАО “Издательство БИНОМ”, 2001.
- Э.М. Пройдаков, Л.А. Теплицкий. Англо-русский толковый словарьпо вычислительной технике, Интернету и программированию. - М.: Издательско - торговый дом “Русская Редакция”, 2000.
- Е.В. Давыдова. Создание Web-страниц с помощью языка HTML. Информатика и образование 2000/8.
- Д. Усенков. Уроки Web-мастера. - М.: Лаборатория Базовых Знаний, 2001