- Преподавателю
- Информатика
- Конспект урока на тему Создание гиперссылок
Конспект урока на тему Создание гиперссылок
Раздел | Информатика |
Класс | - |
Тип | Конспекты |
Автор | Александрова С.А. |
Дата | 09.09.2015 |
Формат | doc |
Изображения | Есть |
Создание гиперссылок
Цели урока:
-
расширение и углубление представлений о языке гипертекстовой разметки HTML;
-
формирование умений создавать веб-страницы с гиперссылками;
-
развитие логического мышления, умений анализировать, сравнивать, систематизировать, обобщать.
Тип урока: урок усвоения новых знаний и умений.
Учащиеся должны уметь: создавать в редакторе Блокнот веб-страницы с гиперссылками.
Программное и методическое обеспечение урока: редактор Блокнот;
учебное пособие «Информатика 11», § 3 (п.3.3) [1]; приложения к уроку 7; ЭСУ Web11 7 [2].
Методические рекомендации к уроку
1. Проверка знаний предыдущего урока (репродуктивный метод обучения, индивидуальная и фронтальная форма работы).
Выполнение индивидуальных заданий на компьютере: упражнение 2 к § 3 (п.3.2) учебного пособия [1] или ЭСУ Web11 6 [2]).
Предложите учащимся ответить на вопросы: Какой тег используется для отображения рисунка на веб-странице? Как задаются размеры изображения? Какими атрибутами задается пояснительный текст к рисунку? Как задается фоновый рисунок на веб-странице? Возможно использование теста (приложение 1 к уроку 7, ЭСУ Web11 6 [2] ).
2. Актуализация знаний и мотивация учащихся на изучение нового материала (фронтальная форма работы).
Перед началом объяснения нового материала в форме фронтальной беседы обсудите назначение и роль гиперссылок. Подчеркните, что без гиперссылок нет сайта. С помощью гиперссылок выполняются переходы со страницы на страницу сайта.
Для актуализации ранее изученного материала обсудите с учащимися способы адресации в сети Интернет. Возможно использование вопросов входного теста (приложение 2 к уроку 7; ЭСУ Web11 7 [2]). Правильные ответы выясняются и обобщаются в ходе фронтальной беседы.
Напомните, как задаются гиперссылки в редакторах Word и PowerPoint.
3. Объяснение нового материала (объяснительно-иллюстративный метод обучения в сочетании с частично-поисковым, фронтальная форма работы).
В языке HTML за организацию ссылок отвечает тег <a> с обязательным атрибутом href, значением которого является адрес (URL) ресурса. Например, HTML-код текстовой гиперссылки на страницу "Графика", которая сохранена в файле graf.htm в той же папке, имеет вид: <a href="graf.htm">Графика a>, т.е. адресом является имя файла.
Особое внимание обратите на варианты адресации. Подробно разберите пример на рис 1.22 учебного пособия [1]. Сравните абсолютную и относительную адресацию. Можно записывать полный путь от корня диска к искомой странице. Однако лучше указывать относительный адрес (путь от исходной страницы к искомой). Например, ссылка со страницы main.htm на страницу karlson.htm будет иметь вид:
Карлсон.
Ссылка со страницы drama2.htm (папка dramy) на страницу karlson.htm
(папка multy) будет иметь вид: <a href="../multy/karlson.htm">Карлсонa>.
Символы ../ (две точки и слеш) обозначают возврат в папку kino из вложенной папки dramy. Обсудите преимущество относительной адресации: при переносе папки kino со всеми вложениями в другое место, в том числе на другой диск или компьютер, относительные адреса не изменяются!
Подчеркните, что гиперссылкой может служить не только текст, но и рисунок. Для этого между парой тегов <a href >...a > нужно вставить тэг, указывающий на файл изображения, например:
.
Возможно совместное использование текста и графики в одной ссылке, например: <a href="graf.htm"> <img src="ris.jpg"> Графика a>.
По умолчанию вызванная гиперссылкой страница открывается в том же окне, замещая исходную. Назад можно вернуться с помощью соответствующей кнопки на панели инструментов браузера. Для просмотра вызванной страницы в новом окне необходимо указать атрибут target=_blank, например: <a href="graf.htm" target=_blank> Графика a>. С открытой таким способом страницы вернуться назад с помощью кнопки браузера нельзя.
Важно отметить, что гиперссылка может указывать не только на веб-страницу, но и на любой размещенный в сети по известному адресу информационный ресурс: сайт, рисунок, текст, презентацию, аудио-видеофрагмент. Конечно, на компьютере пользователя должно было установлено соответствующее программное обеспечение для его отображения.
Пусть, например, реферат по экологии атмосфера.doc размещен на сайте referaty.by в папке bio. Гиперссылка для его просмотра или скачивания:
<a href = "referaty.by/bio/ атмосфера.doc">Загрязнение атмосферыа >.
В заключение подчеркните, что расставлять гиперссылки имеет смысл только после создания ресурсов, на которые они указывают, и размещения их файлов в выбранных папках.
4. Закрепление нового материала (частично-поисковый метод обучения, индивидуальная форма работы).
Предложите учащимся занять места за компьютерами и выполнить задания примера 1 из §3 (п.3.3) учебного пособия [1] (ЭСУ Web11 7 [2]). Контролируйте самостоятельную работу учащихся, просматривая результаты на каждом этапе с помощью браузера. При затруднениях оказывайте необходимую помощь.
При наличии времени подготовленным учащимся дополнительно предложите создать гиперссылки на закладки в том же документе, а также вставить метатеги для задания кодировки и ключевых слов (с.33 учебного пособия [1], ЭСУ Web11 7 [2]).
5. Подведение итогов урока
Учащиеся демонстрируют созданные страницы и корректность гиперссылок. Обсуждаются этапы работы и затруднения учащихся. Кратко формулируются особенности создания гиперссылок.
6. Домашнее задание
Изучить материал § 3 (п. 3.3) учебного пособия [1], ответить на вопросы 1 2, подготовиться к практическому выполнению заданий