Рабочие листы
к вашим урокам
Скачать
1 слайд
Создание Web-сайтов
УРОК 4.
Гиперссылки
на Web-страницах
2 слайд
Web-Сайт состоит из нескольких web-страниц.
Создадим заготовки остальных Web-страниц.
Такие «пустые» страницы должны иметь заголовок, но могут пока не иметь содержания. Все создаваемые страницы необходимо сохранить в виде файлов в папке сайта.
Каждая страница будет содержать следующий HTML-код:
Создать в каталоге сайта страницы и сохраните их в файлах с соответствующими именами:
Программы (software.htm)
Словарь (glossary.htm)
Комплектующие (hardware.htm)
Анкета (anketa.htm)
Гиперссылки на Web-страницах
3 слайд
Гиперссылки, размещенные на web-странице, позволяют загружать в браузер другие web-страницы, хранящиеся на локальном компьютере или в Интернете.
Гиперссылка состоит из двух частей: адреса и указателя ссылки.
Указатель ссылки — это то, что мы видим на Web-странице (текст или рисунок), обычно (но не всегда!) выделенный синим цветом и подчеркиванием. При указании на него мышью, курсор превращается в значок «рука». Щелчок мышью по указателю вызывает переход на Web-страницу, адрес которой указан в гиперссылке.
Гиперссылка создается с помощью универсального тэга, <А> и его атрибута HREF, указывающего, в каком файле хранится загружаемая Web-страница:
<A href="Адрес"> Указатель ссылки </A>
Гиперссылки на Web-страницах
4 слайд
Если загружаемая в браузер Web-страница размещена на локальном компьютере в той же папке, то вместо адреса указывается просто имя файла, например:
<A href="filename.htm">Указатель ссылки</A>
Если загружаемая в браузер Web-страница размещена в Интернете, то в качестве адреса указывается Интернет-адрес, например:
<A href="http://www.server.ru/Web-сайт/index.php"> Указатель ссылки</A>
Гиперссылки на Web-страницах
5 слайд
Гиперссылки могут содержать адреса не только Web-страниц, но и адреса файлов других типов. Активизация таких гиперссылок будет приводить:
<А HREF="picture. jpg">Изображение</A>
- к просмотру изображения в браузере:
<А HREF="sound.wav">3BУK</A>
- к запуску проигрывателя, встроенного в браузер и воспроизведению звукового файла:
<А HREF="filez.exe">Скачать файл</А>
- к сохранению файла на локальном компьютере, с использованием встроенного в браузер менеджера загрузки файлов:
Гиперссылки на Web-страницах
6 слайд
Полезно на начальной странице сайта создать ссылку на адрес электронной почты, по которому посетители могут связаться с администратором сайта. Для этого необходимо атрибуту ссылки HREF присвоить адрес электронной почты и вставить ее в контейнер <ADDRESS> </ADDRESS>, который задает стиль абзаца, принятый для указания адреса:
<ADDRESS>
<А HREF="mailto:username@server.ru">
E-mail: username@server.ru</A>
</ADDRESS>
Теперь по щелчку мышью по ссылке адреса электронной почты будет открываться почтовая программа Outlook Express (или другая используемая по умолчанию почтовая программа), где в строке «Кому» будет указан заданный в ссылке адрес.
Гиперссылка на адрес электронной почты
7 слайд
Прежде всего необходимо разместить на титульной странице (в документе index.htm) тексты гиперссылок на каждую страницу сайта.
Для представления гиперссылок удобнее всего выбрать названия страниц, на которые осуществляется переход.
Принято размещать гиперссылки в нижней части страницы, поэтому разместим их под введенным текстом в новом абзаце в одну строку разделенными несколькими пробелами.
Такое размещение гиперссылок часто называют панелью навигации.
Панель навигации будет представлять собой абзац, выровненный по центру, в котором указатели гиперссылок разделены пробелами ( ):
<p ALIGH= "center"> [Программы]   [Словарь]   [Комплектующие]   [Анкета]</p>
Практическая работа.
Создание панели навигации и электронного почтового адреса на титульной странице разрабатываемого сайта
8 слайд
Теперь для каждой гиперссылки определим адрес перехода.
Для этого используется контейнер гиперссылки <А>…</А> с атрибутом HREF, значением которого является URL-адрес документа на локальном компьютере или в Интернете.
Контейнер должен содержать указатель гиперссылки:
<А НREF="URL">Указатель гиперссылки</А>
Панель навигации на титульной странице создана, теперь активизация указателей гиперссылок будет приводить к переходу на другие страницы сайта.
9 слайд
Вставьте в титульную страницу код, создающий ссылку на адрес электронной почты:
По щелчку мыши по ссылке на адрес электронной почты будет открываться почтовая программа Outlook Express (или другая используемая по умолчанию почтовая программа), где в строке «Кому» будет указан заданный в ссылке адрес.
Созданная титульная страница Web-сайта «Компьютер» содержит заголовок, изображение компьютера, текст, панель навигации и ссылку на адрес электронной почты.
10 слайд
Если создаваемая страница очень большая, то на ней можно расставить метки (закладки, якоря). Они помечают смысловые разделы и помогают быстро перемещаться по документу.
Например, поместим закладку (якорь) в начале страницы:
<A NAME="top"> </A>
В конце страницы создадим переход на эту закладку (якорь):
<A HREF="#top"> К началу страницы </A>
Переключаться на якорь по гиперссылке можно не только внутри текущей страницы, но и с другой Web-страницы.
Например, пусть на главной странице index.htm мы создали закладку top.
На страницу, с которой мы будем переходить к нашей закладке, добавляем гиперссылку:
<A HREF="index.htm#top"> На главную страницу </A>
Якоря. Гиперссылки на якоря
Рабочие листы
к вашим урокам
Скачать
6 660 047 материалов в базе
«Информатика (базовый уровень)», Семакин И.Г., Хеннер Е.К., Шеина Т.Ю.
§ 13. Инструменты для разработки web-сайтов
Больше материалов по этой темеНастоящий материал опубликован пользователем Татурина Елена Владимировна. Инфоурок является информационным посредником и предоставляет пользователям возможность размещать на сайте методические материалы. Всю ответственность за опубликованные материалы, содержащиеся в них сведения, а также за соблюдение авторских прав несут пользователи, загрузившие материал на сайт
Если Вы считаете, что материал нарушает авторские права либо по каким-то другим причинам должен быть удален с сайта, Вы можете оставить жалобу на материал.
Удалить материалВаша скидка на курсы
40%Курс повышения квалификации
36 ч. — 180 ч.
Курс повышения квалификации
36 ч. — 144 ч.
Курс профессиональной переподготовки
300/600 ч.
Мини-курс
6 ч.
Мини-курс
4 ч.
Оставьте свой комментарий
Авторизуйтесь, чтобы задавать вопросы.