В этом примере видно, что

Листинг 1.17

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/htm!4/strict.dtd">

<html>

<head>

<title>
Ceгментированная графика</title>

<body>

<р>
Это обычный текст.<img srce"redhood.gif" usemap="#mapl"
alt="docs"x/p>
<map namee"mapl">

<area href^"1.htm" shape-"rect" coords="l, 1, Ю, 10" alt-"l">
.
<area href="2.htm" shape="circle" coords«"20,20,5" alt-"2">

<area href-"l.htm" shape»"poly" coords-.111,30,10,35,1, 50', 1, 30" alt="3">

</raap>

</body>

</html>

В этом примере видно, что при объявлении рисунка, в тег <img>
мы вставляем параметр usemap, значением которого является наименование карты активнь!х сегментов рисунка, связанных с гиперссылками. Перед наименованием используемой карты активных сегментов вставляется символ решетки. Описание этой карты помещается между тегами <тар>
и </тар>
. При этом у открывающего тега <тар>
существует обязательный параметр name, значением которого является наименование карты.
Карта состоит из описания сегментов. Каждый сегмент описывается при помощи одного тега <агеа>
. Мы можем применять активные сегменты трех различных форм: прямоугольники, круги и многоугольники. Форма задается при помощи обязательного параметра shape. В качестве значения данного параметра мы можем использовать одно из трех предустановленных значений.

Значение rect используется для создания прямоугольных активных областей.
Значение circle используется для создания кругового сегмента.
Значение poly позволяет создавать активные сегменты в виде выпуклых многоугольников.

После того, как мы задали тип формы, следует точно определить их размеры и расположение на нашем графическом изображении. Для этого используется параметр coords, в качестве значения которого записывается перечень координат, определяющих активный сегмент. В листинге 1.17 мы можем увидеть, что координаты в общем списке разделяются обычной запятой. Отсчет координат ведется от верхнего левого угла рисунка, который имеет координаты (0;0).
Для прямоугольных сегментов задаются координаты верхнего левого и правого нижнего угла. А для многоугольников последовательно перечисляются координаты всех точек, в порядке соединения их линиями. Естественно, первая и последняя пара координат должны совпадать, иначе многоугольник окажется незамкнутым, и активный сегмент не будет обрабатываться.
В тег <агеа>
входит и параметр href, в качестве значения которого используется URL ресурса, на который указывает гиперссылка данного сегмента.
Но этот параметр, как ни удивительно, не является обязательным. В том случае, когда сегмент создается, но не должен соединятся с гиперссылкой, следует использовать параметр nohref, который не имеет значения.
Но обязательный параметр для тега <агеа>
все-таки есть. Это параметр alt, значением которого является текстовая строка, являющаяся альтернативным представлением рисунка. Как мы знаем, данная строка отображается в виде хинта, когда пользователь наводит курсор мыши на объект. В нашем случае подобным объектом является активный сегмент, внедренный в графическое изображение.
Также в теге <агеа>
, как и в тегах обычных гиперссылок, используются параметры tabindex и access key, которые позволяют активизировать гипер-ссылку без использования мыши, при помощи одной лишь клавиатуры. Структуру значений этих параметров мы рассмотрели несколько ранее. Немного отступая от темы, следует заметить, что любой «давильным Web-мастер непременно должен использовать эти параметры, так как только их применение может гарантировать активацию гиперссылок без помощи мыши.
Итак, мы разобрались с применением технологии сегментированной графики. Но о ссылках мы узнали далеко не все. В спецификации HTML определен тег <link>
, который создает не привычную нам гиперссылку, а некоторую связь между отображаемым документом и каким-либо дополнительным файлом. Теги <link>
могут размещаться только в разделе заголовка HTML-документа, между тегами <head>
и </head>
В качестве примера применения рассматриваемого нами тега <link>
можно привести следующий фрагмент кода:

Содержание раздела

Главная сайта