Пример 14. Документ со ссылками
<html>
<head>
<title> HTML-страница со ссылками</title>
</head>
<body background=Prim12.files/Paper1.gif>
<p align=center>
<font size=5>Государственный Технический Университет</font>
</p>
<p align=center>
<img src=Prim12.files/Kaf-rts.gif>
</p>
<p align=Left>
<font Face=Courier new size=5> <B>
<a href=rts.htm#istor>Из истории кафедры</a> <BR>
<a href=rts.htm#spec>Специальности</a><BR>
<a href=rts.htm#PREPOD>Преподаватели</a><BR>
<a href=rts.htm#ntn>Научные направления</a><BR>
<a href=upl.htm>Учебные планы</a>
</B>
</font>
</p>
</body>
</html>
Этот документ содержит титульную (главную) страницу, на которой имеется оглавление, оформленное с помощью ссылок (см. рис. 8.13). Основная информация о кафедре радиоэлектронных и телекоммуникационных систем находится в файле rts.htm.
Рис. 8.13. Главная страница со ссылками
Начинается этот файл главой, посвященной истории кафедры. Поэтому ссылка Из истории кафедры на титульной странице организована непосредственно на этот документ. Следующие три ссылки на титульной странице (Специальности, Преподаватели, Научные направления) тоже обращаются к документу rts.htm, но не к началу этого документа, а различным его главам. Главы в документе rts.htm отмечены закладками (с помощью тега <A> и атрибута NAME), а в ссылках титульной страницы после имени файла стоит имя закладки, например,
<a href=rts.htm#spec>.
Здесь spec – имя закладки (значение атрибута NAME в документе rts.htm). Глава Специальности в документе rts.htm начинается строкой:
<p ALIGN=left><a name=spec>Специальности</a>
Последняя ссылка Учебные планы вызывает другой документ - upl.htm.
Большинство броузеров выделяют ссылки цветом, подчеркиванием или другим каким-либо образом. Цвета посещенных (просмотренных) ссылок и непосещенных различны. Это позволяет легко ориентироваться на Web-узлах.
8.11. Сенсорные изображения (изображения-карты)
Сенсорное изображение представляет собой графический образ, разделенный на области, являющиеся гиперссылками на различные HTML-файлы или URL.
Существует два типа сенсорных изображений: серверные и клиентские. Для создания серверных сенсорных изображений разработчик обычно должен писать CGI-программы (сценарии). Серверные изображения-карты работают следующим образом. На Web-странице помещается изображение, состоящее из нескольких четко разделенных фрагментов. При щелчке на одном из фрагментов Web-броузер запоминает координаты точки, на которой был произведен щелчок, в виде пары X и Y (измеряются в пикселях) и отправляет эту информацию на Web-сервер. Сервер получает координаты и запускает программу CGI, которая переводит координаты в URL, т.е. в имя файла, соответствующего тому фрагменту, на котором был произведен щелчок. Затем Web-сервер передает имя файла броузеру, который и загружает этот файл.
Серверные сенсорные изображения появились давно. Как видно из описания принципа их работы, они не слишком эффективны, и ими трудно пользоваться.
В настоящее время появилась новая технология – клиентские сенсорные изображения – более простая в разработке и более эффективная при использовании. В клиентских изображениях-картах пользователь также видит на экране изображение, разделенное на области. Но при щелчке вместо обмена информации с сервером броузеры сами узнают, на какой HTML-файл сделана ссылка, и автоматически загружают этот файл. Этот процесс занимает существенно меньше времени и проще для интерпретации броузером. Каждому фрагменту изображения соответствуют координаты в пикселях. Эти координаты заданы в том же HTML-файле, что и остальная часть Web-страницы. Это позволяет осуществить ссылку на другую Web-страницу так же, как и при использовании обычного тега <A HREF>. В конце концов, клиентские сенсорные изображения полностью вытеснят серверные.