Рис. 1.4. Окно браузера с результатом просмотра файла, приведенного в листинге 1.4.

Помимо этого способа, для создания графических ссылок используется так называемая сегментированная графика, или Image map. Эта технология применяется в тех случаях, когда в одном изображении необходимо разместить несколько ссылок, переход на каждую из которых осуществлялся бы при щелчке мышью в определенном месте изображения. Например, это удобно, когда изображение меню создается в виде графического файла (по типу стандартной панели инструментов), и для каждого пункта меню реализуется своя ссылка.

При использовании сегментированной графики сначала необходимо подготовить сам графический файл. Затем он вставляется в текст HTML-документа с помощью обычного тэга вставки рисунка <img>, к которому необходимо добавить параметр usemap. В общем виде это выглядит следующим образом: <img src="picture.gif" usemap="#map">.

В этой строке picture .gif — файл с изображением рисунка, который мы собираемся использовать в виде карты, а тар — имя карты чувствительных областей рисунка. Если описание карты находится не в том документе, где она помещена, то перед знаком решетки вписывается имя HTML-файла, который содержит описание этой карты.

Для создания карты областей, чувствительных к нажатию, используются тэги <мар name="map_name"> и </мар>, где map_name — собственно имя карты. Если снова обратиться к вышеприведенному примеру, то значение параметра name будет тар. А между открывающими и закрывающими тэгами помещаются определители чувствительных областей. Для задания каждой области применяется тэг <area shape="shape" coords="coor" HREF="link">. Параметр shape принимает значения rect, circ и poly для задания прямоугольника, круга и многоугольника соответственно, coords задает список координат для выбранной формы. Так, для прямоугольника в параметре coords через запятую перечисляются четыре координаты левого верхнего и правого нижнего угла по осям х и у соответственно. Для круга необходимо передать всего три значения — координаты центра и радиус круга. Для многоугольника указываются пары координат каждой вершины. Ну, а параметр href задает URL, по которому необходимо перейти при нажатии на данную область. Так, для задания области прямоугольной формы необходимо записать приблизительно следующий тэг: <AREA shape=rect coords="0, 0, 30, 30" href="a.html">.

Таблицы

К сожалению, HTML-документы не имеют средств для четкого расположения текста и графики на страницах. Связано это с тем, что никогда нельзя предсказать заранее, какой размер окна браузера и разрешение экрана будут выбраны пользователем. Создание же красивых и функциональных страниц требует достаточно точного позиционирования текста и рисунков. Для этих целей широко используются таблицы. Для языка HTML это на удивление гибкий инструмент. В ячейках таблицы легко размещаются и текст и графика. Однако все эти прелести требуют применения достаточно большого объема параметров. Рассмотрим их подробно в этом разделе.