содержимое

Обратите внимание, что

  1. данный документ является переводом документа «Objects, Images, and Applets in HTML documents» и на данный момент находится на стадии перевода;
  2. данный документ может содержать неточности, опечатки и ошибки перевода;
  3. официальным документом по данной тематике является оригинальный документ на английском языке, расположенный на сайте W3C.

13 Объекты, Изображения и Апплеты

Содержимое

  1. Вставка апплета: элемент APPLET
  2. Карты изображений
    1. Клиентские карты изображений: элементы MAP и AREA
    2. Серверные карты изображений


* * *

13.4 Вставка апплета: элемент APPLET

APPLET помечен как устаревший (со всеми его атрибутами) в пользу OBJECT.

Формальное определение дано в Переходном ОТД.

Определения атрибутов

codebase = uri [CT]
Этот атрибут задаёт базовый URI для апплета. Если этот атрибут не указан, то по умолчанию используется такой же базовый URI как у текущего документа. Значения этого атрибута могут ссылаться только на подкаталоги каталога, содержащего текущий документ. Примечание. Несмотря на то, что ограничение относительно расположения файлов только в подкаталогах является отступлением от общепринятой практики и спецификации HTML 3.2, Рабочая Группа HTML решила оставить ограничение в данной версии спецификации из соображений безопасности.
code = cdata [CS]
Этот атрибут определяет либо имя файла класса, который содержит апплеты скомпилированные в подкласс апплета, либо путь, к классу включая сам файл класса. Он интерпретируется относительно атрибута codebase апплета. В апплете должен присутствовать атрибут code либо object.
name = cdata [CS]
Этот атрибут присваивает имя апплету, которое позволяет апплетам находящимся на одной странице находить друг друга (и общаться друг с другом).
archive = список-uri [CT]
Этот атрибут указывает разделённый запятыми список URI-адресов, которые указывают путь к архивам, содержащим классы и другие ресурсы, которые должны быть «предварительно загружены». Классы загружаются с помощью экземпляра AppletClassLoader с указанным codebase. Относительные URI-адреса для архивов интерпретируются относительно codebase апплета. Предварительная загрузка ресурсов может значительно повысить производительность апплетов.
object = cdata [CS]
Этот атрибут указывает имя ресурса, содержащего последовательное представление апплета. Он интерпретируется относительно codebase апплета. Сериализованные данные содержат имя класса апплета, но не реализации. Имя класса используется для извлечения реализации из файла класса или архива.

Когда апплет является «десериализованным» вызывается метод start(), но не метод init(). Атрибуты допустимы, когда исходный объект, который был сериализован не восстанавливается. Любые атрибуты, передаваемые в этот экземпляр APPLET, будут доступны для апплета. Авторы должны использовать эту функцию с особой осторожностью. Апплет должен быть остановлен прежде, чем он сериализуется.

В апплете должен присутствовать атрибут code или object. Если задан и code и object и при этом им заданы разные имена классов, то это будет считаться ошибкой.

width = длина [CI]
Этот атрибут определяет начальную ширину области отображения апплета (исключая любые простые или диалоговые окна, создаваемые апплетом).
height = длина [CI]
Этот атрибут определяет начальную высоту области отображения апплета (исключая любые простые или диалоговые окна, создаваемые апплетом).

Атрибуты, определяемые в других местах

Этот элемент, поддерживаемый всеми браузерами с поддержкой Java, позволяет дизайнерам встраивать Java апплет в HTML-документ. Данный элемент осуждается в пользу элемента OBJECT.

Содержимое элемента APPLET выступает в качестве альтернативной информации для агентов пользователей, не поддерживающих этот элемент или не настроенных на поддержку апплетов. В противном случае (если элемент поддерживается) агенты пользователей должны игнорировать содержимое элемента.

ПРИМЕР НЕЖЕЛАТЕЛЬНОГО ИСПОЛЬЗОВАНИЯ:
В следующем примере элемент APPLET вставляет Java апплет в документ. Поскольку атрибут codebase отсутствует, апплет предположительно должен находиться в том же каталоге, что и текущий документ.

<APPLET code="Bubbles.class" width="500" height="500">
Java апплет, рисующий анимированные пузырьки.
</APPLET>

Этот пример может быть переписан с использованием OBJECT следующим образом:

<P><OBJECT codetype="application/java"
        classid="java:Bubbles.class"
        width="500" height="500">
Java апплет, рисующий анимированные пузырьки.
</OBJECT>

Начальные значения могут быть указаны апплету с помощью элемента PARAM.

ПРИМЕР НЕЖЕЛАТЕЛЬНОГО ИСПОЛЬЗОВАНИЯ:
Следующий пример Java апплета:

<APPLET code="AudioItem" width="15" height="15">
<PARAM name="snd" value="Hello.au|Welcome.au">
Java апплет, проигрывающий аудио дорожку с приветствием.
</APPLET>

может быть переписан с использованием OBJECT следующим образом:

<OBJECT codetype="application/java"
        classid="AudioItem" 
        width="15" height="15">
<PARAM name="snd" value="Hello.au|Welcome.au">
Java апплет, проигрывающий аудио дорожку с приветствием.
</OBJECT>


* * *

13.6 Карты изображений

Карты изображений позволяют авторам определить области изображения или объекта и назначить определённое действие для каждой такой области (например, показать документ, запустить программу, и так далее). Когда пользователь активизирует такую область, то происходит выполнение указанного действия.

Карта изображения создаётся путём связывания объекта, с элементом, указывающим в объекте чувствительные геометрические области.

Существует два типа карт-изображений:

Клиентские карты изображений предпочтительнее серверных как минимум по двум причинам: первая - клиентские карты изображений доступны для просмотра людям, которые используют неграфические агенты пользователей и вторая - клиентские карты изображений осуществляют мгновенную обратную связь несмотря на то находится ли указатель над активной областью или нет.

13.6.1 Клиентские карты изображений: MAP и AREA элементы

<!ЭЛЕМЕНТ MAP - - ((%блок;) | AREA)+  -- клиентская карта изображения -->
<!СПИСАТР MAP
  %attrs;                              -- %coreattrs, %i18n, %events --
  name        CDATA      #ОБЯЗАТЕЛЬНЫЙ -- ссылка на usemap --
  >

Открывающий тег: обязателен, Закрывающий тег: обязателен

<!ЭЛЕМЕНТ AREA - O ПУСТО                      -- область клиентской карты изображения -->
<!СПИСАТР AREA
  %attrs;                                     -- %coreattrs, %i18n, %events --
  shape       %Фигура;       прямоугольник    -- указывает тип фигуры --
  coords      %Координаты;   #ДОПОЛНИТЕЛЬНЫЙ  -- разделённый запятыми список координат --
  href        %URI;          #ДОПОЛНИТЕЛЬНЫЙ  -- URI указываемого ресурса --
  nohref      (nohref)       #ДОПОЛНИТЕЛЬНЫЙ  -- деактивация области --
  alt         %Текст;        #ОБЯЗАТЕЛЬНЫЙ    -- краткое описание --
  tabindex    ЧИСЛО          #ДОПОЛНИТЕЛЬНЫЙ  -- позиция в порядке табуляции --
  accesskey   %Символ;       #ДОПОЛНИТЕЛЬНЫЙ  -- символ быстрого доступа --
  onfocus     %Сценарий;     #ДОПОЛНИТЕЛЬНЫЙ  -- элемент получает фокус --
  onblur      %Сценарий;     #ДОПОЛНИТЕЛЬНЫЙ  -- элемент теряет фокус --
  >

Открывающий тег: обязателен, Закрывающий тег: запрещён

Определения атрибутов MAP

name = cdata [CI]
Этот атрибут присваивает имя карте изображения, определяемой элементом MAP.

Определения AREA атрибутов

shape = default|rect|circle|poly [CI]
Этот атрибут определяет форму области. Возможные значения:
  • default: Указывает всю область.
  • rect: Определяет прямоугольную область.
  • circle: Определяет круглую область.
  • poly: Определяет многоугольную область.
coords = координаты [CN]
Этот атрибут задаёт положение и в некоторых случаях форму фигуры на экране. Количество и порядок значений зависит от определённой формы. Возможные комбинации:
  • rect: левая «x» координата, верхняя «y» координата, правая «x» координата, нижняя «y» координата.
  • circle: «x» и «y» координата центра окружности, радиус. Примечание. В случае, когда значением радиуса является процентное значение, агенты пользователей должны вычислять окончательное значение радиуса на основе ширины или высоты ассоциированного объекта. То есть в качестве радиуса в данном случае должно выступать наименьшее из значений.
  • poly: x1, y1, x2, y2, ..., xN, yN. Первая и последняя пара «x» и «y» координат должны совпадать (то есть быть одинаковыми), чтобы закрыть многоугольник. Если эти значения не совпадают, то агенты пользователей должны самостоятельно добавить соответствующую дополнительную пару координат, чтобы тем самым закрыть многоугольник.

Координаты задаются относительно верхнего левого угла объекта. Все значения являются длинами. Все значения разделяются запятыми.

nohref [CI]
Присутствие данного логического атрибута указывает, что область не имеет ссылки.

Атрибут, привязывающий карту изображения к элементу

usemap = uri [CT]
Этот атрибут привязывает карту изображения к элементу. Карта изображения определяется элементом MAP. Значение атрибута usemap должно совпадать со значением атрибута name привязываемого MAP элемента.

Атрибуты, определяемые в других местах

Элемент MAP определяет клиентскую карту изображения (или другой механизм навигации), которая может быть связана с другими элементами (IMG, OBJECT или INPUT). Карта изображения привязывается к элементу с помощью usemap атрибута элемента. Элемент MAP может использоваться без привязки к изображению для общих механизмов навигации.

Наличие атрибута usemap в элементе OBJECT означает, что объект включён в изображение. Кроме того, когда элемент OBJECT имеет соответствующую связанную с ним клиентскую карту изображения, агенты пользователей могут осуществлять взаимодействие пользователя с OBJECT исключительно с точки зрения клиентской карты изображения. Это позволяет агентам пользователей (например, таким как аудио-браузер или робот) взаимодействовать с OBJECT без обработки; агент пользователя может даже решить не извлекать (или обрабатывать) объект. Когда OBJECT имеет привязанную к нему карту изображения, авторам не следует ожидать, что объект будет загружаться и обрабатываться всеми агентами пользователя.

Элемент MAP содержащий модель позволяет авторам комбинировать следующее:

  1. Один или несколько элементов AREA. Эти элементы не имеют содержимого, но устанавливают геометрические области карты изображения и ссылки, связанные с каждой областью. Обратите внимание, что агенты пользователей, как правило, не выводят AREA элементы. Таким образом, с помощью атрибута alt авторы должны указывать альтернативный текст для каждого элемента AREA (смотрите ниже для получения информации о том, как указать альтернативный текст).
  2. Содержимое блок уровня. Это содержимое должно включать в себя элементы A, устанавливающие геометрические области карты изображения и ссылки, связанные с каждой областью. Обратите внимание, что агент пользователя должен вывести содержимое блок уровня элемента MAP. Авторы должны использовать этот метод для создания более доступных документов.

Когда MAP элемент содержит смешанное содержимое (то есть и AREA элементы и элементы содержимого блок уровня), агенты пользователей должны игнорировать AREA элементы.

Авторы должны указывать геометрию карты изображения либо полностью с AREA элементами, либо полностью с A элементами, либо с обоими элементами если содержимое комбинируется. Авторы могут смешивать содержимое так, что старые версии агентов пользователей будет обрабатывать геометрию карты, указанную в AREA элементах, а современные версии агентов пользователей будут использовать полное содержимое блока.

Если две или более определённые области перекрывают друг друга, то область, которая в документе определена раньше, имеет преимущество (то есть реагирует на действия пользователя).

Агенты пользователей и авторы должны предлагать текстовые альтернативы для графических карт изображений для случаев, когда графика недоступна или пользователь не может получить к ним доступ. Например, агенты пользователей могут использовать текстовое значение атрибута alt для указания текстовых ссылок вместо графической карты изображения. Такие ссылки могут быть активированы различными способами (клавиатурой, голосовой активацией и так далее).

Примечание. Элемент MAP не имеет обратной совместимости с агентами пользователей поддерживающими только HTML 2.0.

Примеры клиентских карт изображений 

В следующем примере мы создадим клиентскую карту изображения для элемента OBJECT. Мы не хотим отображать содержимое карты изображения, когда выводится элемент OBJECT, таким образом, мы "скрываем" содержимое элемента MAP с содержимым элемента OBJECT. Следовательно, содержимое элемента MAP будет отображено, только в случае если элемент OBJECT не может быть отображён.

<HTML>
   <HEAD>
      <TITLE>Отличный сайт!</TITLE>
   </HEAD>
   <BODY>
     <P><OBJECT data="navbar1.gif" type="image/gif" usemap="#map1">
     <MAP name="map1">
       <P>Перейдите на сайт:
       <A href="guide.html" shape="rect" coords="0,0,118,28">Руководство доступа</a> |
       <A href="shortcut.html" shape="rect" coords="118,0,184,28">Вперёд</A> |
       <A href="search.html" shape="circle" coords="184,200,60">Поиск</A> |
       <A href="top10.html" shape="poly" coords="276,0,276,28,100,200,50,50,276,0">Десятка лучших</A>
     </MAP>
     </OBJECT>
   </BODY>
</HTML>

Нам может понадобиться отображение содержимого карты изображения, даже если агент пользователя может отображать OBJECT. Например, мы хотим связать карту изображения с элементом OBJECT и включить текстовую панель навигации внизу страницы. Чтобы сделать это, мы определяем элемент MAP вне OBJECT:

<HTML>
   <HEAD>
      <TITLE>Отличный сайт!</TITLE>
   </HEAD>
   <BODY>
     <P><OBJECT data="navbar1.gif" type="image/gif" usemap="#map1">
     </OBJECT>

     ...остальное содержимое страницы здесь...

     <MAP name="map1">
       <P>Перейдите на сайт:
       <A href="guide.html" shape="rect" coords="0,0,118,28">Руководство доступа</a> |
       <A href="shortcut.html" shape="rect" coords="118,0,184,28">Вперёд</A> |
       <A href="search.html" shape="circle" coords="184,200,60">Поиск</A> |
       <A href="top10.html" shape="poly" coords="276,0,276,28,100,200,50,50,276,0">Десятка лучших</A>
     </MAP>
   </BODY>
</HTML>

В следующем примере мы создадим похожую карту изображения, но на этот раз с помощью элемента AREA. Обратите внимание на использование атрибута alt:

<P><OBJECT data="navbar1.gif" type="image/gif" usemap="#map1">
   <P>Это навигационная панель.
   </OBJECT>

<MAP name="map1">
 <AREA href="guide.html" 
          alt="Руководство доступа" 
          shape="rect" 
          coords="0,0,118,28">
 <AREA href="search.html" 
          alt="Поиск" 
          shape="rect" 
          coords="184,0,276,28">
 <AREA href="shortcut.html" 
          alt="Вперёд" 
          shape="circle"
          coords="184,200,60">
 <AREA href="top10.html" 
          alt="Десятка лучших" 
          shape="poly" 
          coords="276,0,276,28,100,200,50,50,276,0">
</MAP>

Вот аналогичная версия с использованием элемента IMG вместо элемента OBJECT (с тем же самым MAP):

<P><IMG src="navbar1.gif" usemap="#map1" alt="навигационная панель">

В следующем примере показано, как могут быть разделены карты изображения.

Вложенные элементы OBJECT полезны для обеспечения устранения неисправностей в случае, если агент пользователя не поддерживает определённые форматы. Например:

<P>
<OBJECT data="navbar.png" type="image/png">
  <OBJECT data="navbar.gif" type="image/gif">
    текст с описанием изображения...
  </OBJECT>
</OBJECT>

Если агент пользователя не поддерживает формат PNG, он пытается отобразить изображение в GIF формате. Если он не поддерживает GIF (например, это аудио-браузер), то по умолчанию отображается это текстовое описание, указанное в качестве содержимого внутреннего элемента OBJECT. Когда элементы OBJECT вложены таким образом, авторы могут расположить карты изображений, среди них:

<P>
<OBJECT data="navbar.png" type="image/png" usemap="#map1">
  <OBJECT data="navbar.gif" type="image/gif" usemap="#map1">
     <MAP name="map1">
     <P>Перейдите на сайт:
      <A href="guide.html" shape="rect" coords="0,0,118,28">Руководство доступа</a> |
      <A href="shortcut.html" shape="rect" coords="118,0,184,28">Вперёд</A> |
      <A href="search.html" shape="circle" coords="184,200,60">Поиск</A> |
      <A href="top10.html" shape="poly" coords="276,0,276,28,100,200,50,50,276,0">Десятка лучших</A>
     </MAP>
  </OBJECT>
</OBJECT>

В следующем примере показано, как можно задать гиперссылки для создания неактивных зон в пределах карты изображения. Первая гиперссылка определяет небольшую круглую область не связанную с ссылкой. Вторая гиперссылка определяет круглую область большего размера с теми же координатами центра. В совокупности эти два элемента образуют круг, с активными краями и неактивным центром. В данном случае очень важен порядок расположения гиперссылок, поскольку маленький круг должен переопределять часть территории большого круга.

<MAP name="map1">
<P>
<A shape="circle" coords="100,200,50">Не активеная область.</A>
<A href="outer-ring-link.html" shape="circle" coords="100,200,250">Активеная область.</A>
</MAP>

Аналогичным образом, атрибут nohref элемента AREA указывает, что геометрическая область не имеет ссылки.

13.6.2 Серверные карты изображений

Серверные карты изображений могут быть интересны в тех случаях, когда карта изображения слишком сложна для создания её с помощью клиентской карты изображения.

Серверную карту изображения можно создать только для IMG и INPUT элементов. В случае с элементом IMG, данный элемент не должен располагаться внутри элемента A и ему должен быть задан логический атрибут ismap ([CI]). В случае с элементом INPUT, элемент INPUT должен иметь тип «image».

Когда пользователь активирует ссылку, нажимая на изображение, экранные координаты отправляются непосредственно на сервер, где находится документ. Экранные координаты выражаются в виде значений пикселей экрана по отношению к изображению. Нормативную информацию об определении пикселей и их масштабирование, смотрите в [CSS1].

В следующем примере, активная область определяет ссылку для сервера. Таким образом, нажатие на любую точку изображения вызовет нажатие на соответствующие координаты, предназначенные для отправки на сервер.

<P><A href="http://www.acme.com/cgi-bin/competition">
        <IMG src="game.gif" ismap alt="target"></A>

Координаты места нажатия передаются на сервер следующим образом. Агент пользователя получает новый URI из URI, указанного в href атрибуте элемента A, путём добавления символа `?', за которым следуют «x» и «y» координаты, разделённые запятой. Затем происходит переход по ссылке с помощью нового URI адреса. Например, в приведённом выше примере, если пользователь нажимает на место с координатами x=10, y=27, то происходит переход на «http://www.acme.com/cgi-bin/competition?10,27».

Агенты пользователей, не предлагающие пользователю способ выбора определённых координат (например, неграфические агенты пользователей, которые полагаются на ввод с клавиатуры, аудио агенты пользователей и др.) должны отправить на сервер координаты «0,0» при активации ссылки.


* * *